Bug 1589333 - Enable ESLint for all of devtools/client/shared/ (manual changes). r=Standard8,jdescottes

Differential Revision: https://phabricator.services.mozilla.com/D50637 --HG-- extra : moz-landing-system : lando
2019-11-04 18:05:14 +00:00 · 2019-11-04 18:05:14 +00:00 · 8640fa2942
commit 8640fa2942
parent e6f8e04a02
32 changed files with 91 additions and 28 deletions
--- a/.eslintignore
+++ b/.eslintignore
@ -56,9 +56,6 @@ browser/extensions/formautofill/phonenumberutils/PhoneNumberMetaData.jsm
 # devtools/ exclusions
 devtools/client/inspector/markup/test/doc_markup_events_*.html
 devtools/client/performance/components/test/test_jit_optimizations_01.html
-devtools/client/shared/test/*.html
-devtools/client/shared/components/test/mochitest/*.html
-!devtools/client/shared/components/test/mochitest/test_stack-trace.html
 devtools/server/tests/browser/storage-*.html
 !devtools/server/tests/browser/storage-unsecured-iframe.html
 devtools/server/tests/browser/stylesheets-nested-iframes.html
--- a/devtools/client/shared/components/test/mochitest/test_GridElementWidthResizer.html
+++ b/devtools/client/shared/components/test/mochitest/test_GridElementWidthResizer.html
@ -75,6 +75,9 @@
    <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 const FUDGE_FACTOR = .5;
 function aboutEq(a, b) {
  dumpn(`Checking ${a} ~= ${b}`);
@ -93,7 +96,7 @@ window.onload = async function () {
    const resizedA = [];
    const resizedD = [];

-    const scene = ReactDOM.render([
+    ReactDOM.render([
      dom.header({}, "header"),
      dom.aside({className: "a"}, "A"),
      GridElementWidthResizer({
--- a/devtools/client/shared/components/test/mochitest/test_GridElementWidthResizer_RTL.html
+++ b/devtools/client/shared/components/test/mochitest/test_GridElementWidthResizer_RTL.html
@ -76,6 +76,9 @@
    <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 const FUDGE_FACTOR = .5;
 function aboutEq(a, b) {
  dumpn(`Checking ${a} ~= ${b}`);
@ -94,7 +97,7 @@ window.onload = async function () {
    const resizedA = [];
    const resizedD = [];

-    const scene = ReactDOM.render([
+    ReactDOM.render([
      dom.header({}, "header"),
      dom.aside({className: "a"}, "A"),
      GridElementWidthResizer({
--- a/devtools/client/shared/components/test/mochitest/test_HSplitBox_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_HSplitBox_01.html
@ -24,6 +24,9 @@ Basic tests for the HSplitBox component.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 const FUDGE_FACTOR = .1;
 function aboutEq(a, b) {
  dumpn(`Checking ${a} ~= ${b}`);
@ -57,7 +60,7 @@ window.onload = async function () {
      return el;
    }

-    const box = await renderBox();
+    await renderBox();

    // Test that we properly rendered our two panes.

--- a/devtools/client/shared/components/test/mochitest/test_accordion.html
+++ b/devtools/client/shared/components/test/mochitest/test_accordion.html
@ -22,6 +22,8 @@ Test that Accordion renders correctly.

 "use strict";

+/* global sinon */
+
 window.onload = async function() {
  try {
    const { button, div } = require("devtools/client/shared/vendor/react-dom-factories");
--- a/devtools/client/shared/components/test/mochitest/test_frame_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_frame_01.html
@ -21,6 +21,9 @@ with optional columns, unknown and non-URL sources.
    <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_frame_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_frame_02.html
@ -16,6 +16,9 @@ Test that the frame component reacts to source-map pref changse.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const Services = browserRequire("Services");
--- a/devtools/client/shared/components/test/mochitest/test_list_keyboard.html
+++ b/devtools/client/shared/components/test/mochitest/test_list_keyboard.html
@ -63,7 +63,7 @@ window.onload = function() {

    const tree = ReactDOM.render(list, document.body);
    const listEl = findRenderedDOMComponentWithClass(tree, "list");
-    const items = scryRenderedDOMComponentsWithTag(tree, "li");
+    scryRenderedDOMComponentsWithTag(tree, "li");
    const defaultFocus = listEl.ownerDocument.body;

    function blurEl(el) {
@ -250,7 +250,7 @@ window.onload = function() {
    }];

    for (const test of tests) {
-      const { action, condition, event, state, name } = test;
+      const { action, event, state, name } = test;

      is(listEl, findRenderedDOMComponentWithClass(tree, "list"), "Sanity check");

--- a/devtools/client/shared/components/test/mochitest/test_notification_box_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_01.html
@ -21,6 +21,9 @@ Test for Notification Box. The test is checking:
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_notification_box_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_02.html
@ -17,6 +17,9 @@ Test for Notification Box. The test is checking:
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_notification_box_03.html
+++ b/devtools/client/shared/components/test/mochitest/test_notification_box_03.html
@ -17,6 +17,9 @@ Test for Notification Box. The test is checking:
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
@ -29,7 +32,7 @@ window.onload = async function () {
    const notificationNode = ReactDOM.findDOMNode(notificationBox);

    let buttonCallbackExecuted = false;
-    var buttons = [{
+    const buttons = [{
      label: "Button1",
      callback: () => {
        buttonCallbackExecuted = true;
--- a/devtools/client/shared/components/test/mochitest/test_searchbox-with-autocomplete.html
+++ b/devtools/client/shared/components/test/mochitest/test_searchbox-with-autocomplete.html
@ -85,7 +85,6 @@ window.onload = async function () {
    },
    onChange: () => null,
  });
-  const { refs } = component;

  async function testSearchBoxWithAutocomplete() {
    ok(!$(".devtools-autocomplete-popup"), "Autocomplete list not visible");
--- a/devtools/client/shared/components/test/mochitest/test_sidebar_toggle.html
+++ b/devtools/client/shared/components/test/mochitest/test_sidebar_toggle.html
@ -16,6 +16,9 @@ Test sidebar toggle button
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  const SidebarToggle = browserRequire("devtools/client/shared/components/SidebarToggle.js");

--- a/devtools/client/shared/components/test/mochitest/test_tabs_accessibility.html
+++ b/devtools/client/shared/components/test/mochitest/test_tabs_accessibility.html
@ -16,6 +16,9 @@ Test tabs accessibility.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tabs_menu.html
+++ b/devtools/client/shared/components/test/mochitest/test_tabs_menu.html
@ -21,6 +21,9 @@ Test all-tabs menu.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree-view_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree-view_01.html
@ -35,7 +35,7 @@ window.onload = function() {
    const TreeView =
      browserRequire("devtools/client/shared/components/tree/TreeView");

-    const props = {
+    const _props = {
      ...TEST_TREE_VIEW_INTERFACE,
      renderValue: props => {
        return (props.value === "C" ?
@ -47,7 +47,7 @@ window.onload = function() {
        );
      },
    };
-    const treeView = React.createElement(TreeView, props);
+    const treeView = React.createElement(TreeView, _props);
    const tree = ReactDOM.render(treeView, document.body);
    const treeViewEl = findRenderedDOMComponentWithClass(tree, "treeTable");
    const rows = scryRenderedDOMComponentsWithClass(tree, "treeRow");
@ -251,7 +251,7 @@ window.onload = function() {
    }];

    for (const test of tests) {
-      const { action, condition, event, state, name } = test;
+      const { action, event, state, name } = test;

      info(name);
      if (event) {
--- a/devtools/client/shared/components/test/mochitest/test_tree-view_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree-view_02.html
@ -74,7 +74,7 @@ window.onload = function() {
        }];

        for (const test of tests) {
-          const { action, condition, event, state, name } = test;
+          const { action, event, state, name } = test;

          info(name);
          if (event) {
@ -98,6 +98,7 @@ window.onload = function() {
          if (label === "C") {
            return ["hide"];
          }
+          return [];
        }
      }
    };
--- a/devtools/client/shared/components/test/mochitest/test_tree_01.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_01.html
@ -17,6 +17,9 @@ depth.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_02.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_02.html
@ -16,6 +16,9 @@ Test that collapsed subtrees aren't rendered.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_03.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_03.html
@ -16,6 +16,9 @@ Test Tree's autoExpandDepth.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_04.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_04.html
@ -16,6 +16,9 @@ Test that we only render visible tree items.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    function getSpacerHeights() {
--- a/devtools/client/shared/components/test/mochitest/test_tree_07.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_07.html
@ -17,6 +17,9 @@ Test that arrows get the open attribute when their item's children are expanded.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_08.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_08.html
@ -18,6 +18,9 @@ other inputs.
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_09.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_09.html
@ -17,6 +17,9 @@ Test that when an item in the Tree component is expanded or collapsed the approp
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_10.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_10.html
@ -17,6 +17,9 @@ Test that when an item in the Tree component is expanded or collapsed the approp
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
@ -32,7 +35,7 @@ window.onload = async function () {
      return ReactDOM.render(Tree(treeProps), window.document.body);
    }

-    const tree = renderTree({ focused: "A" });
+    renderTree({ focused: "A" });

    isRenderedTree(document.body.textContent, [
      "A:true",
--- a/devtools/client/shared/components/test/mochitest/test_tree_11.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_11.html
@ -29,6 +29,9 @@ Test that when an item in the Tree component is focused by arrow key, the view i
 <pre id="test">
 <script src="head.js" type="application/javascript"></script>
 <script type="application/javascript">
+
+'use strict'
+
 window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
--- a/devtools/client/shared/components/test/mochitest/test_tree_14.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_14.html
@ -29,7 +29,6 @@ window.onload = async function() {
      Simulate,
      findRenderedDOMComponentWithClass,
      findRenderedDOMComponentWithTag,
-      scryRenderedDOMComponentsWithTag,
    } = browserRequire("devtools/client/shared/vendor/react-dom-test-utils");
    const Tree = createFactory(
      browserRequire("devtools/client/shared/components/VirtualizedTree"));
@ -209,7 +208,7 @@ window.onload = async function() {
    }];

    for (const test of tests) {
-      const { action, condition, event, props, name } = test;
+      const { action, event, props, name } = test;

      info(name);
      if (event) {
@ -225,6 +224,7 @@ window.onload = async function() {
      if (test.activeElement) {
        const expected = typeof test.activeElement === "string" ?
          els[test.activeElement] : test.activeElement;
+        // eslint-disable-next-line no-debugger
        if (document.activeElement!==expected) {debugger;}
        is(document.activeElement, expected, "Focus is set correctly.");
      }
--- a/devtools/client/shared/components/test/mochitest/test_tree_16.html
+++ b/devtools/client/shared/components/test/mochitest/test_tree_16.html
@ -36,8 +36,6 @@ window.onload = async function () {
  try {
    const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
    const { createFactory } = browserRequire("devtools/client/shared/vendor/react");
-    const { Simulate } =
-      browserRequire("devtools/client/shared/vendor/react-dom-test-utils");
    const Tree =
      createFactory(browserRequire("devtools/client/shared/components/VirtualizedTree"));

--- a/devtools/client/shared/test/doc_event-listeners-01.html
+++ b/devtools/client/shared/test/doc_event-listeners-01.html
@ -16,6 +16,7 @@

      window.addEventListener("load", function() {
        function initialSetup(event) {
+          // eslint-disable-next-line no-debugger
          debugger;
          const button = document.querySelector("button");
          button.onclick = clickHandler;
--- a/devtools/client/shared/test/doc_event-listeners-03.html
+++ b/devtools/client/shared/test/doc_event-listeners-03.html
@ -20,6 +20,7 @@
        function initialSetup(event) {
          const button = document.getElementById("initialSetup");
          button.removeEventListener("click", initialSetup);
+          // eslint-disable-next-line no-debugger
          debugger;
        }

@ -27,24 +28,24 @@
          window.foobar = "clicker";
        }

-        function handleEventClick() {
+        function HandleEventClick() {
          const button = document.getElementById("handleEventClick");
          // Create a long prototype chain to test for weird edge cases.
          button.addEventListener("click", Object.create(Object.create(this)));
        }

-        handleEventClick.prototype.handleEvent = function() {
-          window.foobar = "handleEventClick";
+        HandleEventClick.prototype.handleEvent = function() {
+          window.foobar = "HandleEventClick";
        };

-        function boundHandleEventClick() {
+        function BoundHandleEventClick() {
          const button = document.getElementById("boundHandleEventClick");
          this.handleEvent = this.handleEvent.bind(this);
          button.addEventListener("click", this);
        }

-        boundHandleEventClick.prototype.handleEvent = function() {
-          window.foobar = "boundHandleEventClick";
+        BoundHandleEventClick.prototype.handleEvent = function() {
+          window.foobar = "BoundHandleEventClick";
        };

        const button = document.getElementById("clicker");
@ -52,8 +53,8 @@
        const boundClicker = clicker.bind(this).bind(this).bind(this);
        button.addEventListener("click", boundClicker);

-        new handleEventClick();
-        new boundHandleEventClick();
+        new HandleEventClick();
+        new BoundHandleEventClick();

        const initButton = document.getElementById("initialSetup");
        initButton.addEventListener("click", initialSetup);
--- a/devtools/client/shared/test/doc_inline-debugger-statement.html
+++ b/devtools/client/shared/test/doc_inline-debugger-statement.html
@ -13,7 +13,10 @@

    <script type="text/javascript">
      "use strict";
+      
+      /* exported runDebuggerStatement */
      function runDebuggerStatement() {
+        // eslint-disable-next-line no-debugger
        debugger;
      }
    </script>
--- a/devtools/client/shared/test/doc_native-event-handler.html
+++ b/devtools/client/shared/test/doc_native-event-handler.html
@ -8,10 +8,11 @@
    <script type="text/javascript">
      "use strict";

+      /* exported initialSetup */
      function initialSetup(event) {
+        // eslint-disable-next-line no-debugger
        debugger;
      }
-
      window.addEventListener("load", function() {});
    </script>
  </head>