[eslint] Fix strict tsc issues in the no-imperative-dom-api

Bug: 407085691
Change-Id: If07beab48274b5491e78576556434db3b3670495
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6414778
Commit-Queue: Danil Somsikov <[email protected]>
Reviewed-by: Nikolay Vitkov <[email protected]>

Author: danilsomsikov

scripts/eslint_rules/lib/no-imperative-dom-api.js

@@ -77,22 +77,21 @@ module.exports = {
     function processReference(reference, domFragment) {
       const parent = reference.parent;
       const isAccessed = parent.type === 'MemberExpression' && parent.object === reference;
-      const property = isAccessed ? parent.property : null;
+      if (!isAccessed) {
+        return false;
+      }
+      const property = parent.property;
       const grandParent = parent.parent;
-      const isPropertyAssignment =
-          isAccessed && grandParent.type === 'AssignmentExpression' && grandParent.left === parent;
+      const isPropertyAssignment = grandParent.type === 'AssignmentExpression' && grandParent.left === parent;
       const propertyValue = isPropertyAssignment ? grandParent.right : null;
-      const isMethodCall = isAccessed && grandParent.type === 'CallExpression' && grandParent.callee === parent;
-      const firstArg = isMethodCall ? grandParent.arguments[0] : null;
-      const secondArg = isMethodCall ? grandParent.arguments[1] : null;
+      const isMethodCall = grandParent.type === 'CallExpression' && grandParent.callee === parent;
       const grandGrandParent = grandParent.parent;
-      const isPropertyMethodCall = isAccessed && grandParent.type === 'MemberExpression' &&
-          grandParent.object === parent && grandGrandParent.type === 'CallExpression' &&
-          grandGrandParent.callee === grandParent;
+      const isPropertyMethodCall = grandParent.type === 'MemberExpression' && grandParent.object === parent &&
+          grandGrandParent.type === 'CallExpression' && grandGrandParent.callee === grandParent;
       const propertyMethodArgument = isPropertyMethodCall ? grandGrandParent.arguments[0] : null;
-      const isSubpropertyAssignment = isAccessed && grandParent.type === 'MemberExpression' &&
-          grandParent.object === parent && grandParent.property.type === 'Identifier' &&
-          grandGrandParent.type === 'AssignmentExpression' && grandGrandParent.left === grandParent;
+      const isSubpropertyAssignment = grandParent.type === 'MemberExpression' && grandParent.object === parent &&
+          grandParent.property.type === 'Identifier' && grandGrandParent.type === 'AssignmentExpression' &&
+          grandGrandParent.left === grandParent;
       const subproperty =
           isSubpropertyAssignment && grandParent.property.type === 'Identifier' ? grandParent.property : null;
       const subpropertyValue = isSubpropertyAssignment ? grandGrandParent.right : null;
@@ -102,6 +101,8 @@ module.exports = {
             return true;
           }
         } else if (isMethodCall) {
+          const firstArg = grandParent.arguments[0];
+          const secondArg = grandParent.arguments[1];
           if (isIdentifier(property, 'addEventListener')) {
             const event = getEvent(firstArg);
             const value = secondArg;
@@ -136,19 +137,21 @@ module.exports = {
         if (!reference.processed) {
           continue;
         }
-        const expression = getEnclosingExpression(reference.node);
-        if (!expression) {
+        const range = getEnclosingExpression(reference.node)?.range;
+        if (!range) {
           continue;
         }
-        const range = expression.range;
         ranges.push(range);
         for (const child of domFragment.children) {
           ranges.push(...getRangesToRemove(child));
         }
       }
 
       if (domFragment.initializer && domFragment.references.every(r => r.processed)) {
-        ranges.push(getEnclosingExpression(domFragment.initializer).range);
+        const range = getEnclosingExpression(domFragment.initializer)?.range;
+        if (range) {
+          ranges.push(range);
+        }
       }
       for (const range of ranges) {
         while ([' ', '\n'].includes(sourceCode.text[range[0] - 1])) {
@@ -180,15 +183,15 @@ module.exports = {
           const template = 'html`' + domFragment.toTemplateLiteral(sourceCode).join('') + '`';
           let replacementLocation = domFragment.replacementLocation;
 
-          if (replacementLocation.type === 'VariableDeclarator') {
-            domFragment.initializer = null;
+          if (replacementLocation?.type === 'VariableDeclarator') {
+            domFragment.initializer = undefined;
             return [
               fixer.replaceText(replacementLocation.init, template),
               ...getRangesToRemove(domFragment).map(range => fixer.removeRange(range)),
             ];
           }
 
-          if (replacementLocation.parent.type === 'ExportNamedDeclaration') {
+          if (replacementLocation?.parent?.type === 'ExportNamedDeclaration') {
             replacementLocation = replacementLocation.parent;
           }
           const text = `

scripts/eslint_rules/lib/no-imperative-dom-api/adorner.js

@@ -43,6 +43,7 @@ module.exports = {
           }
           return true;
         }
+        return false;
       },
       NewExpression(node) {
         if (isMemberExpression(

scripts/eslint_rules/lib/no-imperative-dom-api/class-member.js

@@ -21,13 +21,18 @@ class ClassMember {
   /** @type {Node} */
   classDeclaration;
 
+  /** @param {Node} classDeclaration */
+  constructor(classDeclaration) {
+    this.classDeclaration = classDeclaration;
+  }
+
   /** @type {Node|undefined} */
   initializer;
 
   /**
    * @param {Node} node
    * @param {SourceCode} sourceCode
-   * @return {ClassMember}
+   * @return {ClassMember|null}
    */
   static getOrCreate(node, sourceCode) {
     const classDeclaration = getEnclosingClassDeclaration(node);
@@ -42,8 +47,7 @@ class ClassMember {
     const memberName = sourceCode.getText(node);
     let classMember = classMembers.get(memberName);
     if (!classMember) {
-      classMember = new ClassMember();
-      classMember.classDeclaration = classDeclaration;
+      classMember = new ClassMember(classDeclaration);
       classMembers.set(memberName, classMember);
     }
     classMember.references.add(node);

scripts/eslint_rules/lib/no-imperative-dom-api/dom-fragment.js

@@ -24,7 +24,7 @@ class DomFragment {
   /** @type {{key: string, value: Node}[]} */ style = [];
   /** @type {{key: string, value: Node}[]} */ eventListeners = [];
   /** @type {{key: string, value: Node|string}[]} */ bindings = [];
-  /** @type {Node} */ textContent;
+  /** @type {Node|undefined} */ textContent;
   /** @type {DomFragment[]} */ children = [];
   /** @type {DomFragment|undefined} */ parent;
   /** @type {string|undefined} */ expression;
@@ -255,7 +255,10 @@ function getKey(node, sourceCode) {
   }
   const property = getEnclosingProperty(node);
   if (property) {
-    return ClassMember.getOrCreate(property, sourceCode);
+    const classMember = ClassMember.getOrCreate(property, sourceCode);
+    if (classMember) {
+      return classMember;
+    }
   }
   return node;
 }