chore: eslint rule for naming convention (#9208)

packages/svelte/package.json

@@ -83,7 +83,7 @@
     "posttest": "agadoo src/internal/index.js",
     "prepublishOnly": "pnpm build",
     "types": "node ./scripts/generate-dts.js",
-    "lint": "prettier . --cache --plugin-search-dir=. --check && eslint \"{src,test}/**/*.{ts,js}\" --cache"
+    "lint": "prettier . --cache --plugin-search-dir=. --check && eslint \"{scripts,src,test}/**/*.js\" --cache --fix"
   },
   "repository": {
     "type": "git",
@@ -129,6 +129,7 @@
     "agadoo": "^3.0.0",
     "dts-buddy": "^0.1.7",
     "esbuild": "^0.18.11",
+    "eslint-plugin-lube": "^0.1.7",
     "happy-dom": "^9.20.3",
     "jsdom": "^21.1.2",
     "kleur": "^4.1.5",

packages/svelte/scripts/.eslintrc.json

@@ -0,0 +1,6 @@
+{
+	"plugins": ["lube"],
+	"rules": {
+		"lube/svelte-naming-convention": ["error", { "fixSameNames": true }]
+	}
+}

packages/svelte/scripts/compile-test.js

@@ -1,8 +1,8 @@
 // Compile all Svelte files in a directory to JS and CSS files
 // Usage: node scripts/compile-test.js <directory>
 
-import { mkdirSync, readFileSync, writeFileSync } from 'fs';
-import path from 'path';
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import path from 'node:path';
 import glob from 'tiny-glob/sync.js';
 import { compile } from '../src/compiler/index.js';
 

packages/svelte/scripts/generate-dts.js

@@ -1,18 +1,18 @@
-import * as fs from 'fs';
+import * as fs from 'node:fs';
 import { createBundle } from 'dts-buddy';
 
 // It may look weird, but the imports MUST be ending with index.js to be properly resolved in all TS modes
 for (const name of ['action', 'animate', 'easing', 'motion', 'store', 'transition']) {
-	fs.writeFileSync(`${name}.d.ts`, `import './types/index.js';`);
+	fs.writeFileSync(`${name}.d.ts`, "import './types/index.js';");
 }
 
-fs.writeFileSync('index.d.ts', `import './types/index.js';`);
-fs.writeFileSync('compiler.d.ts', `import './types/index.js';`);
+fs.writeFileSync('index.d.ts', "import './types/index.js';");
+fs.writeFileSync('compiler.d.ts', "import './types/index.js';");
 
 // TODO: some way to mark these as deprecated
 fs.mkdirSync('./types/compiler', { recursive: true });
-fs.writeFileSync('./types/compiler/preprocess.d.ts', `import '../index.js';`);
-fs.writeFileSync('./types/compiler/interfaces.d.ts', `import '../index.js';`);
+fs.writeFileSync('./types/compiler/preprocess.d.ts', "import '../index.js';");
+fs.writeFileSync('./types/compiler/interfaces.d.ts', "import '../index.js';");
 
 await createBundle({
 	output: 'types/index.d.ts',

packages/svelte/scripts/globals-extractor.js

@@ -6,8 +6,8 @@ Please run `node scripts/globals-extractor.js` at the project root.
 see: https://github.com/microsoft/TypeScript/tree/main/lib
  ---------------------------------------------------------------------- */
 
-import http from 'https';
-import fs from 'fs';
+import http from 'node:https';
+import fs from 'node:fs';
 
 const GLOBAL_TS_PATH = './src/compiler/utils/globals.js';
 

packages/svelte/src/.eslintrc.json

@@ -0,0 +1,6 @@
+{
+	"plugins": ["lube"],
+	"rules": {
+		"lube/svelte-naming-convention": ["error", { "fixSameNames": true }]
+	}
+}

packages/svelte/src/compiler/compile/Component.js

@@ -1555,8 +1555,8 @@ export default class Component {
 			}, [])
 		);
 		if (cycle && cycle.length) {
-			const declarationList = lookup.get(cycle[0]);
-			const declaration = declarationList[0];
+			const declaration_list = lookup.get(cycle[0]);
+			const declaration = declaration_list[0];
 			return this.error(declaration.node, compiler_errors.cyclical_reactive_declaration(cycle));
 		}
 

packages/svelte/src/compiler/compile/create_module.js

@@ -4,7 +4,7 @@ import { b } from 'code-red';
  * @param {any} program
  * @param {import('estree').Identifier} name
  * @param {string} banner
- * @param {any} sveltePath
+ * @param {any} svelte_path
  * @param {Array<{ name: string; alias: import('estree').Identifier }>} helpers
  * @param {Array<{ name: string; alias: import('estree').Identifier }>} globals
  * @param {import('estree').ImportDeclaration[]} imports
@@ -15,21 +15,21 @@ export default function create_module(
 	program,
 	name,
 	banner,
-	sveltePath = 'svelte',
+	svelte_path = 'svelte',
 	helpers,
 	globals,
 	imports,
 	module_exports,
 	exports_from
 ) {
-	const internal_path = `${sveltePath}/internal`;
+	const internal_path = `${svelte_path}/internal`;
 	helpers.sort((a, b) => (a.name < b.name ? -1 : 1));
 	globals.sort((a, b) => (a.name < b.name ? -1 : 1));
 	return esm(
 		program,
 		name,
 		banner,
-		sveltePath,
+		svelte_path,
 		internal_path,
 		helpers,
 		globals,
@@ -41,11 +41,11 @@ export default function create_module(
 
 /**
  * @param {any} source
- * @param {any} sveltePath
+ * @param {any} svelte_path
  */
-function edit_source(source, sveltePath) {
+function edit_source(source, svelte_path) {
 	return source === 'svelte' || source.startsWith('svelte/')
-		? source.replace('svelte', sveltePath)
+		? source.replace('svelte', svelte_path)
 		: source;
 }
 
@@ -84,7 +84,7 @@ function get_internal_globals(globals, helpers) {
  * @param {any} program
  * @param {import('estree').Identifier} name
  * @param {string} banner
- * @param {string} sveltePath
+ * @param {string} svelte_path
  * @param {string} internal_path
  * @param {Array<{ name: string; alias: import('estree').Identifier }>} helpers
  * @param {Array<{ name: string; alias: import('estree').Identifier }>} globals
@@ -96,7 +96,7 @@ function esm(
 	program,
 	name,
 	banner,
-	sveltePath,
+	svelte_path,
 	internal_path,
 	helpers,
 	globals,
@@ -118,7 +118,7 @@ function esm(
 
 	/** @param {any} node */
 	function rewrite_import(node) {
-		const value = edit_source(node.source.value, sveltePath);
+		const value = edit_source(node.source.value, svelte_path);
 		if (node.source.value !== value) {
 			node.source.value = value;
 			node.source.raw = null;

packages/svelte/src/compiler/compile/nodes/Binding.js

@@ -98,7 +98,7 @@ export default class Binding extends Node {
 		this.is_readonly =
 			regex_dimensions.test(this.name) ||
 			regex_box_size.test(this.name) ||
-			(isElement(parent) &&
+			(is_element(parent) &&
 				((parent.is_media_node() && read_only_media_attributes.has(this.name)) ||
 					(parent.name === 'input' && type === 'file'))) /* TODO others? */;
 	}
@@ -127,6 +127,6 @@ export default class Binding extends Node {
  * @param {import('./shared/Node.js').default} node
  * @returns {node is import('./Element.js').default}
  */
-function isElement(node) {
+function is_element(node) {
 	return !!(/** @type {any} */ (node).is_media_node);
 }

packages/svelte/src/compiler/compile/nodes/EachBlock.js

@@ -84,7 +84,9 @@ export default class EachBlock extends AbstractBlock {
 		this.has_animation = false;
 		[this.const_tags, this.children] = get_const_tags(info.children, component, this, this);
 		if (this.has_animation) {
-			this.children = this.children.filter((child) => !isEmptyNode(child) && !isCommentNode(child));
+			this.children = this.children.filter(
+				(child) => !is_empty_node(child) && !is_comment_node(child)
+			);
 			if (this.children.length !== 1) {
 				const child = this.children.find(
 					(child) => !!(/** @type {import('./Element.js').default} */ (child).animation)
@@ -102,11 +104,11 @@ export default class EachBlock extends AbstractBlock {
 }
 
 /** @param {import('./interfaces.js').INode} node */
-function isEmptyNode(node) {
+function is_empty_node(node) {
 	return node.type === 'Text' && node.data.trim() === '';
 }
 
 /** @param {import('./interfaces.js').INode} node */
-function isCommentNode(node) {
+function is_comment_node(node) {
 	return node.type === 'Comment';
 }

packages/svelte/src/compiler/compile/nodes/Element.js

@@ -875,7 +875,7 @@ export default class Element extends Node {
 		) {
 			const interactive_handlers = handlers
 				.map((handler) => handler.name)
-				.filter((handlerName) => a11y_interactive_handlers.has(handlerName));
+				.filter((handler_name) => a11y_interactive_handlers.has(handler_name));
 			if (interactive_handlers.length > 0) {
 				component.warn(
 					this,

packages/svelte/src/compiler/compile/nodes/shared/get_const_tags.js

@@ -73,8 +73,8 @@ function sort_consts_nodes(consts_nodes, component) {
 		}, [])
 	);
 	if (cycle && cycle.length) {
-		const nodeList = lookup.get(cycle[0]);
-		const node = nodeList[0];
+		const node_list = lookup.get(cycle[0]);
+		const node = node_list[0];
 		component.error(node.node, compiler_errors.cyclical_const_tags(cycle));
 	}
 

packages/svelte/src/compiler/compile/render_dom/wrappers/Window.js

@@ -94,14 +94,14 @@ export default class WindowWrapper extends Wrapper {
 					bindings.scrollX && bindings.scrollY
 						? x`"${bindings.scrollX}" in this._state || "${bindings.scrollY}" in this._state`
 						: x`"${bindings.scrollX || bindings.scrollY}" in this._state`;
-				const scrollX = bindings.scrollX && x`this._state.${bindings.scrollX}`;
-				const scrollY = bindings.scrollY && x`this._state.${bindings.scrollY}`;
+				const scroll_x = bindings.scrollX && x`this._state.${bindings.scrollX}`;
+				const scroll_y = bindings.scrollY && x`this._state.${bindings.scrollY}`;
 				renderer.meta_bindings.push(b`
 					if (${condition}) {
-						@_scrollTo(${scrollX || '@_window.pageXOffset'}, ${scrollY || '@_window.pageYOffset'});
+						@_scrollTo(${scroll_x || '@_window.pageXOffset'}, ${scroll_y || '@_window.pageYOffset'});
 					}
-					${scrollX && `${scrollX} = @_window.pageXOffset;`}
-					${scrollY && `${scrollY} = @_window.pageYOffset;`}
+					${scroll_x && `${scroll_x} = @_window.pageXOffset;`}
+					${scroll_y && `${scroll_y} = @_window.pageYOffset;`}
 				`);
 				block.event_listeners.push(x`
 					@listen(@_window, "${event}", () => {
@@ -132,17 +132,17 @@ export default class WindowWrapper extends Wrapper {
 		// special case... might need to abstract this out if we add more special cases
 		if (bindings.scrollX || bindings.scrollY) {
 			const condition = renderer.dirty([bindings.scrollX, bindings.scrollY].filter(Boolean));
-			const scrollX = bindings.scrollX
+			const scroll_x = bindings.scrollX
 				? renderer.reference(bindings.scrollX)
 				: x`@_window.pageXOffset`;
-			const scrollY = bindings.scrollY
+			const scroll_y = bindings.scrollY
 				? renderer.reference(bindings.scrollY)
 				: x`@_window.pageYOffset`;
 			block.chunks.update.push(b`
 				if (${condition} && !${scrolling}) {
 					${scrolling} = true;
 					@_clearTimeout(${scrolling_timeout});
-					@_scrollTo(${scrollX}, ${scrollY});
+					@_scrollTo(${scroll_x}, ${scroll_y});
 					${scrolling_timeout} = @_setTimeout(${clear_scrolling}, 100);
 				}
 			`);

packages/svelte/src/compiler/parse/read/css-tree-cq/css_tree_parse.js

@@ -8,21 +8,21 @@ import * as node from './node/index.js';
  *
  * The new nodes are located in `./node`.
  */
-const cqSyntax = fork({
+const cq_syntax = fork({
 	atrule: {
 		// extend or override at-rule dictionary
 		container: {
 			parse: {
 				prelude() {
 					return this.createSingleNodeList(this.ContainerQuery());
 				},
-				block(isStyleBlock = false) {
-					return this.Block(isStyleBlock);
+				block(is_style_block = false) {
+					return this.Block(is_style_block);
 				}
 			}
 		}
 	},
 	node
 });
 
-export const parse = cqSyntax.parse;
+export const parse = cq_syntax.parse;

packages/svelte/src/compiler/parse/read/css-tree-cq/node/query_feature_range.js

@@ -16,7 +16,7 @@ export const structure = {
 	value: ['Identifier', 'Number', 'Comparison', 'Dimension', 'QueryCSSFunction', 'Ratio', null]
 };
 
-function lookup_non_WS_type_and_value(offset, type, referenceStr) {
+function lookup_non_ws_type_and_value(offset, type, reference_str) {
 	let current_type;
 
 	do {
@@ -26,7 +26,7 @@ function lookup_non_WS_type_and_value(offset, type, referenceStr) {
 		}
 	} while (current_type !== 0); // NULL -> 0
 
-	return current_type === type ? this.lookupValue(offset - 1, referenceStr) : false;
+	return current_type === type ? this.lookupValue(offset - 1, reference_str) : false;
 }
 
 export function parse() {
@@ -40,7 +40,7 @@ export function parse() {
 	while (!this.eof && this.tokenType !== RightParenthesis) {
 		switch (this.tokenType) {
 			case Number:
-				if (lookup_non_WS_type_and_value.call(this, 1, Delim, '/')) {
+				if (lookup_non_ws_type_and_value.call(this, 1, Delim, '/')) {
 					child = this.Ratio();
 				} else {
 					child = this.Number();