feat: async Svelte (#725)

Author: baseballyama

.changeset/huge-islands-crash.md

@@ -0,0 +1,5 @@
+---
+"svelte-eslint-parser": minor
+---
+
+feat: support asynchronous svelte

README.md

@@ -12,7 +12,7 @@
 
 # svelte-eslint-parser
 
-## [Svelte](https://svelte.dev/) parser for [ESLint](https://eslint.org/).
+## [Svelte](https://svelte.dev/) parser for [ESLint](https://eslint.org/)
 
 [Live DEMO](https://sveltejs.github.io/svelte-eslint-parser/playground) •
 [Discord](https://svelte.dev/chat)
@@ -100,7 +100,7 @@ export default [
       parser: svelteParser,
       parserOptions: {
         sourceType: "module",
-        ecmaVersion: 2021,
+        ecmaVersion: 2024,
         ecmaFeatures: {
           globalReturn: false,
           impliedStrict: false,

explorer-v2/src/lib/ESLintPlayground.svelte

@@ -119,7 +119,7 @@
 					languageOptions: {
 						parser: svelteEslintParser,
 						parserOptions: {
-							ecmaVersion: 2020,
+							ecmaVersion: 2024,
 							sourceType: 'module',
 							parser: { ts: tsParser, typescript: tsParser }
 						},

package.json

@@ -105,7 +105,7 @@
     "prettier-plugin-svelte": "^3.3.3",
     "rimraf": "^6.0.1",
     "semver": "^7.7.1",
-    "svelte": "^5.30.1",
+    "svelte": "^5.36.2",
     "svelte2tsx": "^0.7.35",
     "tsx": "^4.19.3",
     "typescript": "~5.8.2",

src/parser/compat.ts

@@ -4,6 +4,7 @@ import type * as SvAST from "./svelte-ast-types.js";
 import type * as Compiler from "./svelte-ast-types-for-v5.js";
 
 export type Child =
+  | Compiler.AttachTag
   | Compiler.Text
   | Compiler.Tag
   | Compiler.ElementLike

src/parser/parser-options.ts

@@ -41,7 +41,7 @@ export type NormalizedParserOptions = {
 /** Normalize parserOptions */
 export function normalizeParserOptions(options: any): NormalizedParserOptions {
   const parserOptions = {
-    ecmaVersion: 2020,
+    ecmaVersion: 2024,
     sourceType: "module",
     loc: true,
     range: true,

src/parser/typescript/analyze/index.ts

@@ -399,7 +399,7 @@ function analyzeRuneVariables(
       continue;
     }
     switch (globalName) {
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L2679
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3093
       case "$state": {
         appendDeclareFunctionVirtualScripts(globalName, [
           "<T>(initial: T): T",
@@ -415,7 +415,7 @@ function analyzeRuneVariables(
 
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L2833
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3247
       case "$derived": {
         appendDeclareFunctionVirtualScripts(globalName, [
           "<T>(expression: T): T",
@@ -425,35 +425,36 @@ function analyzeRuneVariables(
         ]);
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L2893
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3307
       case "$effect": {
         appendDeclareFunctionVirtualScripts(globalName, [
           "(fn: () => void | (() => void)): void",
         ]);
         appendDeclareNamespaceVirtualScripts(globalName, [
           "export function pre(fn: () => void | (() => void)): void;",
+          "export function pending(): number;",
           "export function tracking(): boolean;",
           "export function root(fn: () => void | (() => void)): () => void;",
         ]);
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L2997
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3416
       case "$props": {
-        // Use type parameters to avoid `@typescript-eslint/no-unsafe-assignment` errors.
+        // NOTE: In the Svelte repository's `index.d.ts`, the return type is any, but that triggers `@typescript-eslint/no-unsafe-assignment`. To avoid this, use generics here.
         appendDeclareFunctionVirtualScripts(globalName, ["<T>(): T"]);
         appendDeclareNamespaceVirtualScripts(globalName, [
           "export function id(): string;",
         ]);
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L3038
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3459
       case "$bindable": {
         appendDeclareFunctionVirtualScripts(globalName, [
           "<T>(fallback?: T): T",
         ]);
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L3081
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3502
       case "$inspect": {
         appendDeclareFunctionVirtualScripts(globalName, [
           `<T extends any[]>(...values: T): { with: (fn: (type: 'init' | 'update', ...values: T) => void) => void }`,
@@ -463,7 +464,7 @@ function analyzeRuneVariables(
         ]);
         break;
       }
-      // See https://github.com/sveltejs/svelte/blob/3c4a8d425b8192dc11ea2af256d531c51c37ba5d/packages/svelte/types/index.d.ts#L3144
+      // See https://github.com/sveltejs/svelte/blob/3fa3dd78a1cbaa88a1571977b76bf6f02ed4231d/packages/svelte/types/index.d.ts#L3565
       case "$host": {
         appendDeclareFunctionVirtualScripts(globalName, [
           `<El extends HTMLElement = HTMLElement>(): El`,

tests/fixtures/parser/ast/issue338-eslint-plugin-svelte-output.json

@@ -940,7 +940,7 @@
       }
     },
     {
-      "type": "Keyword",
+      "type": "Null",
       "value": "null",
       "range": [
         46,
@@ -976,7 +976,7 @@
       }
     },
     {
-      "type": "Keyword",
+      "type": "Null",
       "value": "null",
       "range": [
         53,
@@ -1516,7 +1516,7 @@
       }
     },
     {
-      "type": "Keyword",
+      "type": "Null",
       "value": "null",
       "range": [
         136,

tests/fixtures/parser/ast/svelte5/async/_config.json

@@ -0,0 +1,9 @@
+{
+  "svelteConfig": {
+    "compilerOptions": {
+      "experimental": {
+        "async": true
+      }
+    }
+  }
+}

tests/fixtures/parser/ast/svelte5/async/boundaries-input.svelte

@@ -0,0 +1,11 @@
+<script>
+	import MyApp from './MyApp.svelte';
+</script>
+
+<svelte:boundary>
+	<MyApp />
+
+	{#snippet pending()}
+		<p>loading...</p>
+	{/snippet}
+</svelte:boundary>