add eslint@9 support and flat config (#3942)

.changeset/perfect-fans-hammer.md

@@ -0,0 +1,5 @@
+---
+"eslint-plugin-mobx": patch
+---
+
+add eslint@9 support and flat config

packages/eslint-plugin-mobx/README.md

@@ -10,6 +10,8 @@ npm install --save-dev eslint @typescript-eslint/parser eslint-plugin-mobx
 
 ## Configuration
 
+### Legacy Config
+
 ```javascript
 // .eslintrc.js
 module.exports = {
@@ -24,12 +26,37 @@ module.exports = {
         "mobx/exhaustive-make-observable": "warn",
         "mobx/unconditional-make-observable": "error",
         "mobx/missing-make-observable": "error",
-        "mobx/missing-observer": "warn",
-        "mobx/no-anonymous-observer": "warn"
+        "mobx/missing-observer": "warn"
     }
 }
 ```
 
+### Flat Config
+
+```javascript
+// eslint.config.js
+import pluginMobx from "eslint-plugin-mobx"
+
+export default [
+    // ...
+
+    // Either extend our recommended configuration:
+    pluginMobx.flatConfigs.recommended,
+
+    // ...or specify and customize individual rules:
+    {
+        plugins: { mobx: pluginMobx },
+        rules: {
+            // these values are the same as recommended
+            "mobx/exhaustive-make-observable": "warn",
+            "mobx/unconditional-make-observable": "error",
+            "mobx/missing-make-observable": "error",
+            "mobx/missing-observer": "warn"
+        }
+    }
+]
+```
+
 ## Rules
 
 ### mobx/exhaustive-make-observable

packages/eslint-plugin-mobx/__tests__/exhaustive-make-observable.js

@@ -1,11 +1,8 @@
-import { RuleTester } from "eslint";
+import { getRuleTester } from "./utils/get-rule-tester";
 
 import rule from "../src/exhaustive-make-observable.js";
 
-const tester = new RuleTester({
-  parser: require.resolve('@typescript-eslint/parser'),
-  parserOptions: {}
-});
+const tester = getRuleTester();
 
 const decoratedFields = [
   '@observable o = 5',

packages/eslint-plugin-mobx/__tests__/missing-make-observable.js

@@ -1,11 +1,8 @@
-import { RuleTester } from "eslint";
+import { getRuleTester } from "./utils/get-rule-tester";
 
 import rule from "../src/missing-make-observable.js";
 
-const tester = new RuleTester({
-  parser: require.resolve('@typescript-eslint/parser'),
-  parserOptions: {}
-});
+const tester = getRuleTester();
 
 const fields = [
   '@observable o = 5',

packages/eslint-plugin-mobx/__tests__/missing-observer.js

@@ -1,11 +1,8 @@
-import { RuleTester } from "eslint"
+import { getRuleTester } from "./utils/get-rule-tester";
 
 import rule from "../src/missing-observer.js"
 
-const tester = new RuleTester({
-    parser: require.resolve("@typescript-eslint/parser"),
-    parserOptions: {}
-})
+const tester = getRuleTester();
 
 const valids = [
     "observer(function Named() { });",

packages/eslint-plugin-mobx/__tests__/no-anonymous-observer.js

@@ -1,11 +1,8 @@
-import { RuleTester } from "eslint"
+import { getRuleTester } from "./utils/get-rule-tester";
 
 import rule from "../src/no-anonymous-observer.js"
 
-const tester = new RuleTester({
-    parser: require.resolve("@typescript-eslint/parser"),
-    parserOptions: {}
-})
+const tester = getRuleTester();
 
 const valids = ["observer(function Name() {})", "observer(class Name {})"]
 

packages/eslint-plugin-mobx/__tests__/unconditional-make-observable.js

@@ -1,11 +1,8 @@
-import { RuleTester } from "eslint";
+import { getRuleTester } from "./utils/get-rule-tester";
 
 import rule from "../src/unconditional-make-observable.js";
 
-const tester = new RuleTester({
-  parser: require.resolve('@typescript-eslint/parser'),
-  parserOptions: {}
-});
+const tester = getRuleTester();
 
 const valid1 = {
   code: `

packages/eslint-plugin-mobx/__tests__/utils/get-rule-tester.js

@@ -0,0 +1,29 @@
+const version = global.ESLINT_V;
+
+const { RuleTester } = require(`eslint-${version}`);
+const typescriptEslintParser = require("@typescript-eslint/parser");
+
+function getRuleTesterConfig() {
+    switch (version) {
+        case 7:
+            return {
+                parser: require.resolve("@typescript-eslint/parser"),
+                parserOptions: {},
+            };
+        case 9:
+            return {
+                languageOptions: {
+                    parser: typescriptEslintParser,
+                    parserOptions: {},
+                },
+            };
+        default:
+            throw new Error(`Unknown or unspecified ESLINT_V (${String(version)})`);
+    }
+}
+
+function getRuleTester() {
+    return new RuleTester(getRuleTesterConfig());
+}
+
+export { getRuleTester }

packages/eslint-plugin-mobx/jest.config-eslint-7.js

@@ -0,0 +1,10 @@
+const buildConfig = require("../../jest.base.config")
+
+module.exports = buildConfig(__dirname, {
+    displayName: 'eslint-plugin-mobx with eslint@7',
+    setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
+    testRegex: "__tests__/[^/]+\\.(t|j)sx?$",
+    globals: {
+        ESLINT_V: 7
+    }
+})

packages/eslint-plugin-mobx/jest.config-eslint-9.js

@@ -0,0 +1,10 @@
+const buildConfig = require("../../jest.base.config")
+
+module.exports = buildConfig(__dirname, {
+    displayName: 'eslint-plugin-mobx with eslint@9',
+    setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
+    testRegex: "__tests__/[^/]+\\.(t|j)sx?$",
+    globals: {
+        ESLINT_V: 9
+    }
+})

packages/eslint-plugin-mobx/jest.setup.js

@@ -0,0 +1,4 @@
+/** @see https://github.com/jsdom/jsdom/issues/3363 */
+global.structuredClone = val => {
+    return JSON.parse(JSON.stringify(val))
+}

packages/eslint-plugin-mobx/package.json

@@ -25,18 +25,20 @@
     ],
     "homepage": "https://mobx.js.org/",
     "peerDependencies": {
-        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0"
     },
     "devDependencies": {
-        "@typescript-eslint/eslint-plugin": "^5.0.0",
-        "@typescript-eslint/parser": "^5.0.0",
-        "eslint": "^7.0.0",
         "@babel/core": "^7.16.0",
         "@babel/preset-env": "^7.16.4",
-        "rollup": "^2.60.2",
         "@rollup/plugin-babel": "^5.3.0",
         "@rollup/plugin-commonjs": "^21.0.1",
-        "@rollup/plugin-node-resolve": "13.0.6"
+        "@rollup/plugin-node-resolve": "13.0.6",
+        "@typescript-eslint/eslint-plugin": "^5.0.0",
+        "@typescript-eslint/parser": "^5.0.0",
+        "eslint": "^7.0.0",
+        "eslint-7": "npm:eslint@^7.0.0",
+        "eslint-9": "npm:eslint@^9.0.0",
+        "rollup": "^2.60.2"
     },
     "keywords": [
         "eslint",
@@ -45,7 +47,9 @@
         "mobx"
     ],
     "scripts": {
-        "test": "jest",
+        "test:7": "jest --config jest.config-eslint-7.js",
+        "test:9": "jest --config jest.config-eslint-9.js",
+        "test": "npm run test:7 && npm run test:9",
         "build": "yarn rollup --config",
         "prepublishOnly": "yarn build"
     }

packages/eslint-plugin-mobx/src/index.js

@@ -1,22 +1,20 @@
 "use strict"
 
+const fs = require("fs");
+const path = require("path");
+
 const exhaustiveMakeObservable = require("./exhaustive-make-observable.js")
 const unconditionalMakeObservable = require("./unconditional-make-observable.js")
 const missingMakeObservable = require("./missing-make-observable.js")
 const missingObserver = require("./missing-observer")
 const noAnonymousObserver = require("./no-anonymous-observer.js")
 
-module.exports = {
-    configs: {
-        recommended: {
-            plugins: ["mobx"],
-            rules: {
-                "mobx/exhaustive-make-observable": "warn",
-                "mobx/unconditional-make-observable": "error",
-                "mobx/missing-make-observable": "error",
-                "mobx/missing-observer": "warn"
-            }
-        }
+const pkg = JSON.parse(fs.readFileSync(path.join(__dirname, "..", "package.json"), "utf8"));
+
+const pluginMobx = {
+    meta: {
+        name: pkg.name,
+        version: pkg.version
     },
     rules: {
         "exhaustive-make-observable": exhaustiveMakeObservable,
@@ -25,4 +23,28 @@ module.exports = {
         "missing-observer": missingObserver,
         "no-anonymous-observer": noAnonymousObserver
     }
+};
+
+const recommendedRules = {
+    "mobx/exhaustive-make-observable": "warn",
+    "mobx/unconditional-make-observable": "error",
+    "mobx/missing-make-observable": "error",
+    "mobx/missing-observer": "warn"
+}
+
+module.exports = {
+    ...pluginMobx,
+    configs: {
+        recommended: {
+            plugins: ["mobx"],
+            rules: recommendedRules,
+        }
+    },
+    flatConfigs: {
+        recommended: {
+            name: "react-hooks/recommended",
+            plugins: { "mobx": pluginMobx },
+            rules: recommendedRules
+        }
+    }
 }