chore: Upgrade to eslint v9 (#92)

Author: personalizedrefrigerator

.eslintrc.js

@@ -1,4 +1,4 @@
-/* eslint-disable @typescript-eslint/no-loss-of-precision */
+/* eslint-disable no-loss-of-precision */
 
 // prettier-ignore
 export const touchWritingSample = [

docs/debugging/input-system-tester/handwriting-samples.ts

@@ -216,7 +216,7 @@ const playBackLog = async (rate: number) => {
 	const data = JSON.parse('[' + log.value + ']');
 	data.reverse();
 
-	playInputLog(editor, data, rate);
+	await playInputLog(editor, data, rate);
 };
 playbackButton.onclick = () => playBackLog(1);
 

docs/debugging/stroke-logging/index.ts

@@ -59,7 +59,7 @@ export class IndexedDBStore implements AbstractStore {
 			};
 
 			dbFactory.onerror = () => {
-				console.log('reject: ' + dbFactory.error);
+				console.log(`reject: ${dbFactory.error}`);
 
 				// TODO: Use dbFactory.errorCode to provide a better error message.
 				reject(new Error(localization.databaseLoadError));
@@ -102,9 +102,9 @@ export class IndexedDBStore implements AbstractStore {
 				.delete(id);
 
 			deleteDataRequest.onerror = () =>
-				reject(new Error('Error deleting image data: ' + deleteDataRequest.error));
+				reject(new Error(`Error deleting image data: ${deleteDataRequest.error}`));
 			deleteMetadataRequest.onerror = () =>
-				reject(new Error('Error deleting image metadata: ' + deleteMetadataRequest.error));
+				reject(new Error(`Error deleting image metadata: ${deleteMetadataRequest.error}`));
 
 			let nextSuccessCallback = () => {
 				nextSuccessCallback = resolve;
@@ -138,7 +138,7 @@ export class IndexedDBStore implements AbstractStore {
 				resolve(data ?? null);
 			};
 
-			readRequest.onerror = () => reject(new Error('Error reading image: ' + readRequest.error));
+			readRequest.onerror = () => reject(new Error(`Error reading image: ${readRequest.error}`));
 		});
 	}
 
@@ -154,7 +154,7 @@ export class IndexedDBStore implements AbstractStore {
 
 			writeDataRequest.onsuccess = () => resolve();
 			writeDataRequest.onerror = () =>
-				reject(new Error('Error saving metadata: ' + writeDataRequest.error));
+				reject(new Error('Error saving metadata: ' + String(writeDataRequest.error)));
 		});
 	}
 
@@ -203,7 +203,7 @@ export class IndexedDBStore implements AbstractStore {
 
 			writeDataRequest.onsuccess = () => resolve();
 			writeDataRequest.onerror = () =>
-				reject(new Error('Error saving data: ' + writeDataRequest.error));
+				reject(new Error('Error saving data: ' + String(writeDataRequest.error)));
 		});
 
 		await this.updateStoreEntryModifyTime(id);
@@ -229,7 +229,7 @@ export class IndexedDBStore implements AbstractStore {
 			};
 
 			readDataRequest.onerror = () =>
-				reject(new Error('Error reading image: ' + readDataRequest.error));
+				reject(new Error('Error reading image: ' + String(readDataRequest.error)));
 		});
 	}
 
@@ -321,9 +321,9 @@ export class IndexedDBStore implements AbstractStore {
 			const addImageRequest = transaction.objectStore(imageDataStoreName).add({ data: '' });
 
 			addMetadataRequest.onerror = () =>
-				reject(new Error('Error adding image metadata: ' + addMetadataRequest.error));
+				reject(new Error(`Error adding image metadata: ${addMetadataRequest.error}`));
 			addImageRequest.onerror = () =>
-				reject(new Error('Error adding image data: ' + addImageRequest.error));
+				reject(new Error(`Error adding image data: ${addImageRequest.error}`));
 
 			const eventToId = (event: any) => parseInt(event.target.result);
 

docs/demo/storage/IndexedDBStore.ts

@@ -0,0 +1,66 @@
+import globals from 'globals';
+import tsParser from '@typescript-eslint/parser';
+import eslint from '@eslint/js';
+import tseslint from 'typescript-eslint';
+import eslintConfigPrettier from 'eslint-config-prettier';
+import nounsanitized from 'eslint-plugin-no-unsanitized';
+
+export default [
+	{
+		ignores: ['**/*.bundle.js', '**/dist/', 'docs/typedoc/', '**/icons/*.svg.ts', '**/*.md.ts'],
+	},
+	...tseslint.config(
+		eslint.configs.recommended,
+		...tseslint.configs.recommended,
+		...tseslint.configs.recommendedTypeChecked,
+		{
+			languageOptions: {
+				globals: {
+					...globals.browser,
+					...globals.node,
+				},
+
+				parser: tsParser,
+				ecmaVersion: 'latest',
+				sourceType: 'module',
+
+				parserOptions: {
+					project: './tsconfig.eslint.json',
+				},
+			},
+		},
+		{
+			files: ['**/*.js', '**/*.cjs', '**/*.mjs'],
+			...tseslint.configs.disableTypeChecked,
+		},
+		{
+			rules: {
+				'no-unused-vars': 'off',
+				'@typescript-eslint/no-unused-vars': [
+					'error',
+					{
+						argsIgnorePattern: '^_',
+					},
+				],
+				// The no-base-to-string rule seems to fail even in some cases where a toString is defined.
+				'@typescript-eslint/no-base-to-string': 'off',
+				// We use namespaces to create fake static methods on interfaces
+				'@typescript-eslint/no-namespace': 'off',
+				'@typescript-eslint/restrict-template-expressions': 'off',
+
+				// TODO: Remove these and fix the related issues:
+				'@typescript-eslint/no-explicit-any': 'off',
+				'@typescript-eslint/no-unsafe-assignment': 'off',
+				'@typescript-eslint/no-unsafe-member-access': 'off',
+				'@typescript-eslint/no-unsafe-argument': 'off',
+				'@typescript-eslint/no-unsafe-call': 'off',
+				'@typescript-eslint/no-floating-promises': 'off',
+				'@typescript-eslint/no-misused-promises': 'off',
+				'@typescript-eslint/no-unsafe-return': 'off',
+				'@typescript-eslint/require-await': 'off',
+			},
+		},
+	),
+	nounsanitized.configs.recommended,
+	eslintConfigPrettier,
+];

eslint.config.mjs

@@ -1,4 +1,4 @@
 module.exports = {
-	'*.{js,ts,tsx}': ['eslint --fix', 'prettier --write --ignore-unknown'],
+	'*.{js,mjs,cjs,ts,tsx}': ['eslint --fix', 'prettier --write --ignore-unknown'],
 	'*.{md,json,yml,scss,css}': ['prettier --write --ignore-unknown'],
 };

lint-staged.config.js

@@ -11,7 +11,7 @@
 		"lint": "eslint",
 		"format": "prettier --write",
 		"lint-staged": "lint-staged",
-		"lint-ci": "eslint . --max-warnings=0 --ext .js --ext .ts",
+		"lint-ci": "eslint . --max-warnings=0",
 		"format-ci": "prettier --check .",
 		"build-translation-templates": "lerna run build-translation-templates",
 		"translation-template-to-ts": "ts-node scripts/markdownTranslationFormToTs.ts",
@@ -27,9 +27,8 @@
 		"docs/debugging/*"
 	],
 	"devDependencies": {
-		"@typescript-eslint/eslint-plugin": "8.4.0",
-		"@typescript-eslint/parser": "8.4.0",
-		"eslint": "8.57.0",
+		"@eslint/js": "9.14.0",
+		"eslint": "9.14.0",
 		"eslint-config-prettier": "9.1.0",
 		"eslint-plugin-no-unsanitized": "4.1.2",
 		"jest": "29.7.0",
@@ -40,7 +39,8 @@
 		"prettier": "3.3.3",
 		"ts-jest": "29.1.2",
 		"typedoc": "0.27.3",
-		"typescript": "5.7.2"
+		"typescript": "5.7.2",
+		"typescript-eslint": "8.17.0"
 	},
 	"packageManager": "[email protected]"
 }

package.json

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-require-imports */
+
 console.log('Testing require()...');
 
 // TODO: Test require('js-draw') (requires removing Coloris because

packages/js-draw/dist-test/test_imports/test-require.cjs

@@ -312,7 +312,7 @@ describe('Editor', () => {
 			},
 		])(
 			'should support setting the background style of an image with no default background (style: %j)',
-			async ({ style, expectedBackgroundCount, expectedStyle }) => {
+			({ style, expectedBackgroundCount, expectedStyle }) => {
 				const editor = createEditor();
 				expect(editor.estimateBackgroundColor()).objEq(Color4.transparent);
 

packages/js-draw/src/Editor.test.ts

@@ -15,7 +15,7 @@ import SVGLoader from './SVGLoader/SVGLoader';
 import createEditor from './testing/createEditor';
 
 describe('Editor.toSVG', () => {
-	it('should correctly nest text objects', async () => {
+	it('should correctly nest text objects', () => {
 		const editor = createEditor();
 		const textStyle: TextRenderingStyle = {
 			fontFamily: 'sans',

packages/js-draw/src/Editor.toSVG.test.ts

@@ -31,8 +31,8 @@ describe('Editor.toSVGAsync', () => {
 		await loadTestImage(editor, numTotalPaths);
 
 		const svg = await editor.toSVGAsync({
-			onProgress: async (componentIndex) => {
-				return componentIndex <= 250;
+			onProgress: (componentIndex) => {
+				return Promise.resolve(componentIndex <= 250);
 			},
 		});
 

packages/js-draw/src/Editor.toSVGAsync.test.ts

@@ -797,7 +797,7 @@ export class Editor {
 	/** @internal */
 	protected async handleDrop(evt: DragEvent | ClipboardEvent) {
 		evt.preventDefault();
-		this.handlePaste(evt);
+		await this.handlePaste(evt);
 	}
 
 	/** @internal */

packages/js-draw/src/Editor.ts

@@ -224,7 +224,6 @@ export class Viewport {
 
 	// The separate function type definition seems necessary here.
 	// See https://stackoverflow.com/a/58163623/17055750.
-	// eslint-disable-next-line no-dupe-class-members
 	public static roundPoint(point: Point2 | number, tolerance: number): Point2 | number {
 		const scaleFactor = 10 ** Math.floor(Math.log10(tolerance));
 		const roundComponent = (component: number): number => {

packages/js-draw/src/Viewport.ts

@@ -67,7 +67,7 @@ describe('uniteCommands', () => {
 		expect(deserialized.description(editor, editor.localization)).toBe('Bar');
 	});
 
-	it('should ignore applyChunkSize when fewer than that many commands are present', async () => {
+	it('should ignore applyChunkSize when fewer than that many commands are present', () => {
 		const editor = createEditor();
 		const command = uniteCommands(
 			[EditorImage.addElement(new StrokeComponent([])), editor.setBackgroundColor(Color4.red)],

packages/js-draw/src/commands/uniteCommands.test.ts

@@ -442,7 +442,7 @@ export default abstract class AbstractComponent {
 
 	// Returns true if `data` is not deserializable. May return false even if [data]
 	// is not deserializable.
-	private static isNotDeserializable(json: any | string) {
+	private static isNotDeserializable(json: any) {
 		if (typeof json === 'string') {
 			json = JSON.parse(json);
 		}
@@ -463,7 +463,7 @@ export default abstract class AbstractComponent {
 	}
 
 	// Convert a string or an object produced by `JSON.parse` into an `AbstractComponent`.
-	public static deserialize(json: string | any): AbstractComponent {
+	public static deserialize(json: any): AbstractComponent {
 		if (typeof json === 'string') {
 			json = JSON.parse(json);
 		}

packages/js-draw/src/components/AbstractComponent.ts

@@ -28,7 +28,7 @@ const serializeComponentStyle = (style: ComponentStyle) => {
 	return result;
 };
 
-const deserializeComponentStyle = (json: Record<string, any> | any): ComponentStyle => {
+const deserializeComponentStyle = (json: Record<string, any>): ComponentStyle => {
 	const color = json.color ? Color4.fromHex(json.color) : undefined;
 	const textStyle = json.textStyle ? textStyleFromJSON(json.textStyle) : undefined;