feat: change AST of {@render} and {#snippet} to match the latest version of svelte v5.

.changeset/yellow-hornets-bow.md

@@ -0,0 +1,5 @@
+---
+"svelte-eslint-parser": minor
+---
+
+feat: change AST of `{@render}` and `{#snippet}` to match the latest version of svelte v5.

docs/AST.md

@@ -423,6 +423,8 @@ interface SvelteConstTag extends Node {
 }
 ```
 
+[VariableDeclarator] is a node defined in ESTree.
+
 ### SvelteRenderTag
 
 This is the `{@render}` tag node.
@@ -431,12 +433,10 @@ This is the `{@render}` tag node.
 interface SvelteRenderTag extends Node {
   type: "SvelteRenderTag";
   callee: Identifier;
-  argument: Expression | null;
+  arguments: (Expression | SpreadElement)[];
 }
 ```
 
-[VariableDeclarator] is a node defined in ESTree.
-
 ### SvelteIfBlock
 
 This is the `{#if}` tag node. `{:else if}` is also included in this node.
@@ -555,7 +555,7 @@ This is the `{#snippet}` tag node.
 interface SvelteSnippetBlock extends Node {
   type: "SvelteSnippetBlock";
   id: Identifier;
-  context: null | Pattern;
+  params: Pattern[];
   children: Child[];
 }
 ```

package.json

@@ -47,7 +47,7 @@
     "version:ci": "env-cmd -e version-ci pnpm run build:meta && changeset version"
   },
   "peerDependencies": {
-    "svelte": "^3.37.0 || ^4.0.0 || ^5.0.0-next.37"
+    "svelte": "^3.37.0 || ^4.0.0 || ^5.0.0-next.65"
   },
   "peerDependenciesMeta": {
     "svelte": {
@@ -105,7 +105,7 @@
     "prettier-plugin-svelte": "^3.1.2",
     "rimraf": "^5.0.5",
     "semver": "^7.5.4",
-    "svelte": "^5.0.0-next.37",
+    "svelte": "^5.0.0-next.65",
     "svelte2tsx": "^0.7.0",
     "typescript": "~5.3.0",
     "typescript-eslint-parser-for-extra-files": "^0.6.0"

src/ast/html.ts

@@ -277,7 +277,7 @@ export interface SvelteConstTag extends BaseNode {
 export interface SvelteRenderTag extends BaseNode {
   type: "SvelteRenderTag";
   callee: ESTree.Identifier;
-  argument: ESTree.Expression | null;
+  arguments: (ESTree.Expression | ESTree.SpreadElement)[];
   parent:
     | SvelteProgram
     | SvelteElement
@@ -480,7 +480,7 @@ export interface SvelteKeyBlock extends BaseNode {
 export interface SvelteSnippetBlock extends BaseNode {
   type: "SvelteSnippetBlock";
   id: ESTree.Identifier;
-  context: null | ESTree.Pattern;
+  params: ESTree.Pattern[];
   children: Child[];
   parent:
     | SvelteProgram

src/context/script-let.ts

@@ -428,7 +428,7 @@ export class ScriptLetContext {
     id: ESTree.Identifier,
     closeParentIndex: number,
     snippetBlock: SvelteSnippetBlock,
-    callback: (id: ESTree.Identifier, ctx: ESTree.Pattern | null) => void,
+    callback: (id: ESTree.Identifier, params: ESTree.Pattern[]) => void,
   ): void {
     const idRange = getNodeRange(id);
     const part = this.ctx.code.slice(idRange[0], closeParentIndex + 1);
@@ -438,14 +438,14 @@ export class ScriptLetContext {
       (st, tokens, _comments, result) => {
         const fnDecl = st as ESTree.FunctionDeclaration;
         const idNode = fnDecl.id;
-        const context = fnDecl.params.length > 0 ? fnDecl.params[0] : null;
+        const params = [...fnDecl.params];
         const scope = result.getScope(fnDecl);
 
         // Process for nodes
-        callback(idNode, context);
+        callback(idNode, params);
         (idNode as any).parent = snippetBlock;
-        if (context) {
-          (context as any).parent = snippetBlock;
+        for (const param of params) {
+          (param as any).parent = snippetBlock;
         }
 
         // Process for scope

src/parser/converts/block.ts

@@ -462,24 +462,28 @@ export function convertSnippetBlock(
   const snippetBlock: SvelteSnippetBlock = {
     type: "SvelteSnippetBlock",
     id: null as any,
-    context: null as any,
+    params: [],
     children: [],
     parent,
     ...ctx.getConvertLocation({ start: nodeStart, end: node.end }),
   };
 
   const closeParenIndex = ctx.code.indexOf(
     ")",
-    getWithLoc(node.context || node.expression).end,
+    getWithLoc(
+      node.parameters.length > 0
+        ? node.parameters[node.parameters.length - 1]
+        : node.expression,
+    ).end,
   );
 
   ctx.scriptLet.nestSnippetBlock(
     node.expression,
     closeParenIndex,
     snippetBlock,
-    (id, context) => {
+    (id, params) => {
       snippetBlock.id = id;
-      snippetBlock.context = context;
+      snippetBlock.params = params;
     },
   );
 

src/parser/converts/render.ts

@@ -13,14 +13,16 @@ export function convertRenderTag(
   const mustache: SvelteRenderTag = {
     type: "SvelteRenderTag",
     callee: null as any,
-    argument: null,
+    arguments: [],
     parent,
     ...ctx.getConvertLocation(node),
   };
   const calleeRange = getWithLoc(node.expression);
   const closeParenIndex = ctx.code.indexOf(
     ")",
-    node.argument ? getWithLoc(node.argument).end : calleeRange.end,
+    node.arguments.length
+      ? getWithLoc(node.arguments[node.arguments.length - 1]).end
+      : calleeRange.end,
   );
   ctx.scriptLet.addExpressionFromRange(
     [calleeRange.start, closeParenIndex + 1],
@@ -29,9 +31,9 @@ export function convertRenderTag(
     (expression: ESTree.SimpleCallExpression) => {
       mustache.callee = expression.callee as ESTree.Identifier;
       (mustache.callee as any).parent = mustache;
-      if (expression.arguments.length) {
-        mustache.argument = expression.arguments[0] as ESTree.Expression;
-        (mustache.argument as any).parent = mustache;
+      for (const argument of expression.arguments) {
+        mustache.arguments.push(argument);
+        (argument as any).parent = mustache;
       }
     },
   );

src/parser/svelte-ast-types.ts

@@ -61,7 +61,7 @@ export interface ConstTag extends BaseNode {
 export interface RenderTag extends BaseNode {
   type: "RenderTag";
   expression: ESTree.Identifier;
-  argument: null | ESTree.Expression;
+  arguments: (ESTree.Expression | ESTree.SpreadElement)[];
 }
 export interface IfBlock extends BaseNode {
   type: "IfBlock";
@@ -116,7 +116,7 @@ export interface KeyBlock extends BaseNode {
 export interface SnippetBlock extends BaseNode {
   type: "SnippetBlock";
   expression: ESTree.Identifier;
-  context: null | ESTree.Pattern;
+  parameters: ESTree.Pattern[];
   children: TemplateNode[];
 }
 

src/visitor-keys.ts

@@ -22,7 +22,7 @@ const svelteKeys: SvelteKeysType = {
   SvelteMustacheTag: ["expression"],
   SvelteDebugTag: ["identifiers"],
   SvelteConstTag: ["declaration"],
-  SvelteRenderTag: ["callee", "argument"],
+  SvelteRenderTag: ["callee", "arguments"],
   SvelteIfBlock: ["expression", "children", "else"],
   SvelteElseBlock: ["children"],
   SvelteEachBlock: [
@@ -38,7 +38,7 @@ const svelteKeys: SvelteKeysType = {
   SvelteAwaitThenBlock: ["value", "children"],
   SvelteAwaitCatchBlock: ["error", "children"],
   SvelteKeyBlock: ["expression", "children"],
-  SvelteSnippetBlock: ["id", "context", "children"],
+  SvelteSnippetBlock: ["id", "params", "children"],
   SvelteAttribute: ["key", "value"],
   SvelteShorthandAttribute: ["key", "value"],
   SvelteSpreadAttribute: ["argument"],

tests/fixtures/parser/ast/svelte5/docs/snippets/01-output.json

@@ -782,24 +782,6 @@
           }
         }
       ],
-      "context": {
-        "type": "Identifier",
-        "name": "image",
-        "range": [
-          17,
-          22
-        ],
-        "loc": {
-          "start": {
-            "line": 1,
-            "column": 17
-          },
-          "end": {
-            "line": 1,
-            "column": 22
-          }
-        }
-      },
       "id": {
         "type": "Identifier",
         "name": "figure",
@@ -818,6 +800,26 @@
           }
         }
       },
+      "params": [
+        {
+          "type": "Identifier",
+          "name": "image",
+          "range": [
+            17,
+            22
+          ],
+          "loc": {
+            "start": {
+              "line": 1,
+              "column": 17
+            },
+            "end": {
+              "line": 1,
+              "column": 22
+            }
+          }
+        }
+      ],
       "range": [
         0,
         201
@@ -1124,24 +1126,26 @@
                 },
                 {
                   "type": "SvelteRenderTag",
-                  "argument": {
-                    "type": "Identifier",
-                    "name": "image",
-                    "range": [
-                      288,
-                      293
-                    ],
-                    "loc": {
-                      "start": {
-                        "line": 16,
-                        "column": 19
-                      },
-                      "end": {
-                        "line": 16,
-                        "column": 24
+                  "arguments": [
+                    {
+                      "type": "Identifier",
+                      "name": "image",
+                      "range": [
+                        288,
+                        293
+                      ],
+                      "loc": {
+                        "start": {
+                          "line": 16,
+                          "column": 19
+                        },
+                        "end": {
+                          "line": 16,
+                          "column": 24
+                        }
                       }
                     }
-                  },
+                  ],
                   "callee": {
                     "type": "Identifier",
                     "name": "figure",
@@ -1233,24 +1237,26 @@
             "children": [
               {
                 "type": "SvelteRenderTag",
-                "argument": {
-                  "type": "Identifier",
-                  "name": "image",
-                  "range": [
-                    330,
-                    335
-                  ],
-                  "loc": {
-                    "start": {
-                      "line": 19,
-                      "column": 18
-                    },
-                    "end": {
-                      "line": 19,
-                      "column": 23
+                "arguments": [
+                  {
+                    "type": "Identifier",
+                    "name": "image",
+                    "range": [
+                      330,
+                      335
+                    ],
+                    "loc": {
+                      "start": {
+                        "line": 19,
+                        "column": 18
+                      },
+                      "end": {
+                        "line": 19,
+                        "column": 23
+                      }
                     }
                   }
-                },
+                ],
                 "callee": {
                   "type": "Identifier",
                   "name": "figure",