Bug 1746832: Update MDN compat data. r=Honza

Differential Revision: https://phabricator.services.mozilla.com/D134379
2021-12-24 00:49:34 +00:00 · 2021-12-24 00:49:34 +00:00 · 2696bcc736
--- a/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_js-attribute-change.js
+++ b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_js-attribute-change.js
@ -11,11 +11,11 @@ const {

 // Test the behavior rules are dynamically added

-const ISSUE_CURSOR = {
+const ISSUE_BINDING = {
  type: COMPATIBILITY_ISSUE_TYPE.CSS_PROPERTY,
-  property: "cursor",
-  url: "https://developer.mozilla.org/docs/Web/CSS/cursor",
-  deprecated: false,
+  property: "-moz-binding",
+  url: "https://developer.mozilla.org/docs/Web/CSS/-moz-binding",
+  deprecated: true,
  experimental: false,
 };

@ -31,7 +31,7 @@ const ISSUE_HYPHENS = {
 const TEST_URI = `
  <style>
    .issue {
-      cursor: grab;
+      -moz-binding: none;
    }
  </style>
  <body>
@ -80,8 +80,8 @@ add_task(async function() {
    inspector,
    selectedElementPane,
    allElementsPane,
-    [ISSUE_HYPHENS, ISSUE_CURSOR],
-    [ISSUE_HYPHENS, ISSUE_CURSOR],
+    [ISSUE_HYPHENS, ISSUE_BINDING],
+    [ISSUE_HYPHENS, ISSUE_BINDING],
    async function() {
      content.document.querySelector(".test").classList.add("issue");
    }
--- a/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_js-dom-change.js
+++ b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_js-dom-change.js
@ -12,11 +12,11 @@ const {

 // Test the behavior rules are dynamically added

-const ISSUE_CURSOR = {
+const ISSUE_BINDING = {
  type: COMPATIBILITY_ISSUE_TYPE.CSS_PROPERTY,
-  property: "cursor",
-  url: "https://developer.mozilla.org/docs/Web/CSS/cursor",
-  deprecated: false,
+  property: "-moz-binding",
+  url: "https://developer.mozilla.org/docs/Web/CSS/-moz-binding",
+  deprecated: true,
  experimental: false,
 };

@ -32,7 +32,7 @@ const ISSUE_HYPHENS = {
 const TEST_URI = `
  <style>
    .child {
-      cursor: grab;
+      -moz-binding: none;
    }
  </style>
  <body></body>
@ -62,8 +62,8 @@ add_task(async function() {
    inspector,
    selectedElementPane,
    allElementsPane,
-    [ISSUE_CURSOR],
-    [ISSUE_HYPHENS, ISSUE_CURSOR],
+    [ISSUE_BINDING],
+    [ISSUE_HYPHENS, ISSUE_BINDING],
    async function() {
      const doc = content.document;
      const parent = doc.querySelector("body");
--- a/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_markup-dom-change.js
+++ b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_markup-dom-change.js
@ -12,11 +12,11 @@ const {

 // Test the behavior rules are dynamically added

-const ISSUE_CURSOR = {
+const ISSUE_BINDING = {
  type: COMPATIBILITY_ISSUE_TYPE.CSS_PROPERTY,
-  property: "cursor",
-  url: "https://developer.mozilla.org/docs/Web/CSS/cursor",
-  deprecated: false,
+  property: "-moz-binding",
+  url: "https://developer.mozilla.org/docs/Web/CSS/-moz-binding",
+  deprecated: true,
  experimental: false,
 };

@ -32,7 +32,7 @@ const ISSUE_HYPHENS = {
 const TEST_URI = `
  <style>
    div {
-      cursor: grab;
+      -moz-binding: none;
    }
  </style>
  <body>
@ -52,16 +52,16 @@ add_task(async function() {
  const { allElementsPane, inspector } = await openCompatibilityView();

  info("Check initial issues");
-  await assertIssueList(allElementsPane, [ISSUE_CURSOR, ISSUE_HYPHENS]);
+  await assertIssueList(allElementsPane, [ISSUE_BINDING, ISSUE_HYPHENS]);

  info("Delete node whose child node has CSS compatibility issue");
-  await testNodeRemoval(".parent", inspector, allElementsPane, [ISSUE_CURSOR]);
+  await testNodeRemoval(".parent", inspector, allElementsPane, [ISSUE_BINDING]);

  info("Delete node that has CSS compatibility issue");
  await testNodeRemoval("div", inspector, allElementsPane, []);

  info("Add node that has CSS compatibility issue");
-  await testNodeAddition("div", inspector, allElementsPane, [ISSUE_CURSOR]);
+  await testNodeAddition("div", inspector, allElementsPane, [ISSUE_BINDING]);

  await removeTab(tab);
 });
--- a/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_ruleview-attribute-change.js
+++ b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_dynamic_ruleview-attribute-change.js
@ -11,11 +11,11 @@ const {

 // Test the behavior rules are dynamically added

-const ISSUE_CURSOR = {
+const ISSUE_BINDING = {
  type: COMPATIBILITY_ISSUE_TYPE.CSS_PROPERTY,
-  property: "cursor",
-  url: "https://developer.mozilla.org/docs/Web/CSS/cursor",
-  deprecated: false,
+  property: "-moz-binding",
+  url: "https://developer.mozilla.org/docs/Web/CSS/-moz-binding",
+  deprecated: true,
  experimental: false,
 };

@ -31,7 +31,7 @@ const ISSUE_HYPHENS = {
 const TEST_URI = `
  <style>
    .issue {
-      cursor: grab;
+      -moz-binding: none;
    }
  </style>
  <body>
@ -59,7 +59,7 @@ add_task(async function() {
  await waitForCompatibilityListUpdate;

  info("Check initial issues");
-  await checkPanelIssues(selectedElementPane, allElementsPane, [ISSUE_CURSOR]);
+  await checkPanelIssues(selectedElementPane, allElementsPane, [ISSUE_BINDING]);

  await addNewRule(
    "hyphens",
@ -67,13 +67,13 @@ add_task(async function() {
    inspector,
    selectedElementPane,
    allElementsPane,
-    [ISSUE_CURSOR, ISSUE_HYPHENS]
+    [ISSUE_BINDING, ISSUE_HYPHENS]
  );

  info("Toggle the inline issue rendering it disable");
  await togglePropStatusOnRuleView(inspector, 0, 0);
  info("Check the issues listed in panel");
-  await checkPanelIssues(selectedElementPane, allElementsPane, [ISSUE_CURSOR]);
+  await checkPanelIssues(selectedElementPane, allElementsPane, [ISSUE_BINDING]);

  info("Toggle the class rule rendering it disabled");
  await togglePropStatusOnRuleView(inspector, 1, 0);
--- a/devtools/client/inspector/rules/test/browser_rules_css-compatibility-add-rename-rule.js
+++ b/devtools/client/inspector/rules/test/browser_rules_css-compatibility-add-rename-rule.js
@ -19,7 +19,6 @@ const TEST_URI = `
  }
 </style>
 <body>
-  <div></div>
 </body>`;

 const TEST_DATA_INITIAL = [
@ -46,26 +45,13 @@ const TEST_DATA_INITIAL = [
 ];

 const TEST_DATA_ADD_RULE = [
-  {
-    selector: "div",
-    rules: [
-      {},
-      {},
-      {
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
-        },
-      },
-    ],
-  },
  {
    selector: "body",
    rules: [
      {
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
+        "-moz-float-edge": {
+          value: "content-box",
+          expected: COMPATIBILITY_TOOLTIP_MESSAGE.deprecated,
        },
      },
      {
@ -87,26 +73,13 @@ const TEST_DATA_ADD_RULE = [
 ];

 const TEST_DATA_RENAME_RULE = [
-  {
-    selector: "div",
-    rules: [
-      {},
-      {},
-      {
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
-        },
-      },
-    ],
-  },
  {
    selector: "body",
    rules: [
      {
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
+        "-moz-float-edge": {
+          value: "content-box",
+          expected: COMPATIBILITY_TOOLTIP_MESSAGE.deprecated,
        },
      },
      {
@ -143,7 +116,7 @@ add_task(async function() {
  info(
    "Add an inheritable incompatible rule and check the compatibility status"
  );
-  await addProperty(view, 0, "cursor", "pointer");
+  await addProperty(view, 0, "-moz-float-edge", "content-box");
  await runCSSCompatibilityTests(view, inspector, TEST_DATA_ADD_RULE);

  info("Rename user-select to color and check the compatibility status");
--- a/devtools/client/inspector/rules/test/browser_rules_css-compatibility-toggle-rules.js
+++ b/devtools/client/inspector/rules/test/browser_rules_css-compatibility-toggle-rules.js
@ -16,7 +16,7 @@ const TEST_URI = `
  div {
    color: green;
    background-color: black;
-    cursor: pointer;
+    -moz-float-edge: content-box;
  }
 </style>
 <div class="test-inline" style="color:pink; user-select:none;"></div>
@ -30,9 +30,9 @@ const TEST_DATA_INITIAL = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
+        "-moz-float-edge": {
+          value: "content-box",
+          expected: COMPATIBILITY_TOOLTIP_MESSAGE.deprecated,
        },
      },
    ],
@ -50,9 +50,9 @@ const TEST_DATA_INITIAL = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
+        "-moz-float-edge": {
+          value: "content-box",
+          expected: COMPATIBILITY_TOOLTIP_MESSAGE.deprecated,
        },
      },
    ],
@ -67,7 +67,7 @@ const TEST_DATA_TOGGLE_CLASS_DECLARATION = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: { value: "pointer" },
+        "-moz-float-edge": { value: "content-box" },
      },
    ],
  },
@ -84,7 +84,7 @@ const TEST_DATA_TOGGLE_CLASS_DECLARATION = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: { value: "pointer" },
+        "-moz-float-edge": { value: "content-box" },
      },
    ],
  },
@ -98,7 +98,7 @@ const TEST_DATA_TOGGLE_INLINE = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: { value: "pointer" },
+        "-moz-float-edge": { value: "content-box" },
      },
    ],
  },
@ -112,7 +112,7 @@ const TEST_DATA_TOGGLE_INLINE = [
      {
        color: { value: "green" },
        "background-color": { value: "black" },
-        cursor: { value: "pointer" },
+        "-moz-float-edge": { value: "content-box" },
      },
    ],
  },
@ -126,15 +126,15 @@ add_task(async function() {
  await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
  const { inspector, view } = await openRuleView();

-  const cursor = { cursor: "pointer" };
+  const mozFloatEdge = { "-moz-float-edge": "content-box" };
  const userSelect = { "user-select": "none" };

  await runCSSCompatibilityTests(view, inspector, TEST_DATA_INITIAL);

  info(
-    'Disable cursor: "pointer" which is not cross browser compatible declaration'
+    'Disable -moz-float-edge: "content-box" which is not cross browser compatible declaration'
  );
-  await toggleDeclaration(view, 1, cursor);
+  await toggleDeclaration(view, 1, mozFloatEdge);
  await runCSSCompatibilityTests(
    view,
    inspector,
--- a/devtools/client/inspector/rules/test/browser_rules_css-compatibility-tooltip-telemetry.js
+++ b/devtools/client/inspector/rules/test/browser_rules_css-compatibility-tooltip-telemetry.js
@ -14,7 +14,7 @@
 const TEST_URI = `
 <style>
  div {
-    cursor: pointer;
+    -moz-float-edge: content-box;
  }
 </style>
 <div></div>`;
@ -25,9 +25,9 @@ const TEST_DATA = [
    rules: [
      {},
      {
-        cursor: {
-          value: "pointer",
-          expected: COMPATIBILITY_TOOLTIP_MESSAGE.default,
+        "-moz-float-edge": {
+          value: "content-box",
+          expected: COMPATIBILITY_TOOLTIP_MESSAGE.deprecated,
        },
      },
    ],
--- a/devtools/shared/compatibility/dataset/browsers.json
+++ b/devtools/shared/compatibility/dataset/browsers.json
--- a/devtools/shared/compatibility/dataset/css-properties.json
+++ b/devtools/shared/compatibility/dataset/css-properties.json