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

.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

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({

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({

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.
 

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");

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");

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");

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");
 

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");

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");

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;

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");

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");
 

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");

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");

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) {

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 [];
         }
       }
     };

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");

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");

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");

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() {

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");

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");

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");

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",

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");

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.");
       }

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"));
 

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;

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() {
+        HandleEventClick.prototype.handleEvent = function() {
-          window.foobar = "handleEventClick";
+          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() {
+        BoundHandleEventClick.prototype.handleEvent = function() {
-          window.foobar = "boundHandleEventClick";
+          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 HandleEventClick();
-        new boundHandleEventClick();
+        new BoundHandleEventClick();
 
         const initButton = document.getElementById("initialSetup");
         initButton.addEventListener("click", initialSetup);

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>

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>