Merge branch 'master' of https://github.com/sveltejs/language-tools i…

…nto volar-ts-plugin-compatibility

.github/workflows/CI.yml

@@ -10,7 +10,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           cache: pnpm
 
       # Get projects set up
@@ -31,7 +31,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           cache: pnpm
 
       # Get projects set up

.github/workflows/DeployExtensionsProd.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           registry-url: "https://registry.npmjs.org"
           cache: pnpm
 

.github/workflows/DeploySvelte2tsxProd.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           registry-url: "https://registry.npmjs.org"
           cache: pnpm
 

.github/workflows/DeploySvelteCheckProd.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           registry-url: "https://registry.npmjs.org"
           cache: pnpm
 

.github/workflows/DeploySvelteLanguageServerProd.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           registry-url: "https://registry.npmjs.org"
           cache: pnpm
 

.github/workflows/DeployTypescriptPluginProd.yaml

@@ -14,7 +14,7 @@ jobs:
       - uses: pnpm/action-setup@v2.2.4
       - uses: actions/setup-node@v3
         with:
-          node-version: "16.x"
+          node-version: "18.x"
           registry-url: "https://registry.npmjs.org"
           cache: pnpm
 

package.json

@@ -13,7 +13,7 @@
         "lint": "prettier --check ."
     },
     "dependencies": {
-        "typescript": "^5.3.2"
+        "typescript": "^5.4.5"
     },
     "devDependencies": {
         "cross-env": "^7.0.2",

packages/language-server/package.json

@@ -57,7 +57,7 @@
         "svelte": "^3.57.0",
         "svelte-preprocess": "^5.1.3",
         "svelte2tsx": "workspace:~",
-        "typescript": "~5.3.2",
+        "typescript": "^5.3.2",
         "typescript-auto-import-cache": "^0.3.2",
         "vscode-css-languageservice": "~6.2.10",
         "vscode-html-languageservice": "~5.1.1",

packages/language-server/src/importPackage.ts

@@ -58,7 +58,19 @@ export function importSvelte(fromPath: string): typeof svelte {
     const pkg = getPackageInfo('svelte', fromPath);
     const main = resolve(pkg.path, 'compiler');
     Logger.debug('Using Svelte v' + pkg.version.full, 'from', main);
-    return dynamicRequire(main + (pkg.version.major >= 4 ? '.cjs' : ''));
+    if (pkg.version.major === 4) {
+        return dynamicRequire(main + '.cjs');
+    } else if (pkg.version.major === 5) {
+        // TODO remove once Svelte 5 is released
+        // (we switched from compiler.cjs to compiler/index.js at some point)
+        try {
+            return dynamicRequire(main);
+        } catch (e) {
+            return dynamicRequire(main + '.cjs');
+        }
+    } else {
+        return dynamicRequire(main);
+    }
 }
 
 export function importSveltePreprocess(fromPath: string): typeof sveltePreprocess {

packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts

@@ -543,11 +543,17 @@ function expectedTransitionThirdArgument(
         return false;
     }
 
-    const callExpression = findNodeAtSpan(
-        node,
-        { start: node.getStart(), length: node.getWidth() },
-        ts.isCallExpression
-    );
+    // in TypeScript 5.4 the error is on the function name
+    // in earlier versions it's on the whole call expression
+    const callExpression =
+        ts.isIdentifier(node) && ts.isCallExpression(node.parent)
+            ? node.parent
+            : findNodeAtSpan(
+                  node,
+                  { start: node.getStart(), length: node.getWidth() },
+                  ts.isCallExpression
+              );
+
     const signature =
         callExpression && lang.getProgram()?.getTypeChecker().getResolvedSignature(callExpression);
 

packages/language-server/src/plugins/typescript/module-loader.ts

@@ -64,8 +64,11 @@ class ModuleResolutionCache {
         const fileNameWithoutEnding =
             getLastPartOfPath(this.getCanonicalFileName(path)).split('.').shift() || '';
         this.cache.forEach((val, key) => {
+            if (val) {
+                return;
+            }
             const [containingFile, moduleName = ''] = key.split(CACHE_KEY_SEPARATOR);
-            if (!val && moduleName.includes(fileNameWithoutEnding)) {
+            if (moduleName.includes(fileNameWithoutEnding)) {
                 this.cache.delete(key);
                 this.pendingInvalidations.add(containingFile);
             }
@@ -88,6 +91,8 @@ class ModuleResolutionCache {
 class ImpliedNodeFormatResolver {
     private alreadyResolved = new FileMap<ReturnType<typeof ts.getModeForResolutionAtIndex>>();
 
+    constructor(private readonly tsSystem: ts.System) {}
+
     resolve(
         importPath: string,
         importIdxInFile: number,
@@ -102,7 +107,7 @@ class ImpliedNodeFormatResolver {
         let mode = undefined;
         if (sourceFile) {
             this.cacheImpliedNodeFormat(sourceFile, compilerOptions);
-            mode = ts.getModeForResolutionAtIndex(sourceFile, importIdxInFile);
+            mode = ts.getModeForResolutionAtIndex(sourceFile, importIdxInFile, compilerOptions);
         }
         return mode;
     }
@@ -116,7 +121,7 @@ class ImpliedNodeFormatResolver {
                 sourceFile.impliedNodeFormat = ts.getImpliedNodeFormatForFile(
                     toVirtualSvelteFilePath(sourceFile.fileName) as any,
                     undefined,
-                    ts.sys,
+                    this.tsSystem,
                     compilerOptions
                 );
                 this.alreadyResolved.set(sourceFile.fileName, sourceFile.impliedNodeFormat);
@@ -182,7 +187,7 @@ export function createSvelteModuleLoader(
         ts.ResolvedTypeReferenceDirectiveWithFailedLookupLocations
     >();
 
-    const impliedNodeFormatResolver = new ImpliedNodeFormatResolver();
+    const impliedNodeFormatResolver = new ImpliedNodeFormatResolver(tsSystem);
     const failedPathToContainingFile = new FileMap<FileSet>();
     const failedLocationInvalidated = new FileSet();
 
@@ -262,7 +267,7 @@ export function createSvelteModuleLoader(
             name,
             containingFile,
             compilerOptions,
-            ts.sys,
+            tsSystem,
             tsModuleCache,
             undefined,
             mode

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/bind-union/Component.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+    export let value: 'foo' | 'bar';
+</script>
+
+<button on:click={() => value = 'foo'}>foo</button>

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/bind-union/expectedv2.json

@@ -0,0 +1 @@
+[]

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/bind-union/input.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+    import Component from './Component.svelte';
+
+    let checked = false;
+    let value: 'foo' | 'bar' = 'foo';
+</script>
+
+<input type="checkbox" bind:checked>
+
+{#if checked === true}
+    checked
+{/if}
+
+{#if value === 'bar'}
+    bar
+{/if}
+
+<Component bind:value></Component>

packages/language-server/test/plugins/typescript/features/diagnostics/fixtures/style-directive/expectedv2.json

@@ -6,7 +6,7 @@
         },
         "severity": 1,
         "source": "ts",
-        "message": "Argument of type 'boolean' is not assignable to parameter of type 'String | Number | null | undefined'.",
+        "message": "Argument of type 'true' is not assignable to parameter of type 'String | Number | null | undefined'.",
         "code": 2345,
         "tags": []
     },
@@ -17,7 +17,7 @@
         },
         "severity": 1,
         "source": "ts",
-        "message": "Argument of type 'boolean' is not assignable to parameter of type 'String | Number | null | undefined'.",
+        "message": "Argument of type 'true' is not assignable to parameter of type 'String | Number | null | undefined'.",
         "code": 2345,
         "tags": []
     }

packages/language-server/test/plugins/typescript/features/inlayHints/fixtures/component-handler/expectedv2.json

@@ -12,8 +12,8 @@
                 "value": "MouseEvent",
                 "location": {
                     "range": {
-                        "start": { "line": 15586, "character": 10 },
-                        "end": { "line": 15586, "character": 20 }
+                        "start": { "line": 15692, "character": 10 },
+                        "end": { "line": 15692, "character": 20 }
                     },
                     "uri": "<node_modules>/typescript/lib/lib.dom.d.ts"
                 }

packages/language-server/test/plugins/typescript/features/inlayHints/fixtures/element-handler/expectedv2.json

@@ -6,8 +6,8 @@
                 "value": "MouseEvent",
                 "location": {
                     "range": {
-                        "start": { "line": 15586, "character": 10 },
-                        "end": { "line": 15586, "character": 20 }
+                        "start": { "line": 15692, "character": 10 },
+                        "end": { "line": 15692, "character": 20 }
                     },
                     "uri": "<node_modules>/typescript/lib/lib.dom.d.ts"
                 }
@@ -21,8 +21,8 @@
                 "value": "EventTarget",
                 "location": {
                     "range": {
-                        "start": { "line": 8192, "character": 10 },
-                        "end": { "line": 8192, "character": 21 }
+                        "start": { "line": 8237, "character": 10 },
+                        "end": { "line": 8237, "character": 21 }
                     },
                     "uri": "<node_modules>/typescript/lib/lib.dom.d.ts"
                 }
@@ -32,8 +32,8 @@
                 "value": "HTMLButtonElement",
                 "location": {
                     "range": {
-                        "start": { "line": 9684, "character": 10 },
-                        "end": { "line": 9684, "character": 27 }
+                        "start": { "line": 9732, "character": 10 },
+                        "end": { "line": 9732, "character": 27 }
                     },
                     "uri": "<node_modules>/typescript/lib/lib.dom.d.ts"
                 }

packages/svelte-vscode/package.json

@@ -719,7 +719,7 @@
         "@types/vscode": "^1.67",
         "js-yaml": "^3.14.0",
         "tslib": "^2.4.0",
-        "typescript": "~5.3.2",
+        "typescript": "^5.4.5",
         "vscode-tmgrammar-test": "^0.0.11"
     },
     "dependencies": {

packages/svelte2tsx/package.json

@@ -40,7 +40,7 @@
         "svelte": "~3.57.0",
         "tiny-glob": "^0.2.6",
         "tslib": "^2.4.0",
-        "typescript": "^5.3.2"
+        "typescript": "^5.4.5"
     },
     "peerDependencies": {
         "svelte": "^3.55 || ^4.0.0-next.0 || ^4.0 || ^5.0.0-next.0",

packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Binding.ts

@@ -59,9 +59,13 @@ export function handleBinding(
 ): void {
     // bind group on input
     if (element instanceof Element && attr.name == 'group' && parent.name == 'input') {
+        // add reassignment to force TS to widen the type of the declaration (in case it's never reassigned anywhere else)
+        const expressionStr = str.original.substring(
+            attr.expression.start,
+            getEnd(attr.expression)
+        );
         element.appendToStartEnd([
-            rangeWithTrailingPropertyAccess(str.original, attr.expression),
-            ';'
+            surroundWithIgnoreComments(`() => ${expressionStr} = __sveltets_2_any(null);`)
         ]);
         return;
     }
@@ -94,6 +98,12 @@ export function handleBinding(
         return;
     }
 
+    // add reassignment to force TS to widen the type of the declaration (in case it's never reassigned anywhere else)
+    const expressionStr = str.original.substring(attr.expression.start, getEnd(attr.expression));
+    element.appendToStartEnd([
+        surroundWithIgnoreComments(`() => ${expressionStr} = __sveltets_2_any(null);`)
+    ]);
+
     // other bindings which are transformed to normal attributes/props
     const isShorthand = attr.expression.start === attr.start + 'bind:'.length;
     const name: TransformationArray =

packages/svelte2tsx/svelte-shims-v4.d.ts

@@ -146,9 +146,10 @@ declare function __sveltets_2_nonNullable<T>(type: T): NonNullable<T>;
 declare function __sveltets_2_cssProp(prop: Record<string, any>): {};
 
 // @ts-ignore Svelte v3/v4 don't have this
-declare function __sveltets_2_ensureSnippet(val: ReturnType<import('svelte').Snippet>): any;
+declare function __sveltets_2_ensureSnippet(val: ReturnType<import('svelte').Snippet> | undefined | null): any;
 // @ts-ignore Svelte v3/v4 don't have this
 declare function __sveltets_2_snippet(): import('svelte').Snippet;
+// @ts-ignore Svelte v3/v4 don't have this
 declare function __sveltets_2_snippet<T>(t: T): import('svelte').Snippet<[T]>;
 
 /** @internal PRIVATE API, DO NOT USE */