Migrate lint rules to TS

Bug: 397586315
Change-Id: I62df80eb3bd891e3f86998b82af71af6066543c3
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6431670
Commit-Queue: Danil Somsikov <[email protected]>
Auto-Submit: Alex Rudenko <[email protected]>
Reviewed-by: Danil Somsikov <[email protected]>
Reviewed-by: Nikolay Vitkov <[email protected]>

Author: OrKoN

scripts/eslint_rules/lib/check-css-import.js renamed to scripts/eslint_rules/lib/check-css-import.ts

@@ -1,36 +1,34 @@
 // Copyright 2021 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
 
 /**
  * @fileoverview Prevent usage of customElements.define() and use the helper
  * function instead
  */
 
-// ------------------------------------------------------------------------------
-// Rule Definition
-// ------------------------------------------------------------------------------
+import * as fs from 'fs';
+import * as path from 'path';
 
-const fs = require('fs');
-const path = require('path');
+import {createRule} from './tsUtils.ts';
 
-/**
- * @type {import('eslint').Rule.RuleModule}
- */
-module.exports = {
+export default createRule({
+  name: 'check-css-import',
   meta: {
     type: 'problem',
-
     docs: {
       description: 'check CSS file imports',
       category: 'Possible Errors',
     },
     fixable: 'code',
-    schema: []  // no options
+    messages: {
+      fileDoesNotExist: 'File {{filename}} does not exist. Check you are importing the correct file.',
+    },
+    schema: [],  // no options
   },
+  defaultOptions: [],
   create: function(context) {
-    const filename = context.filename ?? context.getFilename();
+    const filename = context.getFilename();
     return {
       ImportDeclaration(node) {
         const importPath = path.normalize(`${node.source.value}`);
@@ -43,11 +41,12 @@ module.exports = {
           if (!fs.existsSync(importedCSS)) {
             context.report({
               node,
-              message: `File ${path.basename(importedCSS)} does not exist. Check you are importing the correct file.`
+              messageId: 'fileDoesNotExist',
+              data: {filename: path.basename(importedCSS)},
             });
           }
         }
-      }
+      },
     };
-  }
-};
+  },
+});

scripts/eslint_rules/lib/no-a-tags-in-lit.js renamed to scripts/eslint_rules/lib/no-a-tags-in-lit.ts

@@ -1,22 +1,25 @@
 // Copyright 2021 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
 
-const {isLitHtmlTemplateCall} = require('./utils.js');
+import {createRule} from './tsUtils.ts';
+import {isLitHtmlTemplateCall} from './utils.js';
 
-/**
- * @type {import('eslint').Rule.RuleModule}
- */
-module.exports = {
+export default createRule({
+  name: 'no-a-tags-in-lit',
   meta: {
     type: 'problem',
     docs: {
       description: 'Check for <a> and </a> in Lit templates instead of using x-link.',
       category: 'Possible Errors',
     },
-    schema: []  // no options
+    messages: {
+      foundAnchor: 'Found an anchor element in a lit template. Use XLink.ts instead.',
+    },
+    fixable: 'code',
+    schema: [],  // no options
   },
+  defaultOptions: [],
   create: function(context) {
     return {
       TaggedTemplateExpression(node) {
@@ -30,11 +33,11 @@ module.exports = {
           if (templatePart.value.raw.match(/<a[\s>]/) || templatePart.value.raw.includes('</a>')) {
             context.report({
               node,
-              message: 'Adding links to a component should be done using `front_end/ui/legacy/XLink.ts`',
+              messageId: 'foundAnchor',
             });
           }
         }
       },
     };
   }
-};
+});

scripts/eslint_rules/lib/no-assert-deep-strict-equal.js renamed to scripts/eslint_rules/lib/no-assert-deep-strict-equal.ts

@@ -1,7 +1,8 @@
 // Copyright 2024 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
+
+import {createRule} from './tsUtils.ts';
 
 /**
  * @fileoverview Disallow usage of `assert.deepStrictEqual`.
@@ -16,11 +17,10 @@
 // Rule Definition
 // ------------------------------------------------------------------------------
 
-/** @type {import('eslint').Rule.RuleModule} */
-module.exports = {
+export default createRule({
+  name: 'no-assert-deep-strict-equal',
   meta: {
     type: 'suggestion',
-
     docs: {
       description: 'Disallow usage of `assert.deepStrictEqual` in favor of `assert.deepEqual`.',
       category: 'Best Practices',
@@ -29,15 +29,14 @@ module.exports = {
       unexpectedAssertDeepStrictEqual: 'Unexpected assert.deepStrictEqual. Use assert.deepEqual instead.',
     },
     fixable: 'code',
-    schema: [], // no options
+    schema: [],  // no options
   },
-  create: function (context) {
-    function isAssertDeepStrictEqual(calleeNode) {
-      return calleeNode.type === 'MemberExpression' &&
-             calleeNode.object.type === 'Identifier' &&
-             calleeNode.object.name === 'assert' &&
-             calleeNode.property.type === 'Identifier' &&
-             calleeNode.property.name === 'deepStrictEqual';
+  defaultOptions: [],
+  create(context) {
+    function isAssertDeepStrictEqual(calleeNode): boolean {
+      return calleeNode.type === 'MemberExpression' && calleeNode.object.type === 'Identifier' &&
+          calleeNode.object.name === 'assert' && calleeNode.property.type === 'Identifier' &&
+          calleeNode.property.name === 'deepStrictEqual';
     }
 
     function reportError(node) {
@@ -58,4 +57,4 @@ module.exports = {
       }
     };
   },
-};
+});

scripts/eslint_rules/tests/check-css-import.test.js renamed to scripts/eslint_rules/tests/check-css-import.test.ts

@@ -1,11 +1,10 @@
 // Copyright 2021 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
 
-const rule = require('../lib/check-css-import.js');
+import rule from '../lib/check-css-import.ts';
 
-const {RuleTester} = require('./utils/utils.js');
+import {RuleTester} from './utils/tsUtils.ts';
 
 new RuleTester().run('check-css-import', rule, {
   valid: [
@@ -26,7 +25,7 @@ new RuleTester().run('check-css-import', rule, {
       filename: 'front_end/ui/components/component/file.ts',
       errors: [
         {
-          message: 'File styles.css does not exist. Check you are importing the correct file.',
+          messageId: 'fileDoesNotExist',
         },
       ],
     },
@@ -36,7 +35,7 @@ new RuleTester().run('check-css-import', rule, {
       filename: 'front_end/ui/components/icon_button/file.ts',
       errors: [
         {
-          message: 'File check_css_import_tests_file.css does not exist. Check you are importing the correct file.',
+          messageId: 'fileDoesNotExist',
         },
       ],
     },

scripts/eslint_rules/tests/no-a-tags-in-lit.test.js renamed to scripts/eslint_rules/tests/no-a-tags-in-lit.test.ts

@@ -1,12 +1,10 @@
 // Copyright 2021 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
-const rule = require('../lib/no-a-tags-in-lit.js');
 
-const {RuleTester} = require('./utils/utils.js');
+import rule from '../lib/no-a-tags-in-lit.ts';
 
-const EXPECTED_ERROR_MESSAGE = 'Adding links to a component should be done using `front_end/ui/legacy/XLink.ts`';
+import {RuleTester} from './utils/tsUtils.ts';
 
 new RuleTester().run('no-a-tags-in-lit', rule, {
   valid: [
@@ -40,30 +38,30 @@ new RuleTester().run('no-a-tags-in-lit', rule, {
     {
       code: 'Lit.html`<a />`',
       filename: 'front_end/components/test.ts',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
     {
       code: 'Lit.html`<a></a>`',
       filename: 'front_end/components/test.ts',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
     {
       code: 'Lit.html`</a>`',
       filename: 'front_end/components/test.ts',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
     {
       code: 'Lit.html`<a >`',
       filename: 'front_end/components/test.ts',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
     {
       code: 'Lit.html`<p><${DataGrid.litTagName}></${DataGrid.litTagName}><a></a></p>`',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
     {
       code: 'Lit.html`<${DataGrid.litTagName}><a /></${DataGrid.litTagName}>`',
-      errors: [{message: EXPECTED_ERROR_MESSAGE}],
+      errors: [{messageId: 'foundAnchor'}],
     },
   ],
 });

scripts/eslint_rules/tests/no-assert-deep-strict-equal.test.js renamed to scripts/eslint_rules/tests/no-assert-deep-strict-equal.test.ts

@@ -1,11 +1,10 @@
 // Copyright 2024 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-'use strict';
 
-const rule = require('../lib/no-assert-deep-strict-equal.js');
+import rule from '../lib/no-assert-deep-strict-equal.ts';
 
-const {RuleTester} = require('./utils/utils.js');
+import {RuleTester} from './utils/tsUtils.ts';
 
 new RuleTester().run('no-assert-deep-strict-equal', rule, {
   valid: [

test/run.ts

@@ -184,9 +184,8 @@ class ScriptsMochaTests extends Tests {
     return super.run(
         tests.map(test => ScriptPathPair.getFromPair(test)),
         [
-          '--experimental-strip-types',
-          '--no-warnings=ExperimentalWarning',
-          path.join(SOURCE_ROOT, 'node_modules', 'mocha', 'bin', 'mocha'),
+          '--experimental-strip-types', '--no-warnings=ExperimentalWarning',
+          path.join(SOURCE_ROOT, 'node_modules', 'mocha', 'bin', 'mocha'), '--extension=ts,js'
         ],
     );
   }