Backed out changeset 0569381b5e5f (bug 1422635) for failing ESlint at /builds/worker/checkouts/gecko/devtools/client/shared/test/browser_inplace-editor_autocomplete_css_variable.js on a CLOSED TREE

devtools/client/inspector/rules/views/text-property-editor.js

@@ -316,7 +316,6 @@ TextPropertyEditor.prototype = {
         multiline: true,
         maxWidth: () => this.container.getBoundingClientRect().width,
         cssProperties: this.cssProperties,
-        cssVariables: this.rule.elementStyle.variables,
       });
 
       this.ruleView.highlighters.on("hover-shape-point", this._onHoverShapePoint);

devtools/client/shared/inplace-editor.js

@@ -122,7 +122,6 @@ function isKeyIn(key, ...keys) {
  *              from `element` to the new input.
  *      defaults to false
  *    {Object} cssProperties: An instance of CSSProperties.
- *    {Object} cssVariables: A Map object containing all CSS variables.
  *    {Number} defaultIncrement: The value by which the input is incremented
  *      or decremented by default (0.1 for properties like opacity and 1 by default)
  */
@@ -225,7 +224,6 @@ function InplaceEditor(options, event) {
   this.doc = doc;
   this.elt.inplaceEditor = this;
   this.cssProperties = options.cssProperties;
-  this.cssVariables = options.cssVariables || new Map();
   this.change = options.change;
   this.done = options.done;
   this.contextMenu = options.contextMenu;
@@ -1335,16 +1333,8 @@ InplaceEditor.prototype = {
           startCheckQuery = "";
         }
 
-        // Check if the query to be completed is a CSS variable.
-        let varMatch = /^var\(([^\s]+$)/.exec(startCheckQuery);
-
-        if (varMatch && varMatch.length == 2) {
-          startCheckQuery = varMatch[1];
-          list = this._getCSSVariableNames();
-        } else {
-          list = ["!important",
-                  ...this._getCSSValuesForPropertyName(this.property.name)];
-        }
+        list = ["!important",
+                ...this._getCSSValuesForPropertyName(this.property.name)];
 
         if (query == "") {
           // Do not suggest '!important' without any manually typed character.
@@ -1500,15 +1490,6 @@ InplaceEditor.prototype = {
   _getCSSValuesForPropertyName: function (propertyName) {
     return this.cssProperties.getValues(propertyName);
   },
-
-  /**
-   * Returns the list of all CSS variables to use for the autocompletion.
-   *
-   * @return {Array} array of CSS variable names (Strings)
-   */
-  _getCSSVariableNames: function () {
-    return Array.from(this.cssVariables.keys()).sort();
-  },
 };
 
 /**

devtools/client/shared/test/browser.ini

@@ -148,7 +148,6 @@ skip-if = e10s # Bug 1221911, bug 1222289, frequent e10s timeouts
 [browser_inplace-editor_autocomplete_01.js]
 [browser_inplace-editor_autocomplete_02.js]
 [browser_inplace-editor_autocomplete_offset.js]
-[browser_inplace-editor_autocomplete_css_variable.js]
 [browser_inplace-editor_maxwidth.js]
 [browser_keycodes.js]
 [browser_key_shortcuts.js]

devtools/client/shared/test/browser_inplace-editor_autocomplete_css_variable.js

@@ -1,84 +0,0 @@
-/* vim: set ts=2 et sw=2 tw=80: */
-/* Any copyright is dedicated to the Public Domain.
-   http://creativecommons.org/publicdomain/zero/1.0/ */
-/* import-globals-from helper_inplace_editor.js */
-
-"use strict";
-
-const AutocompletePopup = require("devtools/client/shared/autocomplete-popup");
-const { InplaceEditor } = require("devtools/client/shared/inplace-editor");
-loadHelperScript("helper_inplace_editor.js");
-
-// Test the inplace-editor autocomplete popup for variable suggestions.
-// Using a mocked list of CSS variables to avoid test failures linked to
-// engine changes (new property, removed property, ...).
-// Also using a mocked list of CSS properties to avoid autocompletion when
-// typing in "var"
-
-// format :
-//  [
-//    what key to press,
-//    expected input box value after keypress,
-//    selected suggestion index (-1 if popup is hidden),
-//    number of suggestions in the popup (0 if popup is hidden),
-//  ]
-const testData = [
-  ["v", "v", -1, 0],
-  ["a", "va", -1, 0],
-  ["r", "var", -1, 0],
-  ["(", "var(", -1, 0],
-  ["-", "var(--abc", 0, 2],
-  ["VK_BACK_SPACE", "var(-", -1, 0],
-  ["-", "var(--abc", 0, 2],
-  ["VK_DOWN", "var(--def", 1, 2],
-  ["VK_DOWN", "var(--abc", 0, 2],
-  ["VK_LEFT", "var(--abc", -1, 0],
-];
-
-const mockGetCSSValuesForPropertyName = function (propertyName) {
-  return [];
-};
-
-const mockGetCSSVariableNames = function () {
-  return [
-    "--abc",
-    "--def",
-  ]
-};
-
-add_task(function* () {
-  yield addTab("data:text/html;charset=utf-8," +
-    "inplace editor CSS variable autocomplete");
-  let [host, win, doc] = yield createHost();
-
-  let xulDocument = win.top.document;
-  let popup = new AutocompletePopup(xulDocument, { autoSelect: true });
-
-  yield new Promise(resolve => {
-    createInplaceEditorAndClick({
-      start: runAutocompletionTest,
-      contentType: InplaceEditor.CONTENT_TYPES.CSS_VALUE,
-      property: {
-        name: "color"
-      },
-      done: resolve,
-      popup: popup
-    }, doc);
-  });
-
-  popup.destroy();
-  host.destroy();
-  gBrowser.removeCurrentTab();
-});
-
-let runAutocompletionTest = Task.async(function* (editor) {
-  info("Starting to test for css variable completion");
-  editor._getCSSValuesForPropertyName = mockGetCSSValuesForPropertyName;
-  editor._getCSSVariableNames = mockGetCSSVariableNames;
-
-  for (let data of testData) {
-    yield testCompletion(data, editor);
-  }
-
-  EventUtils.synthesizeKey("VK_RETURN", {}, editor.input.defaultView);
-});