chore: repo cleanup (#13029)

* chore: cleanup repo configs

- remove prettier from packages, everything runs through the root now (also better aligns with how you work with it in VS Code: no more config duplication needed)
- remove eslint from packages, run it once through the root now (revealed some inconsistencies and missing stuff, config tightened up as a result) (bump eslint while we're at it)

* update vite and related packages (since rollup includes an addition to one estree node we need to adjust code a bit)

* bump more packages

* bump jsdom

* lint

.prettierignore

@@ -2,12 +2,12 @@
 # see: https://github.com/sveltejs/svelte/pull/9609
 documentation/docs/05-misc/03-typescript.md
 
-# The following are all duplicated with prettierignore configs in the packages,
-# which is necessary because of https://github.com/prettier/prettier-vscode/issues/3424
 packages/**/dist/*.js
 packages/**/build/*.js
 packages/**/npm/**/*
 packages/**/config/*.js
+
+# packages/svelte
 packages/svelte/messages/**/*.md
 packages/svelte/src/compiler/errors.js
 packages/svelte/src/compiler/warnings.js
@@ -17,6 +17,7 @@ packages/svelte/src/internal/shared/errors.js
 packages/svelte/src/internal/shared/warnings.js
 packages/svelte/src/internal/server/errors.js
 packages/svelte/tests/migrate/samples/*/output.svelte
+packages/svelte/tests/**/*.svelte
 packages/svelte/tests/**/_expected*
 packages/svelte/tests/**/_actual*
 packages/svelte/tests/**/expected*
@@ -29,6 +30,7 @@ packages/svelte/compiler/index.js
 playgrounds/sandbox/input/**.svelte
 playgrounds/sandbox/output
 
+# sites/svelte.dev
 sites/svelte.dev/static/svelte-app.json
 sites/svelte.dev/scripts/svelte-app/
 sites/svelte.dev/src/routes/_components/Supporters/contributors.jpg

benchmarking/benchmarks/kairo/util.js

@@ -1,7 +1,6 @@
-
 export function busy() {
-  let a = 0;
-  for (let i = 0; i < 1_00; i++) {
-    a++;
-  }
+	let a = 0;
+	for (let i = 0; i < 1_00; i++) {
+		a++;
+	}
 }

eslint.config.js

@@ -39,7 +39,8 @@ export default [
 	{
 		languageOptions: {
 			parserOptions: {
-				project: true
+				projectService: true,
+				tsconfigRootDir: import.meta.dirname
 			}
 		},
 		plugins: {
@@ -64,10 +65,14 @@ export default [
 		}
 	},
 	{
-		files: ['playgrounds/**/*'],
+		// If you get an error along the lines of "@typescript-eslint/await-thenable needs a project service configured", then that likely means
+		// that eslint rules that need to be type-aware run through a Svelte file which seems unsupported at the moment. In that case, ensure that
+		// these are excluded to run on Svelte files.
+		files: ['**/*.svelte'],
 		rules: {
-			'lube/svelte-naming-convention': 'off',
-			'no-console': 'off'
+			'@typescript-eslint/await-thenable': 'off',
+			'@typescript-eslint/prefer-promise-reject-errors': 'off',
+			'@typescript-eslint/require-await': 'off'
 		}
 	},
 	{
@@ -87,6 +92,12 @@ export default [
 			'packages/svelte/src/internal/client/warnings.js',
 			'packages/svelte/src/internal/shared/warnings.js',
 			'packages/svelte/compiler/index.js',
+			// stuff we don't want to lint
+			'benchmarking/**',
+			'coverage/**',
+			'playgrounds/sandbox/**',
+			// exclude top level config files
+			'*.config.js',
 			// documentation can contain invalid examples
 			'documentation',
 			// contains a fork of the REPL which doesn't adhere to eslint rules

package.json

@@ -18,8 +18,8 @@
     "build:sites": "pnpm -r --filter=./sites/* build",
     "preview-site": "npm run build --prefix sites/svelte-5-preview",
     "check": "cd packages/svelte && pnpm build && cd ../../ && pnpm -r check",
-    "lint": "pnpm -r lint && prettier --check documentation",
-    "format": "pnpm -r format && prettier --check --write documentation",
+    "lint": "eslint && prettier --check .",
+    "format": "prettier --write .",
     "test": "vitest run",
     "test-output": "vitest run --coverage --reporter=json --outputFile=sites/svelte-5-preview/src/routes/status/results.json",
     "changeset:version": "changeset version && pnpm -r generate:version && git add --all",
@@ -33,18 +33,18 @@
     "@sveltejs/eslint-config": "^8.0.1",
     "@svitejs/changesets-changelog-github-compact": "^1.1.0",
     "@types/node": "^20.11.5",
-    "@vitest/coverage-v8": "^1.2.1",
-    "eslint": "^9.6.0",
+    "@vitest/coverage-v8": "^2.0.5",
+    "eslint": "^9.9.1",
     "eslint-plugin-lube": "^0.4.3",
-    "jsdom": "22.0.0",
-    "playwright": "^1.41.1",
+    "jsdom": "25.0.0",
+    "playwright": "^1.46.1",
     "prettier": "^3.2.4",
     "prettier-plugin-svelte": "^3.1.2",
     "svelte": "workspace:^",
-    "typescript": "^5.5.2",
-    "typescript-eslint": "^8.0.0-alpha.34",
+    "typescript": "^5.5.4",
+    "typescript-eslint": "^8.2.0",
     "v8-natives": "^1.2.5",
-    "vitest": "^1.2.1"
+    "vitest": "^2.0.5"
   },
   "pnpm": {
     "overrides": {

packages/svelte/package.json

@@ -112,42 +112,38 @@
     "generate:version": "node ./scripts/generate-version.js",
     "generate:types": "node ./scripts/generate-types.js && tsc -p tsconfig.generated.json",
     "prepublishOnly": "pnpm build",
-    "format": "prettier --check --write .",
-    "lint": "prettier --check . && eslint",
     "knip": "pnpm dlx knip"
   },
   "devDependencies": {
-    "@jridgewell/trace-mapping": "^0.3.22",
-    "@playwright/test": "^1.35.1",
+    "@jridgewell/trace-mapping": "^0.3.25",
+    "@playwright/test": "^1.46.1",
     "@rollup/plugin-commonjs": "^25.0.7",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-virtual": "^3.0.2",
     "@types/aria-query": "^5.0.4",
     "@types/node": "^20.11.5",
     "dts-buddy": "^0.5.1",
-    "esbuild": "^0.19.11",
-    "eslint": "^9.6.0",
-    "prettier": "^3.2.4",
-    "rollup": "^4.9.5",
+    "esbuild": "^0.21.5",
+    "rollup": "^4.21.0",
     "source-map": "^0.7.4",
     "tiny-glob": "^0.2.9",
-    "typescript": "^5.5.2",
-    "vitest": "^1.2.1"
+    "typescript": "^5.5.4",
+    "vitest": "^2.0.5"
   },
   "dependencies": {
-    "@ampproject/remapping": "^2.2.1",
-    "@jridgewell/sourcemap-codec": "^1.4.15",
+    "@ampproject/remapping": "^2.3.0",
+    "@jridgewell/sourcemap-codec": "^1.5.0",
     "@types/estree": "^1.0.5",
-    "acorn": "^8.11.3",
+    "acorn": "^8.12.1",
     "acorn-typescript": "^1.4.13",
     "aria-query": "^5.3.0",
-    "axobject-query": "^4.0.0",
+    "axobject-query": "^4.1.0",
     "esm-env": "^1.0.0",
     "esrap": "^1.2.2",
     "is-reference": "^3.0.2",
     "locate-character": "^3.0.0",
-    "magic-string": "^0.30.5",
+    "magic-string": "^0.30.11",
     "zimmerframe": "^1.1.2"
   }
 }

packages/svelte/src/compiler/utils/builders.js

@@ -352,7 +352,7 @@ export function prop(kind, key, value, computed = false) {
  * @returns {ESTree.PropertyDefinition}
  */
 export function prop_def(key, value, computed = false, is_static = false) {
-	return { type: 'PropertyDefinition', key, value, computed, static: is_static };
+	return { type: 'PropertyDefinition', key, value, computed, static: is_static, decorators: [] };
 }
 
 /**
@@ -541,7 +541,8 @@ export function method(kind, key, params, body, computed = false, is_static = fa
 		kind,
 		value: function_builder(null, params, block(body)),
 		computed,
-		static: is_static
+		static: is_static,
+		decorators: []
 	};
 }
 

packages/svelte/src/compiler/utils/mapped_code.js

@@ -328,7 +328,7 @@ function apply_preprocessor_sourcemap(filename, svelte_map, preprocessor_map_inp
 			}
 		}
 	});
-	return /** @type {SourceMap} */ (result_map);
+	return /** @type {any} */ (result_map);
 }
 const regex_data_uri = /data:(?:application|text)\/json;(?:charset[:=]\S+?;)?base64,(\S*)/;
 // parse attached sourcemap in processed.code

packages/svelte/tests/preprocess/test.ts

@@ -30,6 +30,7 @@ const { test, run } = suite<PreprocessTest>(async (config, cwd) => {
 	expect(result.dependencies).toEqual(config.dependencies || []);
 
 	if (fs.existsSync(`${cwd}/expected_map.json`)) {
+		delete (result.map as any).ignoreList;
 		const expected_map = JSON.parse(fs.readFileSync(`${cwd}/expected_map.json`, 'utf-8'));
 		// You can use https://sokra.github.io/source-map-visualization/#custom to visualize the source map
 		expect(JSON.parse(JSON.stringify(result.map))).toEqual(expected_map);

packages/svelte/tests/runtime-legacy/samples/css-comments/_config.js

@@ -6,6 +6,6 @@ export default test({
 		const p = target.querySelector('p');
 		ok(p);
 
-		assert.equal(window.getComputedStyle(p).color, 'red');
+		assert.equal(window.getComputedStyle(p).color, 'rgb(255, 0, 0)');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/css-space-in-attribute/_config.js

@@ -5,9 +5,9 @@ export default test({
 		const [control, test] = target.querySelectorAll('p');
 
 		assert.equal(window.getComputedStyle(control).color, '');
-		assert.equal(window.getComputedStyle(control).backgroundColor, '');
+		assert.equal(window.getComputedStyle(control).backgroundColor, 'rgba(0, 0, 0, 0)');
 
-		assert.equal(window.getComputedStyle(test).color, 'red');
-		assert.equal(window.getComputedStyle(test).backgroundColor, 'black');
+		assert.equal(window.getComputedStyle(test).color, 'rgb(255, 0, 0)');
+		assert.equal(window.getComputedStyle(test).backgroundColor, 'rgb(0, 0, 0)');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-and-style-attr-merged/_config.js

@@ -9,7 +9,7 @@ export default test({
 		const p = target.querySelector('p');
 		ok(p);
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'red');
+		assert.equal(styles.color, 'rgb(255, 0, 0)');
 		assert.equal(styles.height, '40px');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-and-style-attr/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'red');
+		assert.equal(styles.color, 'rgb(255, 0, 0)');
 		assert.equal(styles.height, '40px');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-multiple/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		let styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'red');
+		assert.equal(styles.color, 'rgb(255, 0, 0)');
 
 		component.myColor = 'pink';
 		component.width = '100vh';
@@ -22,7 +22,7 @@ export default test({
 			target.innerHTML,
 			'<p style="color: pink; width: 100vh; font-weight: 100; position: absolute;"></p>'
 		);
-		assert.equal(styles.color, 'pink');
+		assert.equal(styles.color, 'rgb(255, 192, 203)');
 		assert.equal(styles.width, '100vh');
 		assert.equal(styles.fontWeight, '100');
 		assert.equal(styles.position, 'absolute');

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-shorthand-declaration-only/_config.js

@@ -11,8 +11,8 @@ export default test({
 	test({ assert, target, window }) {
 		const [p1, p2] = target.querySelectorAll('p');
 
-		assert.equal(window.getComputedStyle(p1).color, 'red');
-		assert.equal(window.getComputedStyle(p2).color, 'red');
+		assert.equal(window.getComputedStyle(p1).color, 'rgb(255, 0, 0)');
+		assert.equal(window.getComputedStyle(p2).color, 'rgb(255, 0, 0)');
 
 		const btn = target.querySelector('button');
 		btn?.click();
@@ -27,7 +27,7 @@ export default test({
 		`
 		);
 
-		assert.equal(window.getComputedStyle(p1).color, 'green');
-		assert.equal(window.getComputedStyle(p2).color, 'green');
+		assert.equal(window.getComputedStyle(p1).color, 'rgb(0, 128, 0)');
+		assert.equal(window.getComputedStyle(p2).color, 'rgb(0, 128, 0)');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-shorthand/_config.js

@@ -9,8 +9,8 @@ export default test({
 	test({ assert, component, target, window }) {
 		const [p1, p2] = target.querySelectorAll('p');
 
-		assert.equal(window.getComputedStyle(p1).color, 'red');
-		assert.equal(window.getComputedStyle(p2).color, 'red');
+		assert.equal(window.getComputedStyle(p1).color, 'rgb(255, 0, 0)');
+		assert.equal(window.getComputedStyle(p2).color, 'rgb(255, 0, 0)');
 
 		component.color = 'blue';
 		assert.htmlEqual(
@@ -21,7 +21,7 @@ export default test({
 		`
 		);
 
-		assert.equal(window.getComputedStyle(p1).color, 'blue');
-		assert.equal(window.getComputedStyle(p2).color, 'blue');
+		assert.equal(window.getComputedStyle(p1).color, 'rgb(0, 0, 255)');
+		assert.equal(window.getComputedStyle(p2).color, 'rgb(0, 0, 255)');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-spread-and-attr/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		let styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'green');
+		assert.equal(styles.color, 'rgb(0, 128, 0)');
 
 		component.color = null;
 		assert.htmlEqual(target.innerHTML, '<p style=""></p>');
@@ -29,12 +29,12 @@ export default test({
 		assert.htmlEqual(target.innerHTML, '<p style="background-color: green;"></p>');
 		styles = window.getComputedStyle(p);
 		assert.equal(styles.color, '');
-		assert.equal(styles.backgroundColor, 'green');
+		assert.equal(styles.backgroundColor, 'rgb(0, 128, 0)');
 
 		component.color = 'purple';
 		assert.htmlEqual(target.innerHTML, '<p style="background-color: green; color: purple;"></p>');
 		styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'purple');
-		assert.equal(styles.backgroundColor, 'green');
+		assert.equal(styles.color, 'rgb(128, 0, 128)');
+		assert.equal(styles.backgroundColor, 'rgb(0, 128, 0)');
 	}
 });

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-spread-dynamic/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'blue');
+		assert.equal(styles.color, 'rgb(0, 0, 255)');
 		assert.equal(styles.width, '65px');
 		assert.equal(p.id, 'my-id');
 

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-spread/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'blue');
+		assert.equal(styles.color, 'rgb(0, 0, 255)');
 		assert.equal(styles.width, '65px');
 		assert.equal(p.id, 'my-id');
 	}

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-string-variable/_config.js

@@ -10,7 +10,7 @@ export default test({
 		ok(p);
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'green');
+		assert.equal(styles.color, 'rgb(0, 128, 0)');
 		assert.equal(styles.transform, 'translateX(45px)');
 		assert.equal(styles.border, '100px solid pink');
 

packages/svelte/tests/runtime-legacy/samples/inline-style-directive-string/_config.js

@@ -10,6 +10,6 @@ export default test({
 		ok(p);
 
 		const styles = window.getComputedStyle(p);
-		assert.equal(styles.color, 'red');
+		assert.equal(styles.color, 'rgb(255, 0, 0)');
 	}
 });