feat(eslint-plugin): support Eslint 9 and 8 simultaneously

.changeset/breezy-toes-help.md

@@ -0,0 +1,5 @@
+---
+'eslint-plugin-qwik': minor
+---
+
+let eslint-plugin-qwik support Eslint 9 and 8 simultaneously

e2e/qwik-cli-e2e/utils/index.ts

@@ -67,7 +67,7 @@ function replacePackagesWithLocalOnes(tmpDir: string) {
   for (const { name, absolutePath } of tarballConfig) {
     patchPackageJsonForPlugin(tmpDir, name, absolutePath);
   }
-  execSync('npm i', {
+  execSync('pnpm i', {
     cwd: tmpDir,
     // only output errors
     stdio: ['ignore', 'ignore', 'inherit'],

package.json

@@ -9,6 +9,16 @@
   "config": {
     "syncpack": {
       "versionGroups": [
+        {
+          "label": "Allow ESLint 9 types in eslint-plugin-qwik",
+          "dependencies": [
+            "@types/eslint"
+          ],
+          "packages": [
+            "eslint-plugin-qwik"
+          ],
+          "policy": "matches@9.6.1"
+        },
         {
           "label": "Be lenient in vite versions for prod. v4 is broken, v5 is good",
           "dependencyTypes": [

packages/eslint-plugin-qwik/index.ts

@@ -9,8 +9,9 @@ import { preferClasslist } from './src/preferClasslist';
 import { unusedServer } from './src/unusedServer';
 import { useMethodUsage } from './src/useMethodUsage';
 import { validLexicalScope } from './src/validLexicalScope';
+import pkg from './package.json';
 
-export const rules = {
+const rules = {
   'use-method-usage': useMethodUsage,
   'valid-lexical-scope': validLexicalScope,
   'loader-location': loaderLocation,
@@ -24,37 +25,68 @@ export const rules = {
   'no-use-visible-task': noUseVisibleTask,
 };
 
-export const configs = {
+const recommendedRules = {
+  'qwik/use-method-usage': 'error',
+  'qwik/valid-lexical-scope': 'error',
+  'qwik/no-react-props': 'error',
+  'qwik/prefer-classlist': 'warn',
+  'qwik/jsx-no-script-url': 'warn',
+  'qwik/loader-location': 'warn',
+  'qwik/jsx-key': 'warn',
+  'qwik/unused-server': 'error',
+  'qwik/jsx-img': 'warn',
+  'qwik/jsx-a': 'warn',
+  'qwik/no-use-visible-task': 'warn',
+};
+const strictRules = {
+  'qwik/valid-lexical-scope': 'error',
+  'qwik/use-method-usage': 'error',
+  'qwik/loader-location': 'error',
+  'qwik/no-react-props': 'error',
+  'qwik/prefer-classlist': 'error',
+  'qwik/jsx-no-script-url': 'error',
+  'qwik/jsx-key': 'error',
+  'qwik/unused-server': 'error',
+  'qwik/jsx-img': 'error',
+  'qwik/jsx-a': 'error',
+  'qwik/no-use-visible-task': 'warn',
+};
+
+const configs = {
   recommended: {
     plugins: ['qwik'],
-    rules: {
-      'qwik/use-method-usage': 'error',
-      'qwik/valid-lexical-scope': 'error',
-      'qwik/no-react-props': 'error',
-      'qwik/prefer-classlist': 'warn',
-      'qwik/jsx-no-script-url': 'warn',
-      'qwik/loader-location': 'warn',
-      'qwik/jsx-key': 'warn',
-      'qwik/unused-server': 'error',
-      'qwik/jsx-img': 'warn',
-      'qwik/jsx-a': 'warn',
-      'qwik/no-use-visible-task': 'warn',
-    },
+    rules: recommendedRules,
   },
   strict: {
     plugins: ['qwik'],
-    rules: {
-      'qwik/valid-lexical-scope': 'error',
-      'qwik/use-method-usage': 'error',
-      'qwik/loader-location': 'error',
-      'qwik/no-react-props': 'error',
-      'qwik/prefer-classlist': 'error',
-      'qwik/jsx-no-script-url': 'error',
-      'qwik/jsx-key': 'error',
-      'qwik/unused-server': 'error',
-      'qwik/jsx-img': 'error',
-      'qwik/jsx-a': 'error',
-      'qwik/no-use-visible-task': 'warn',
-    },
+    rules: strictRules,
+  },
+};
+
+const qwikEslint9Plugin = {
+  configs: {
+    recommended: [
+      {
+        plugins: {
+          qwik: this,
+        },
+        rules: recommendedRules,
+      },
+    ],
+    strict: [
+      {
+        plugins: {
+          qwik: this,
+        },
+        rules: strictRules,
+      },
+    ],
   },
+  meta: {
+    name: pkg.name,
+    version: pkg.version,
+  },
+  rules,
 };
+
+export { configs, qwikEslint9Plugin, rules };

packages/eslint-plugin-qwik/package.json

@@ -11,10 +11,10 @@
   "devDependencies": {
     "@builder.io/qwik": "workspace:^",
     "@builder.io/qwik-city": "workspace:^",
-    "@types/eslint": "8.56.10",
     "@types/estree": "1.0.5",
-    "@typescript-eslint/rule-tester": "7.8.0",
-    "redent": "4.0.0"
+    "@typescript-eslint/rule-tester": "8.14.0",
+    "redent": "4.0.0",
+    "@types/eslint": "9.6.1"
   },
   "engines": {
     "node": ">=16.8.0 <18.0.0 || >=18.11"
@@ -31,9 +31,6 @@
   ],
   "license": "MIT",
   "main": "dist/index.js",
-  "peerDependencies": {
-    "eslint": "^8.57.0"
-  },
   "repository": {
     "type": "git",
     "url": "https://github.com/QwikDev/qwik.git",

packages/eslint-plugin-qwik/qwik.unit.ts

@@ -1,7 +1,5 @@
 import * as vitest from 'vitest';
-// @ts-ignore
-import { RuleTester } from '@typescript-eslint/rule-tester';
-
+import { RuleTester, type RuleTesterConfig } from '@typescript-eslint/rule-tester';
 import { fileURLToPath } from 'node:url';
 import { rules } from './index';
 import { readdir, readFile, stat } from 'node:fs/promises';
@@ -14,22 +12,26 @@ RuleTester.itOnly = vitest.it.only;
 RuleTester.describe = vitest.describe;
 
 const testConfig = {
-  parser: '@typescript-eslint/parser',
-  env: {
-    es6: true,
+  rules: {
+    'no-console': 'error',
   },
-  parserOptions: {
-    tsconfigRootDir: fileURLToPath(new URL('.', import.meta.url)),
-    project: ['./tests/tsconfig.json'],
-    ecmaFeatures: {
-      jsx: true,
+  languageOptions: {
+    parserOptions: {
+      projectService: {
+        allowDefaultProject: ['*.ts*'],
+      },
+      sourceType: 'module',
+      ecmaFeatures: {
+        jsx: true,
+      },
+      ecmaVersion: 2024,
+      project: ['./tests/tsconfig.json'],
+      tsconfigRootDir: fileURLToPath(new URL('.', import.meta.url)),
     },
-    ecmaVersion: 2020,
-    sourceType: 'module',
   },
-};
+} as RuleTesterConfig;
 
-const ruleTester = new RuleTester(testConfig as any);
+const ruleTester = new RuleTester(testConfig);
 interface TestCase {
   name: string;
   filename: string;

packages/eslint-plugin-qwik/src/jsxKey.ts

@@ -60,7 +60,8 @@ export const jsxKey = {
   },
 
   create(context) {
-    const modifyJsxSource = context.sourceCode
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
+    const modifyJsxSource = sourceCode
       .getAllComments()
       .some((c) => c.value.includes('@jsxImportSource'));
     if (modifyJsxSource) {

packages/eslint-plugin-qwik/src/jsxNoScriptUrl.ts

@@ -31,12 +31,13 @@ export const jsxNoScriptUrl = {
     },
   },
   create(context) {
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
     return {
       JSXAttribute(node) {
         if (node.name.type === 'JSXIdentifier' && node.value) {
           const link = getStaticValue(
             node.value.type === 'JSXExpressionContainer' ? node.value.expression : node.value,
-            context.getScope()
+            sourceCode.getScope ? sourceCode.getScope(node) : context.getScope()
           );
           if (link && typeof link.value === 'string' && isJavaScriptProtocol.test(link.value)) {
             context.report({

packages/eslint-plugin-qwik/src/loaderLocation.ts

@@ -55,7 +55,7 @@ If you understand this, you can disable this warning with:
   },
   create(context) {
     const routesDir = context.options?.[0]?.routesDir ?? 'src/routes';
-    const path = normalizePath(context.getFilename());
+    const path = normalizePath(context.filename ?? context.getFilename());
     const isLayout = /\/layout(|!|-.+)\.(j|t)sx?$/.test(path);
     const isIndex = /\/index(|!|@.+)\.(j|t)sx?$/.test(path);
     const isPlugin = /\/plugin(|@.+)\.(j|t)sx?$/.test(path);

packages/eslint-plugin-qwik/src/useMethodUsage.ts

@@ -17,7 +17,8 @@ export const useMethodUsage: Rule.RuleModule = {
     },
   },
   create(context) {
-    const modifyJsxSource = context.sourceCode
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
+    const modifyJsxSource = sourceCode
       .getAllComments()
       .some((c) => c.value.includes('@jsxImportSource'));
     if (modifyJsxSource) {