Fixed false positive issue and updated the dependencies (#10)

* updated packages and fixed issues caused by updates. * prettier changes * Removed unneeded peer dependency. * updated prettier settings Co-authored-by: Derek Batenhorst <derek.batenhorst@buildertrend.com>
buildertrend · Jan 24, 2022 · 0f2d1e0 · 0f2d1e0
1 parent 6df38fb
commit 0f2d1e0
Show file tree

Hide file tree

Showing 13 changed files with 540 additions and 173 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -1 +1,4 @@
-{}
+{
+  "tabWidth": 2,
+  "endOfLine": "auto"
+}
diff --git a/eslint-plugin-enterprise-extras.code-workspace b/eslint-plugin-enterprise-extras.code-workspace
@@ -6,6 +6,7 @@
   ],
   "settings": {
     "editor.defaultFormatter": "esbenp.prettier-vscode",
-    "editor.formatOnSave": true
+    "editor.formatOnSave": true,
+    "editor.tabSize": 2
   }
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,24 +1,24 @@
 {
   "name": "@buildertrend/eslint-plugin-enterprise-extras",
   "description": "Extra eslint rules for enterprise environments focusing on React and Typescript",
-  "version": "2.0.1",
+  "version": "3.0.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
     "/dist"
   ],
   "dependencies": {
-    "@typescript-eslint/eslint-plugin": "^3.10.1",
-    "@typescript-eslint/parser": "^3.10.1",
-    "eslint": "^7.9.0"
+    "@typescript-eslint/eslint-plugin": "^5.10.0",
+    "@typescript-eslint/parser": "^5.10.0",
+    "eslint": "^7.32.0"
   },
   "devDependencies": {
     "@types/node": "14.14.35",
     "jest": "26.6.3",
     "prettier": "2.3.1",
     "rimraf": "3.0.2",
     "ts-jest": "26.5.4",
-    "typescript": "4.0.6"
+    "typescript": "4.4.4"
   },
   "peerDependencies": {
     "eslint": "^7"

diff --git a/src/rules/no-href-assignment.ts b/src/rules/no-href-assignment.ts
@@ -1,4 +1,4 @@
-import { ESLintUtils, TSESTree } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils, TSESTree } from "@typescript-eslint/utils";
 import { Declaration, Type } from "typescript";
 
 type MessageIds = "avoidHref";
@@ -14,7 +14,11 @@ type Options = [];
  */
 const getParentObjectOfMemberExpression = (
   memberExp: TSESTree.MemberExpression
-): TSESTree.Expression | TSESTree.Identifier | undefined => {
+):
+  | TSESTree.Expression
+  | TSESTree.Identifier
+  | TSESTree.PrivateIdentifier
+  | undefined => {
   const memberExpObj = memberExp.object;
 
   if (memberExpObj.type === "MemberExpression") {
@@ -50,7 +54,6 @@ export default ESLintUtils.RuleCreator(
     type: "suggestion",
     fixable: "code",
     docs: {
-      category: "Best Practices",
       recommended: "error",
       description: "Prefer using location.assign() to make testing easier",
     },

diff --git a/src/rules/no-unhandled-scheduling.ts b/src/rules/no-unhandled-scheduling.ts
@@ -1,4 +1,4 @@
-import { ESLintUtils, TSESTree } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils, TSESTree } from "@typescript-eslint/utils";
 import { isAsExpression, isIdentifier } from "../utils/type-guards";
 
 type MessageIds = "noUnhandledScheduling";
@@ -15,7 +15,6 @@ export default ESLintUtils.RuleCreator(
   meta: {
     type: "suggestion",
     docs: {
-      category: "Best Practices",
       recommended: "warn",
       description:
         "When using Javascript scheduling (`setTimeout` or `setInterval`), it is recommended to support cancelling of the task, especially within React components.",
@@ -29,7 +28,8 @@ export default ESLintUtils.RuleCreator(
   defaultOptions: [],
   create: function (context) {
     const reportError = (callExpression: TSESTree.CallExpression) => {
-      let expression: TSESTree.Expression = callExpression.callee;
+      let expression: TSESTree.Expression | TSESTree.PrivateIdentifier =
+        callExpression.callee;
 
       // Drill down expression if on global/window objects
       if (expression.type === "MemberExpression") {

diff --git a/src/rules/private-component-methods.ts b/src/rules/private-component-methods.ts
@@ -1,4 +1,4 @@
-import { ESLintUtils, TSESTree } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils, TSESTree } from "@typescript-eslint/utils";
 import { isMethod } from "../utils/type-guards";
 
 type MessageIds = "privateMethods";
@@ -23,7 +23,7 @@ const reactLifecycleMethods = new Set([
 ]);
 
 const isLifecycleMethod = (
-  method: TSESTree.ClassProperty | TSESTree.MethodDefinition
+  method: TSESTree.PropertyDefinition | TSESTree.MethodDefinition
 ) => {
   return (
     method.key.type === "Identifier" &&
@@ -40,7 +40,6 @@ export default ESLintUtils.RuleCreator(
     type: "suggestion",
     fixable: "code",
     docs: {
-      category: "Best Practices",
       recommended: "error",
       description:
         "Non-lifecycle methods for React class components should be private to help find unused handlers",
@@ -66,12 +65,13 @@ export default ESLintUtils.RuleCreator(
               !isLifecycleMethod(classEl)
             );
           })
-          .forEach((b: TSESTree.ClassProperty | TSESTree.MethodDefinition) =>
-            context.report({
-              node: b.key,
-              messageId: "privateMethods",
-              fix: (fixer) => fixer.insertTextBefore(b, "private "),
-            })
+          .forEach(
+            (b: TSESTree.PropertyDefinition | TSESTree.MethodDefinition) =>
+              context.report({
+                node: b.key,
+                messageId: "privateMethods",
+                fix: (fixer) => fixer.insertTextBefore(b, "private "),
+              })
           );
       },
     };

diff --git a/src/rules/unregister-events.ts b/src/rules/unregister-events.ts
@@ -1,4 +1,4 @@
-import { ESLintUtils, TSESTree } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils, TSESTree } from "@typescript-eslint/utils";
 
 type MessageIds = "unregisterEventsInClass" | "unregisterEventsInHook";
 type Options = [];
@@ -17,7 +17,6 @@ export default ESLintUtils.RuleCreator(
   meta: {
     type: "problem",
     docs: {
-      category: "Possible Errors",
       recommended: "error",
       description:
         "After registering event listeners in React components, event handlers should be unregistered when the component is unmounted.",
@@ -151,6 +150,10 @@ export default ESLintUtils.RuleCreator(
         pushRemoveSubscription,
       "ClassDeclaration[superClass.property.name=/Component|PureComponent/] ClassProperty[key.name='componentWillUnmount'] CallExpression[callee.name='removeEventListener']":
         pushRemoveSubscription,
+      "ClassDeclaration[superClass.property.name=/Component|PureComponent/] PropertyDefinition[key.name='componentWillUnmount'] CallExpression[callee.object.name=/window|document/][callee.property.name='removeEventListener']":
+        pushRemoveSubscription,
+      "ClassDeclaration[superClass.property.name=/Component|PureComponent/] PropertyDefinition[key.name='componentWillUnmount'] CallExpression[callee.name='removeEventListener']":
+        pushRemoveSubscription,
 
       // Track event listener registrations made in hook components
       "VariableDeclarator[id.name=/^[A-Z].+/] CallExpression[callee.name='addEventListener']":

diff --git a/src/utils/type-guards.ts b/src/utils/type-guards.ts
@@ -1,9 +1,9 @@
-import { TSESTree } from "@typescript-eslint/experimental-utils";
+import { TSESTree } from "@typescript-eslint/utils";
 
-export const isClassProperty = (
+export const isPropertyDefinition = (
   node: TSESTree.Node
-): node is TSESTree.ClassProperty => {
-  return node.type === "ClassProperty";
+): node is TSESTree.PropertyDefinition => {
+  return node.type === "PropertyDefinition";
 };
 
 export const isMethodDefinition = (
@@ -15,17 +15,17 @@ export const isMethodDefinition = (
 const funcExpRegex = /^(Arrow)?FunctionExpression$/;
 export const isMethod = (
   node: TSESTree.ClassElement
-): node is TSESTree.ClassProperty | TSESTree.MethodDefinition => {
+): node is TSESTree.PropertyDefinition | TSESTree.MethodDefinition => {
   return (
-    (isClassProperty(node) &&
+    (isPropertyDefinition(node) &&
       node.value &&
       funcExpRegex.test(node.value.type)) ||
     isMethodDefinition(node)
   );
 };
 
 export const isIdentifier = (
-  node: TSESTree.Expression
+  node: TSESTree.Expression | TSESTree.PrivateIdentifier
 ): node is TSESTree.Identifier => {
   return node.type === "Identifier";
 };

diff --git a/tests/rules/no-href-assignment.test.ts b/tests/rules/no-href-assignment.test.ts
@@ -1,5 +1,5 @@
 import rule from "../../src/rules/no-href-assignment";
-import { ESLintUtils } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils } from "@typescript-eslint/utils";
 import { resolve, join } from "path";
 
 const ruleTester = new ESLintUtils.RuleTester({

diff --git a/tests/rules/no-unhandled-scheduling.test.ts b/tests/rules/no-unhandled-scheduling.test.ts
@@ -1,5 +1,5 @@
 import rule from "../../src/rules/no-unhandled-scheduling";
-import { ESLintUtils } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils } from "@typescript-eslint/utils";
 import { resolve, join } from "path";
 
 const ruleTester = new ESLintUtils.RuleTester({

diff --git a/tests/rules/private-component-methods.test.ts b/tests/rules/private-component-methods.test.ts
@@ -1,5 +1,5 @@
 import rule from "../../src/rules/private-component-methods";
-import { ESLintUtils } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils } from "@typescript-eslint/utils";
 import { resolve, join } from "path";
 
 const ruleTester = new ESLintUtils.RuleTester({

diff --git a/tests/rules/unregister-events.test.ts b/tests/rules/unregister-events.test.ts
@@ -1,5 +1,5 @@
 import rule from "../../src/rules/unregister-events";
-import { ESLintUtils } from "@typescript-eslint/experimental-utils";
+import { ESLintUtils } from "@typescript-eslint/utils";
 import { resolve, join } from "path";
 
 const ruleTester = new ESLintUtils.RuleTester({
@@ -29,11 +29,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentDidMount() {
-          window.addEventListener("scroll", handler);
+          window.addEventListener("scroll", this.handler);
         }
 
         componentWillUnmount() {
-          window.removeEventListener("scroll", handler);
+          window.removeEventListener("scroll", this.handler);
         }
 
         render() {
@@ -48,11 +48,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentDidMount() {
-          window.addEventListener("scroll", handler);
+          window.addEventListener("scroll", this.handler);
         }
 
         componentWillUnmount() {
-          removeEventListener("scroll", handler);
+          removeEventListener("scroll", this.handler);
         }
 
         render() {
@@ -67,11 +67,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentDidMount = () => {
-          window.addEventListener("scroll", handler);
+          window.addEventListener("scroll", this.handler);
         }
 
         componentWillUnmount = () => {
-          window.removeEventListener("scroll", handler);
+          window.removeEventListener("scroll", this.handler);
         }
 
         render() {
@@ -86,11 +86,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentDidMount() {
-          window.addEventListener("scroll", handler);
+          window.addEventListener("scroll", this.handler);
         }
 
         componentWillUnmount() {
-          window.removeEventListener("scroll", handler);
+          window.removeEventListener("scroll", this.handler);
         }
 
         render() {
@@ -105,11 +105,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentDidMount() {
-          addEventListener("scroll", handler);
+          addEventListener("scroll", this.handler);
         }
 
         componentWillUnmount() {
-          removeEventListener("scroll", handler);
+          removeEventListener("scroll", this.handler);
         }
 
         render() {
@@ -229,11 +229,11 @@ ruleTester.run("unregister-events", rule, {
         };
 
         componentWillUnmount() {
-          window.removeEventListener("scroll", handler);
+          window.removeEventListener("scroll", this.handler);
         }
 
         render() {
-          return <div onClick={() => addEventListener("scroll", handler)} />;
+          return <div onClick={() => addEventListener("scroll", this.handler)} />;
         }
       }
     `,
@@ -247,7 +247,7 @@ ruleTester.run("unregister-events", rule, {
           };
 
           componentDidMount() {
-            window.addEventListener("scroll", handler);
+            window.addEventListener("scroll", this.handler);
           }
 
           render() {
@@ -269,7 +269,7 @@ ruleTester.run("unregister-events", rule, {
           };
 
           componentDidMount = () => {
-            window.addEventListener("scroll", handler);
+            window.addEventListener("scroll", this.handler);
           }
 
           render() {
@@ -291,11 +291,11 @@ ruleTester.run("unregister-events", rule, {
           };
 
           componentDidMount() {
-            window.addEventListener("scroll", handler);
+            window.addEventListener("scroll", this.handler);
           }
 
           componentWillUnmount() {
-            // window.removeEventListener("scroll", handler);
+            // window.removeEventListener("scroll", this.handler);
           }
 
           render() {