eslint-plugin-svelte 3.3.2 → 3.4.0

package/README.md

@@ -272,7 +272,7 @@ These rules relate to possible syntax or logic errors in Svelte code:
 | [svelte/no-shorthand-style-property-overrides](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-shorthand-style-property-overrides/) | disallow shorthand style properties that override related longhand properties | :star: |
 | [svelte/no-store-async](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-store-async/) | disallow using async/await inside svelte stores because it causes issues with the auto-unsubscribing features | :star: |
 | [svelte/no-unknown-style-directive-property](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-unknown-style-directive-property/) | disallow unknown `style:property` | :star: |
-| [svelte/require-store-callbacks-use-set-param](https://sveltejs.github.io/eslint-plugin-svelte/rules/require-store-callbacks-use-set-param/) | store callbacks must use `set` param |  |
+| [svelte/require-store-callbacks-use-set-param](https://sveltejs.github.io/eslint-plugin-svelte/rules/require-store-callbacks-use-set-param/) | store callbacks must use `set` param | :bulb: |
 | [svelte/require-store-reactive-access](https://sveltejs.github.io/eslint-plugin-svelte/rules/require-store-reactive-access/) | disallow to use of the store itself as an operand. Need to use $ prefix or get function. | :star::wrench: |
 | [svelte/valid-compile](https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-compile/) | disallow warnings when compiling. |  |
 | [svelte/valid-style-parse](https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-style-parse/) | require valid style element parsing |  |
@@ -294,7 +294,7 @@ These rules relate to better ways of doing things to help you avoid problems:
 |:--------|:------------|:---|
 | [svelte/block-lang](https://sveltejs.github.io/eslint-plugin-svelte/rules/block-lang/) | disallows the use of languages other than those specified in the configuration for the lang attribute of `<script>` and `<style>` blocks. | :bulb: |
 | [svelte/button-has-type](https://sveltejs.github.io/eslint-plugin-svelte/rules/button-has-type/) | disallow usage of button without an explicit type attribute |  |
-| [svelte/no-at-debug-tags](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-debug-tags/) | disallow the use of `{@debug}` | :star: |
+| [svelte/no-at-debug-tags](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-debug-tags/) | disallow the use of `{@debug}` | :star::bulb: |
 | [svelte/no-ignored-unsubscribe](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-ignored-unsubscribe/) | disallow ignoring the unsubscribe method returned by the `subscribe()` on Svelte stores. |  |
 | [svelte/no-immutable-reactive-statements](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-immutable-reactive-statements/) | disallow reactive statements that don't reference reactive values. | :star: |
 | [svelte/no-inline-styles](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-inline-styles/) | disallow attributes and directives that produce inline styles |  |
@@ -323,7 +323,7 @@ These rules relate to style guidelines, and are therefore quite subjective:
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [svelte/consistent-selector-style](https://sveltejs.github.io/eslint-plugin-svelte/rules/consistent-selector-style/) | enforce a consistent style for CSS selectors |  |
-| [svelte/derived-has-same-inputs-outputs](https://sveltejs.github.io/eslint-plugin-svelte/rules/derived-has-same-inputs-outputs/) | derived store should use same variable names between values and callback |  |
+| [svelte/derived-has-same-inputs-outputs](https://sveltejs.github.io/eslint-plugin-svelte/rules/derived-has-same-inputs-outputs/) | derived store should use same variable names between values and callback | :bulb: |
 | [svelte/first-attribute-linebreak](https://sveltejs.github.io/eslint-plugin-svelte/rules/first-attribute-linebreak/) | enforce the location of first attribute | :wrench: |
 | [svelte/html-closing-bracket-new-line](https://sveltejs.github.io/eslint-plugin-svelte/rules/html-closing-bracket-new-line/) | Require or disallow a line break before tag's closing brackets | :wrench: |
 | [svelte/html-closing-bracket-spacing](https://sveltejs.github.io/eslint-plugin-svelte/rules/html-closing-bracket-spacing/) | require or disallow a space before tag's closing brackets | :wrench: |

package/lib/main.d.ts

@@ -14,7 +14,7 @@ export declare const configs: {
 export declare const rules: Record<string, Rule.RuleModule>;
 export declare const meta: {
     name: "eslint-plugin-svelte";
-    version: "3.3.2";
+    version: "3.4.0";
 };
 export declare const processors: {
     '.svelte': typeof processor;

package/lib/meta.d.ts

@@ -1,2 +1,2 @@
 export declare const name = "eslint-plugin-svelte";
-export declare const version = "3.3.2";
+export declare const version = "3.4.0";

package/lib/meta.js

@@ -2,4 +2,4 @@
 // This file has been automatically generated,
 // in order to update its content execute "pnpm run update"
 export const name = 'eslint-plugin-svelte';
-export const version = '3.3.2';
+export const version = '3.4.0';

package/lib/rules/derived-has-same-inputs-outputs.js

@@ -1,5 +1,16 @@
 import { createRule } from '../utils/index.js';
 import { extractStoreReferences } from './reference-helpers/svelte-store.js';
+import { findVariableForReplacement } from '../utils/ast-utils.js';
+function createFixer(node, variable, name) {
+    return function* fix(fixer) {
+        yield fixer.replaceText(node, name);
+        if (variable) {
+            for (const ref of variable.references) {
+                yield fixer.replaceText(ref.identifier, name);
+            }
+        }
+    };
+}
 export default createRule('derived-has-same-inputs-outputs', {
     meta: {
         docs: {
@@ -8,9 +19,11 @@ export default createRule('derived-has-same-inputs-outputs', {
             recommended: false,
             conflictWithPrettier: false
         },
+        hasSuggestions: true,
         schema: [],
         messages: {
-            unexpected: "The argument name should be '{{name}}'."
+            unexpected: "The argument name should be '{{name}}'.",
+            renameParam: 'Rename the parameter from {{oldName}} to {{newName}}.'
         },
         type: 'suggestion'
     },
@@ -33,11 +46,21 @@ export default createRule('derived-has-same-inputs-outputs', {
                 return;
             const expectedName = `$${args.name}`;
             if (expectedName !== fnParam.name) {
+                const { hasConflict, variable } = findVariableForReplacement(context, fn.body, fnParam.name, expectedName);
                 context.report({
                     node: fn,
                     loc: fnParam.loc,
                     messageId: 'unexpected',
-                    data: { name: expectedName }
+                    data: { name: expectedName },
+                    suggest: hasConflict
+                        ? undefined
+                        : [
+                            {
+                                messageId: 'renameParam',
+                                data: { oldName: fnParam.name, newName: expectedName },
+                                fix: createFixer(fnParam, variable, expectedName)
+                            }
+                        ]
                 });
             }
         }
@@ -57,11 +80,21 @@ export default createRule('derived-has-same-inputs-outputs', {
                 if (element && element.type === 'Identifier' && argName) {
                     const expectedName = `$${argName}`;
                     if (expectedName !== element.name) {
+                        const { hasConflict, variable } = findVariableForReplacement(context, fn.body, element.name, expectedName);
                         context.report({
                             node: fn,
                             loc: element.loc,
                             messageId: 'unexpected',
-                            data: { name: expectedName }
+                            data: { name: expectedName },
+                            suggest: hasConflict
+                                ? undefined
+                                : [
+                                    {
+                                        messageId: 'renameParam',
+                                        data: { oldName: element.name, newName: expectedName },
+                                        fix: createFixer(element, variable, expectedName)
+                                    }
+                                ]
                         });
                     }
                 }

package/lib/rules/no-at-debug-tags.js

@@ -7,9 +7,11 @@ export default createRule('no-at-debug-tags', {
             recommended: true,
             default: 'warn'
         },
+        hasSuggestions: true,
         schema: [],
         messages: {
-            unexpected: 'Unexpected `{@debug}`.'
+            unexpected: 'Unexpected `{@debug}`.',
+            suggestRemove: 'Remove `{@debug}` from the source'
         },
         type: 'problem'
     },
@@ -18,7 +20,13 @@ export default createRule('no-at-debug-tags', {
             SvelteDebugTag(node) {
                 context.report({
                     node,
-                    messageId: 'unexpected'
+                    messageId: 'unexpected',
+                    suggest: [
+                        {
+                            messageId: 'suggestRemove',
+                            fix: (fixer) => fixer.remove(node)
+                        }
+                    ]
                 });
             }
         };

package/lib/rules/no-unused-props.js

@@ -127,21 +127,21 @@ export default createRule('no-unused-props', {
         /**
          * Finds all property access paths for a given variable.
          */
-        function getUsedNestedPropertyNames(node) {
+        function getUsedNestedPropertyPathsArray(node) {
             const variable = findVariable(context, node);
             if (!variable)
                 return [];
-            const paths = [];
+            const pathsArray = [];
             for (const reference of variable.references) {
                 if ('identifier' in reference &&
                     reference.identifier.type === 'Identifier' &&
                     (reference.identifier.range[0] !== node.range[0] ||
                         reference.identifier.range[1] !== node.range[1])) {
                     const referencePath = getPropertyPath(reference.identifier);
-                    paths.push(referencePath);
+                    pathsArray.push(referencePath);
                 }
             }
-            return paths;
+            return pathsArray;
         }
         /**
          * Checks if a property is from TypeScript's built-in type definitions.
@@ -157,7 +157,7 @@ export default createRule('no-unused-props', {
                 return false;
             return sourceFile.fileName.includes('node_modules/typescript/lib/');
         }
-        function getUsedPropertiesFromPattern(pattern) {
+        function getUsedPropertyNamesFromPattern(pattern) {
             const usedProps = new Set();
             for (const prop of pattern.properties) {
                 if (prop.type === 'Property' && prop.key.type === 'Identifier') {
@@ -192,24 +192,32 @@ export default createRule('no-unused-props', {
         /**
          * Recursively checks for unused properties in a type.
          */
-        function checkUnusedProperties(type, usedPaths, usedProps, reportNode, parentPath, checkedTypes, reportedProps) {
+        function checkUnusedProperties({ propsType, usedPropertyPaths, declaredPropertyNames, reportNode, parentPath, checkedPropsTypes, reportedPropertyPaths }) {
             // Skip checking if the type itself is a class
-            if (isClassType(type))
+            if (isClassType(propsType))
                 return;
-            const typeStr = typeChecker.typeToString(type);
-            if (checkedTypes.has(typeStr))
+            const typeStr = typeChecker.typeToString(propsType);
+            if (checkedPropsTypes.has(typeStr))
                 return;
-            checkedTypes.add(typeStr);
-            if (shouldIgnoreType(type))
+            checkedPropsTypes.add(typeStr);
+            if (shouldIgnoreType(propsType))
                 return;
-            const properties = typeChecker.getPropertiesOfType(type);
-            const baseTypes = type.getBaseTypes();
-            if (!properties.length && (!baseTypes || baseTypes.length === 0)) {
+            const properties = typeChecker.getPropertiesOfType(propsType);
+            const propsBaseTypes = propsType.getBaseTypes();
+            if (!properties.length && (!propsBaseTypes || propsBaseTypes.length === 0)) {
                 return;
             }
-            if (baseTypes) {
-                for (const baseType of baseTypes) {
-                    checkUnusedProperties(baseType, usedPaths, usedProps, reportNode, parentPath, checkedTypes, reportedProps);
+            if (propsBaseTypes) {
+                for (const propsBaseType of propsBaseTypes) {
+                    checkUnusedProperties({
+                        propsType: propsBaseType,
+                        usedPropertyPaths,
+                        declaredPropertyNames,
+                        reportNode,
+                        parentPath,
+                        checkedPropsTypes,
+                        reportedPropertyPaths
+                    });
                 }
             }
             for (const prop of properties) {
@@ -222,20 +230,19 @@ export default createRule('no-unused-props', {
                     continue;
                 const currentPath = [...parentPath, propName];
                 const currentPathStr = [...parentPath, propName].join('.');
-                if (reportedProps.has(currentPathStr))
+                if (reportedPropertyPaths.has(currentPathStr))
                     continue;
                 const propType = typeChecker.getTypeOfSymbol(prop);
-                const joinedUsedPaths = usedPaths.map((path) => path.join('.'));
-                const isUsedThisInPath = joinedUsedPaths.includes(currentPathStr);
-                const isUsedInPath = joinedUsedPaths.some((path) => {
+                const isUsedThisInPath = usedPropertyPaths.includes(currentPathStr);
+                const isUsedInPath = usedPropertyPaths.some((path) => {
                     return path.startsWith(`${currentPathStr}.`);
                 });
                 if (isUsedThisInPath && !isUsedInPath) {
                     continue;
                 }
-                const isUsedInProps = usedProps.has(propName);
+                const isUsedInProps = declaredPropertyNames.has(propName);
                 if (!isUsedInPath && !isUsedInProps) {
-                    reportedProps.add(currentPathStr);
+                    reportedPropertyPaths.add(currentPathStr);
                     context.report({
                         node: reportNode,
                         messageId: parentPath.length ? 'unusedNestedProp' : 'unusedProp',
@@ -246,19 +253,27 @@ export default createRule('no-unused-props', {
                     });
                     continue;
                 }
-                const isUsedNested = joinedUsedPaths.some((path) => {
+                const isUsedNested = usedPropertyPaths.some((path) => {
                     return path.startsWith(`${currentPathStr}.`);
                 });
                 if (isUsedNested || isUsedInProps) {
-                    checkUnusedProperties(propType, usedPaths, usedProps, reportNode, currentPath, checkedTypes, reportedProps);
+                    checkUnusedProperties({
+                        propsType: propType,
+                        usedPropertyPaths,
+                        declaredPropertyNames,
+                        reportNode,
+                        parentPath: currentPath,
+                        checkedPropsTypes,
+                        reportedPropertyPaths
+                    });
                 }
             }
             // Check for unused index signatures only at the root level
             if (parentPath.length === 0) {
-                const indexType = type.getStringIndexType();
-                const numberIndexType = type.getNumberIndexType();
+                const indexType = propsType.getStringIndexType();
+                const numberIndexType = propsType.getNumberIndexType();
                 const hasIndexSignature = Boolean(indexType) || Boolean(numberIndexType);
-                if (hasIndexSignature && !hasRestElement(usedProps)) {
+                if (hasIndexSignature && !hasRestElement(declaredPropertyNames)) {
                     context.report({
                         node: reportNode,
                         messageId: 'unusedIndexSignature'
@@ -296,26 +311,44 @@ export default createRule('no-unused-props', {
                 const tsNode = tools.service.esTreeNodeToTSNodeMap.get(node);
                 if (!tsNode || !tsNode.type)
                     return;
-                const propType = typeChecker.getTypeFromTypeNode(tsNode.type);
-                let usedPaths = [];
-                let usedProps = new Set();
+                const propsType = typeChecker.getTypeFromTypeNode(tsNode.type);
+                let usedPropertyPathsArray = [];
+                let declaredPropertyNames = new Set();
                 if (node.id.type === 'ObjectPattern') {
-                    usedProps = getUsedPropertiesFromPattern(node.id);
-                    if (usedProps.size === 0)
+                    declaredPropertyNames = getUsedPropertyNamesFromPattern(node.id);
+                    if (declaredPropertyNames.size === 0)
                         return;
-                    const identifiers = node.id.properties
-                        .filter((p) => p.type === 'Property')
-                        .map((p) => p.value)
-                        .filter((v) => v.type === 'Identifier');
+                    const identifiers = [];
+                    for (const p of node.id.properties) {
+                        if (p.type !== 'Property') {
+                            continue;
+                        }
+                        if (p.value.type === 'Identifier') {
+                            identifiers.push(p.value);
+                        }
+                        else if (p.value.type === 'AssignmentPattern' && p.value.left.type === 'Identifier') {
+                            identifiers.push(p.value.left);
+                        }
+                    }
                     for (const identifier of identifiers) {
-                        const paths = getUsedNestedPropertyNames(identifier);
-                        usedPaths.push(...paths.map((path) => [identifier.name, ...path]));
+                        const paths = getUsedNestedPropertyPathsArray(identifier);
+                        usedPropertyPathsArray.push(...paths.map((path) => [identifier.name, ...path]));
                     }
                 }
                 else if (node.id.type === 'Identifier') {
-                    usedPaths = getUsedNestedPropertyNames(node.id);
+                    usedPropertyPathsArray = getUsedNestedPropertyPathsArray(node.id);
                 }
-                checkUnusedProperties(propType, normalizeUsedPaths(usedPaths), usedProps, node.id, [], new Set(), new Set());
+                checkUnusedProperties({
+                    propsType,
+                    usedPropertyPaths: normalizeUsedPaths(usedPropertyPathsArray).map((pathArray) => {
+                        return pathArray.join('.');
+                    }),
+                    declaredPropertyNames,
+                    reportNode: node.id,
+                    parentPath: [],
+                    checkedPropsTypes: new Set(),
+                    reportedPropertyPaths: new Set()
+                });
             }
         };
     }

package/lib/rules/require-store-callbacks-use-set-param.js

@@ -1,5 +1,7 @@
+import { findVariableForReplacement } from '../utils/ast-utils.js';
 import { createRule } from '../utils/index.js';
 import { extractStoreReferences } from './reference-helpers/svelte-store.js';
+import { getSourceCode } from '../utils/compat.js';
 export default createRule('require-store-callbacks-use-set-param', {
     meta: {
         docs: {
@@ -7,9 +9,12 @@ export default createRule('require-store-callbacks-use-set-param', {
             category: 'Possible Errors',
             recommended: false
         },
+        hasSuggestions: true,
         schema: [],
         messages: {
-            unexpected: 'Store callbacks must use `set` param.'
+            unexpected: 'Store callbacks must use `set` param.',
+            updateParam: 'Rename parameter from {{oldName}} to `set`.',
+            addParam: 'Add a `set` parameter.'
         },
         type: 'suggestion'
     },
@@ -23,10 +28,43 @@ export default createRule('require-store-callbacks-use-set-param', {
                     }
                     const param = fn.params[0];
                     if (!param || (param.type === 'Identifier' && param.name !== 'set')) {
+                        const { hasConflict, variable } = findVariableForReplacement(context, fn.body, param ? param.name : null, 'set');
+                        const suggest = [];
+                        if (!hasConflict) {
+                            if (param) {
+                                suggest.push({
+                                    messageId: 'updateParam',
+                                    data: { oldName: param.name },
+                                    *fix(fixer) {
+                                        yield fixer.replaceText(param, 'set');
+                                        if (variable) {
+                                            for (const ref of variable.references) {
+                                                yield fixer.replaceText(ref.identifier, 'set');
+                                            }
+                                        }
+                                    }
+                                });
+                            }
+                            else {
+                                const token = getSourceCode(context).getTokenBefore(fn.body, {
+                                    filter: (token) => token.type === 'Punctuator' && token.value === '(',
+                                    includeComments: false
+                                });
+                                if (token) {
+                                    suggest.push({
+                                        messageId: 'addParam',
+                                        fix(fixer) {
+                                            return fixer.insertTextAfter(token, 'set');
+                                        }
+                                    });
+                                }
+                            }
+                        }
                         context.report({
                             node: fn,
                             loc: fn.loc,
-                            messageId: 'unexpected'
+                            messageId: 'unexpected',
+                            suggest
                         });
                     }
                 }

package/lib/utils/ast-utils.d.ts

@@ -113,3 +113,14 @@ export declare function isSvgElement(node: SvAST.SvelteElement): boolean;
 export declare function isMathMLElement(node: SvAST.SvelteElement): boolean;
 /** Checks whether the given identifier node is used as an expression. */
 export declare function isExpressionIdentifier(node: TSESTree.Identifier): boolean;
+/**
+ * Finds the variable for a given name in the specified node's scope.
+ * Also determines if the replacement name is already in use.
+ *
+ * If the `name` is set to null, this assumes you're adding a new variable
+ * and reports if it is already in use.
+ */
+export declare function findVariableForReplacement(context: RuleContext, node: TSESTree.Node, name: string | null, replacementName: string): {
+    hasConflict: boolean;
+    variable: Variable | null;
+};

package/lib/utils/ast-utils.js

@@ -471,3 +471,28 @@ function getSimpleNameFromNode(node, context) {
     }
     return getSourceCode(context).getText(node);
 }
+/**
+ * Finds the variable for a given name in the specified node's scope.
+ * Also determines if the replacement name is already in use.
+ *
+ * If the `name` is set to null, this assumes you're adding a new variable
+ * and reports if it is already in use.
+ */
+export function findVariableForReplacement(context, node, name, replacementName) {
+    const scope = getScope(context, node);
+    let variable = null;
+    for (const ref of scope.references) {
+        if (ref.identifier.name === replacementName) {
+            return { hasConflict: true, variable: null };
+        }
+    }
+    for (const v of scope.variables) {
+        if (v.name === replacementName) {
+            return { hasConflict: true, variable: null };
+        }
+        if (v.name === name) {
+            variable = v;
+        }
+    }
+    return { hasConflict: false, variable };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-svelte",
-  "version": "3.3.2",
+  "version": "3.4.0",
   "description": "ESLint plugin for Svelte using AST",
   "repository": "git+https://github.com/sveltejs/eslint-plugin-svelte.git",
   "homepage": "https://sveltejs.github.io/eslint-plugin-svelte",
@@ -41,7 +41,7 @@
     "postcss-load-config": "^3.1.4",
     "postcss-safe-parser": "^7.0.0",
     "semver": "^7.6.3",
-    "svelte-eslint-parser": "^1.0.1"
+    "svelte-eslint-parser": "^1.1.1"
   },
   "devDependencies": {
     "@babel/core": "^7.26.0",