Fully switch to oxlint (#2998)

* upgrade oxlint

* use playwright plugin in oxlint

* drop eslint

* explicit format check for CI

* test format check fail in CI

* Revert "test format check fail in CI"

This reverts commit 135becf.

* update vscode suggestions

* oxlint 1.36 and fix new errors

Author: david-crespo

.github/workflows/lintBuildTest.yml

@@ -44,6 +44,8 @@ jobs:
         run: npx tsc
       - name: Lint
         run: npm run lint
+      - name: Check formatting
+        run: npm run fmt:check
       - name: Test
         run: npm test run
       - name: Build

.oxlintrc.json

@@ -1,11 +1,19 @@
 {
   "$schema": "./node_modules/oxlint/configuration_schema.json",
+  "jsPlugins": [
+    {
+      "name": "playwright",
+      "specifier": "eslint-plugin-playwright"
+    }
+    // eslint-plugin-react-hook-form won't work — all its rules use context.getScope()
+  ],
   "plugins": [
     "import",
     "react",
     "jsx-a11y",
     "promise",
     // defaults (see https://oxc.rs/docs/guide/usage/linter/plugins.html#supported-plugins)
+    "eslint",
     "unicorn",
     "typescript",
     "oxc"
@@ -74,7 +82,19 @@
       // catch unawaited Playwright calls in e2e tests
       "files": ["test/e2e/**/*.ts"],
       "rules": {
-        "@typescript-eslint/no-floating-promises": "error"
+        "@typescript-eslint/no-floating-promises": "error",
+        "playwright/expect-expect": [
+          "warn",
+          {
+            "assertFunctionNames": [
+              "expectVisible",
+              "expectRowVisible",
+              "expectOptions",
+              "expectRowMenuStaysOpen"
+            ]
+          }
+        ],
+        "playwright/no-force-option": "off"
       }
     }
   ],

.vscode/extensions.json

@@ -1,6 +1,6 @@
 {
   "recommendations": [
-    "dbaeumer.vscode-eslint",
+    "oxc.oxc-vscode",
     "esbenp.prettier-vscode",
     "bradlc.vscode-tailwindcss"
   ]

.vscode/settings.json

@@ -1,20 +1,19 @@
 {
   "[jsonc]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
   "[json]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
-  "[javascript]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" },
-  "[javascriptreact]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" },
-  "[typescript]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" },
-  "[typescriptreact]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" },
+  "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
+  "[javascriptreact]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
+  "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
+  "[typescriptreact]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
   "typescript.tsdk": "node_modules/typescript/lib",
   "editor.formatOnSave": true,
-  "eslint.format.enable": true,
   "tailwindCSS.experimental.classRegex": ["classed.[a-z]+`([^`]*)`"],
   "css.customData": ["./.vscode/css.json"],
   "explorer.fileNesting.enabled": true,
   "explorer.fileNesting.expand": false,
   "explorer.fileNesting.patterns": {
     ".gitignore": ".gitattributes, .gitmodules, .gitmessage, .mailmap, .git-blame*",
-    "package.json": "package-lock.json, .babelrc, .editorconfig, .eslint*, .figma*, .github*, .huskyrc*, plopfile*, .prettier*, .vscode*, playwright.config.*, prettier*, tsconfig.*, vitest.config.*, yarn*, postcss.config.*, tailwind.config.*, vite.config.ts, mockServiceWorker.js, vercel.json, .licenserc.yaml, LICENSE"
+    "package.json": "package-lock.json, .babelrc, .editorconfig, .figma*, .github*, .huskyrc*, plopfile*, .oxlintrc*, .prettier*, .vscode*, playwright.config.*, prettier*, tsconfig.*, vitest.config.*, yarn*, postcss.config.*, tailwind.config.*, vite.config.ts, mockServiceWorker.js, vercel.json, .licenserc.yaml, LICENSE"
   },
   "vite.browserType": "system",
   "vite.buildCommand": "npm run build",

app/components/form/fields/RadioField.tsx

@@ -80,6 +80,7 @@ export function RadioField<
       </div>
       <RadioGroup
         defaultChecked={field.value}
+        // oxlint-disable-next-line jsx-a11y/aria-proptypes -- https://github.com/oxc-project/oxc/issues/17465
         aria-labelledby={`${id}-label`}
         onChange={(e) =>
           parseValue ? field.onChange(parseValue(e.target.value)) : field.onChange(e)

app/components/form/fields/TextField.tsx

@@ -117,6 +117,7 @@ export const TextFieldInner = <
         title={label}
         type={type}
         error={!!error}
+        // oxlint-disable-next-line jsx-a11y/aria-proptypes -- https://github.com/oxc-project/oxc/issues/17465
         aria-labelledby={`${id}-label ${id}-help-text`}
         onChange={(e) => onChange(transform ? transform(e.target.value) : e.target.value)}
         {...fieldRest}

app/table/cells/BooleanCell.tsx

@@ -6,7 +6,6 @@
  * Copyright Oxide Computer Company
  */
 
-/* eslint-disable jsx-a11y/aria-proptypes */
 // there seems to be a bug in the linter. it doesn't want you to use the string
 // "true" because it insists it's a boolean
 import { Disabled12Icon, Success12Icon } from '@oxide/design-system/icons/react'