Merge pull request #327 from scratchfoundation/eslint-9-scratch-12

Update to eslint v9 and eslint-config-scratch v12

Author: cwillisf

package-lock.json

@@ -0,0 +1,137 @@
+import {eslintConfigScratch} from 'eslint-config-scratch';
+import {globalIgnores} from 'eslint/config';
+import globals from 'globals';
+import importPlugin from 'eslint-plugin-import';
+import path from 'path';
+
+export default eslintConfigScratch.defineConfig(
+    eslintConfigScratch.legacy.base,
+    importPlugin.flatConfigs.errors,
+    {
+        files: ['*.{js,cjs,mjs,ts}', 'scripts/**/*.{js,cjs,mjs,ts}'],
+        extends: [eslintConfigScratch.legacy.node],
+        languageOptions: {
+            globals: globals.node
+        },
+        rules: {
+            'no-console': 'off'
+        },
+        settings: {
+            // TODO: figure out why this is needed...
+            // probably something with eslint-plugin-import's parser or resolver
+            'import/core-modules': [
+                'eslint/config'
+            ]
+        }
+    },
+    {
+        files: ['{src,test}/**/*.{js,cjs,mjs,jsx,ts,tsx}'],
+        extends: [
+            eslintConfigScratch.legacy.es6,
+            eslintConfigScratch.legacy.react,
+            eslintConfigScratch.legacy.typescript
+        ],
+        languageOptions: {
+            globals: {
+                ...globals.browser,
+                process: 'readonly'
+            },
+            parserOptions: {
+                projectService: false,
+                tsconfigRootDir: import.meta.dirname,
+                project: [
+                    'tsconfig.json',
+                    'tsconfig.test.json'
+                ]
+            }
+        },
+        settings: {
+            'react': {
+                version: 'detect'
+            },
+            'import/resolver': {
+                webpack: {
+                    config: path.resolve(import.meta.dirname, 'webpack.config.js')
+                }
+            }
+        },
+        rules: {
+            // BEGIN: these caused trouble after upgrading eslint-plugin-react from 7.24.0 to 7.33.2
+            'react/forbid-prop-types': 'warn',
+            'react/no-unknown-property': 'warn',
+            // END: these caused trouble after upgrading eslint-plugin-react from 7.24.0 to 7.33.2
+
+            // we should probably just fix these...
+            'arrow-parens': 'warn',
+            'react/no-deprecated': 'warn',
+            'require-atomic-updates': 'warn',
+            '@typescript-eslint/no-unused-vars': ['warn', {
+                args: 'after-used',
+                caughtErrors: 'none', // TODO: use caughtErrorsPattern instead
+                varsIgnorePattern: '^_'
+            }],
+            '@typescript-eslint/no-use-before-define': 'warn',
+            '@typescript-eslint/prefer-promise-reject-errors': 'warn'
+        }
+    },
+    {
+        files: ['test/**/*.{js,cjs,mjs,jsx,ts,tsx}'],
+        languageOptions: {
+            globals: {
+                ...globals.jest,
+                ...globals.node
+            }
+        },
+        rules: {
+            'max-len': [
+                'warn',
+                // settings copied from eslint-config-scratch.legacy.base
+                {
+                    code: 120,
+                    tabWidth: 4,
+                    ignoreUrls: true
+                }
+            ],
+            'react/prop-types': 'off' // don't worry about prop types in tests
+        }
+    },
+    {
+        files: ['{src,test}/**/*.{ts,tsx}'],
+        rules: {
+            // TODO: get TS parsing to work with eslint-plugin-import
+            'import/named': 'off'
+        }
+    },
+    {
+        // disable some checks for these generated files
+        files: ['{src,test}/**/types.d.ts'],
+        rules: {
+            '@stylistic/indent': 'off'
+        }
+    },
+    {
+        files: [
+            'src/lib/libraries/extensions/index.jsx',
+            'src/lib/libraries/decks/*.js'
+        ],
+        rules: {
+            // the way these files are built makes duplicate imports the natural way to do things
+            'no-duplicate-imports': 'off'
+        }
+    },
+    {
+        files: ['test/unit/util/define-dynamic-block.test.js'],
+        settings: {
+            // TODO: figure out why this is needed...
+            // probably something with eslint-plugin-import's parser or resolver
+            'import/core-modules': [
+                '@scratch/scratch-vm/src/extension-support/block-type'
+            ]
+        }
+    },
+    globalIgnores([
+        'build/**/*',
+        'dist/**/*',
+        'node_modules/**/*'
+    ])
+);

packages/scratch-gui/.eslintignore

@@ -51,7 +51,7 @@
     "start": "webpack serve",
     "test": "npm run test:lint && npm run test:unit && npm run test:integration",
     "test:integration": "cross-env JEST_JUNIT_OUTPUT_NAME=integration-tests-results.xml jest --maxWorkers=4 test[\\\\/]integration",
-    "test:lint": "eslint . --ext .js,.jsx,.ts,.tsx",
+    "test:lint": "eslint",
     "test:unit": "cross-env JEST_JUNIT_OUTPUT_NAME=unit-tests-results.xml jest test[\\\\/]unit",
     "test:smoke": "jest --runInBand test[\\\\/]smoke",
     "watch": "webpack --watch"
@@ -60,12 +60,12 @@
     "@mediapipe/face_detection": "0.4.1646425229",
     "@microbit/microbit-universal-hex": "0.2.2",
     "@radix-ui/react-context-menu": "^2.2.5",
-    "@testing-library/user-event": "^14.6.1",
     "@scratch/scratch-render": "11.6.0",
     "@scratch/scratch-svg-renderer": "11.6.0",
     "@scratch/scratch-vm": "11.6.0",
     "@tensorflow-models/face-detection": "^1.0.3",
     "@tensorflow/tfjs": "^4.22.0",
+    "@testing-library/user-event": "^14.6.1",
     "arraybuffer-loader": "1.0.8",
     "autoprefixer": "9.8.8",
     "balance-text": "3.3.1",
@@ -123,8 +123,8 @@
     "scratch-storage": "4.1.16",
     "startaudiocontext": "1.2.1",
     "style-loader": "4.0.0",
-    "to-style": "1.3.3",
     "text-encoding": "0.7.0",
+    "to-style": "1.3.3",
     "wav-encoder": "1.3.0",
     "xhr": "2.6.0"
   },
@@ -137,29 +137,27 @@
   "devDependencies": {
     "@babel/cli": "7.28.3",
     "@babel/core": "7.28.4",
-    "@babel/eslint-parser": "7.28.4",
     "@babel/preset-env": "7.28.3",
     "@babel/preset-react": "7.27.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
+    "@types/jest": "^25.2.3",
     "@types/prop-types": "15.7.15",
     "@types/react-modal": "3.16.3",
-    "@typescript-eslint/eslint-plugin": "8.7.0",
-    "@typescript-eslint/parser": "8.7.0",
     "babel-core": "7.0.0-bridge.0",
     "babel-loader": "9.2.1",
+    "buffer": "^6.0.3",
     "cheerio": "1.1.2",
     "cross-env": "7.0.3",
-    "eslint": "8.57.1",
-    "eslint-config-scratch": "9.0.9",
-    "eslint-import-resolver-webpack": "0.11.1",
-    "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-jest": "22.21.0",
-    "eslint-plugin-react": "7.37.5",
+    "eslint": "9.37.0",
+    "eslint-config-scratch": "^12.0.8",
+    "eslint-import-resolver-webpack": "^0.13.10",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-react": "^7.37.5",
     "file-loader": "6.2.0",
     "gh-pages": "3.2.3",
     "html-webpack-plugin": "5.6.4",
-    "jest": "21.2.1",
+    "jest": "^25.5.4",
     "jest-junit": "7.0.0",
     "mkdirp": "1.0.4",
     "raf": "3.4.1",
@@ -171,7 +169,7 @@
     "selenium-webdriver": "3.6.0",
     "semantic-release": "19.0.5",
     "stream-browserify": "3.0.0",
-    "ts-jest": "21.2.4",
+    "ts-jest": "^25.5.1",
     "ts-loader": "9.5.4",
     "url-loader": "4.1.1",
     "web-audio-test-api": "0.5.2",

packages/scratch-gui/.eslintrc.js

@@ -33,7 +33,7 @@ const messages = defineMessages({
 });
 
 const localStorageAvailable =
-  'localStorage' in window && window.localStorage !== null;
+    'localStorage' in window && window.localStorage !== null;
 
 // Default to true to make sure we don't end up showing the feature
 // callouts multiple times if localStorage isn't available.

packages/scratch-gui/eslint.config.mjs

@@ -15,7 +15,7 @@ import internetConnectionIconURL from './internet-connection.svg';
 
 import {PLATFORM} from '../../lib/platform.js';
 
-/* eslint-disable react/prefer-stateless-function */
+ 
 class LibraryItemComponent extends React.PureComponent {
     constructor (props) {
         super(props);
@@ -178,7 +178,6 @@ class LibraryItemComponent extends React.PureComponent {
         );
     }
 }
-/* eslint-enable react/prefer-stateless-function */
 
 
 LibraryItemComponent.propTypes = {

packages/scratch-gui/package.json

@@ -21,7 +21,7 @@ import {getLocalStorageValue, setLocalStorageValue} from '../../lib/local-storag
 import styles from './library.css';
 
 const localStorageAvailable =
-  'localStorage' in window && window.localStorage !== null;
+    'localStorage' in window && window.localStorage !== null;
 
 const messages = defineMessages({
     filterPlaceholder: {
@@ -211,7 +211,7 @@ class LibraryComponent extends React.Component {
             this.driver.destroy();
             this.driver = null;
         }
-        
+
         if (this.animationFrameId) {
             window.cancelAnimationFrame(this.animationFrameId);
         }
@@ -225,18 +225,18 @@ class LibraryComponent extends React.Component {
             if (this.driver) {
                 this.driver.refresh();
             }
-            
+
             this.animationFrameId = null;
         });
     }
     handleSelect (id) {
         const selectedItem = this.getFilteredData().find(item => this.constructKey(item) === id);
-        
+
         if (this.state.shouldShowFaceSensingCallout && selectedItem.extensionId === 'faceSensing') {
             if (!this.driver) {
                 return;
             }
-       
+
             setHasUsedFaceSensing(this.props.username);
             this.setState({
                 shouldShowFaceSensingCallout: false
@@ -468,7 +468,7 @@ class LibraryComponent extends React.Component {
 
 LibraryComponent.propTypes = {
     data: PropTypes.arrayOf(
-        /* eslint-disable react/no-unused-prop-types, lines-around-comment */
+         
         // An item in the library
         PropTypes.shape({
             // @todo remove md5/rawURL prop from library, refactor to use storage
@@ -479,7 +479,7 @@ LibraryComponent.propTypes = {
             ]),
             rawURL: PropTypes.string
         })
-        /* eslint-enable react/no-unused-prop-types, lines-around-comment */
+         
     ),
     filterable: PropTypes.bool,
     withCategories: PropTypes.bool,