@astrojs/language-server 0.16.1 → 0.17.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @astrojs/language-server
 
+## 0.17.0
+
+### Minor Changes
+
+- 3ad0f65: Add support for TypeScript features inside script tags (completions, diagnostics, hover etc)
+
+### Patch Changes
+
+- 2e9da14: Add support for loading props completions from .d.ts files, improve performance of props completions
+
 ## 0.16.1
 
 ### Patch Changes

package/dist/core/documents/AstroDocument.d.ts

@@ -9,6 +9,7 @@ export declare class AstroDocument extends WritableDocument {
     astroMeta: AstroMetadata;
     html: HTMLDocument;
     styleTags: TagInformation[];
+    scriptTags: TagInformation[];
     constructor(url: string, content: string);
     private updateDocInfo;
     setText(text: string): void;

package/dist/core/documents/AstroDocument.js

@@ -18,6 +18,7 @@ class AstroDocument extends DocumentBase_1.WritableDocument {
         this.astroMeta = (0, parseAstro_1.parseAstro)(this.content);
         this.html = (0, parseHtml_1.parseHtml)(this.content);
         this.styleTags = (0, utils_2.extractStyleTags)(this.content, this.html);
+        this.scriptTags = (0, utils_2.extractScriptTags)(this.content, this.html);
     }
     setText(text) {
         this.content = text;

package/dist/core/documents/DocumentMapper.d.ts

@@ -46,6 +46,8 @@ export declare class FragmentMapper implements DocumentMapper {
     private originalText;
     private tagInfo;
     private url;
+    private lineOffsetsOriginal;
+    private lineOffsetsGenerated;
     constructor(originalText: string, tagInfo: TagInformation, url: string);
     getOriginalPosition(generatedPosition: Position): Position;
     private offsetInParent;

package/dist/core/documents/DocumentMapper.js

@@ -45,20 +45,22 @@ class FragmentMapper {
         this.originalText = originalText;
         this.tagInfo = tagInfo;
         this.url = url;
+        this.lineOffsetsOriginal = (0, utils_1.getLineOffsets)(this.originalText);
+        this.lineOffsetsGenerated = (0, utils_1.getLineOffsets)(this.tagInfo.content);
     }
     getOriginalPosition(generatedPosition) {
-        const parentOffset = this.offsetInParent((0, utils_1.offsetAt)(generatedPosition, this.tagInfo.content));
-        return (0, utils_1.positionAt)(parentOffset, this.originalText);
+        const parentOffset = this.offsetInParent((0, utils_1.offsetAt)(generatedPosition, this.tagInfo.content, this.lineOffsetsGenerated));
+        return (0, utils_1.positionAt)(parentOffset, this.originalText, this.lineOffsetsOriginal);
     }
     offsetInParent(offset) {
         return this.tagInfo.start + offset;
     }
     getGeneratedPosition(originalPosition) {
-        const fragmentOffset = (0, utils_1.offsetAt)(originalPosition, this.originalText) - this.tagInfo.start;
-        return (0, utils_1.positionAt)(fragmentOffset, this.tagInfo.content);
+        const fragmentOffset = (0, utils_1.offsetAt)(originalPosition, this.originalText, this.lineOffsetsOriginal) - this.tagInfo.start;
+        return (0, utils_1.positionAt)(fragmentOffset, this.tagInfo.content, this.lineOffsetsGenerated);
     }
     isInGenerated(pos) {
-        const offset = (0, utils_1.offsetAt)(pos, this.originalText);
+        const offset = (0, utils_1.offsetAt)(pos, this.originalText, this.lineOffsetsOriginal);
         return offset >= this.tagInfo.start && offset <= this.tagInfo.end;
     }
     getURL() {

package/dist/core/documents/utils.d.ts

@@ -15,6 +15,7 @@ export interface TagInformation {
 }
 export declare function walk(node: Node): Generator<Node, void, unknown>;
 export declare function extractStyleTags(source: string, html?: HTMLDocument): TagInformation[];
+export declare function extractScriptTags(source: string, html?: HTMLDocument): TagInformation[];
 export declare function getLineAtPosition(position: Position, text: string): string;
 /**
  * Returns the node if offset is inside a HTML start tag

package/dist/core/documents/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getFirstNonWhitespaceIndex = exports.getLineOffsets = exports.offsetAt = exports.positionAt = exports.isInsideFrontmatter = exports.isInsideExpression = exports.isInTag = exports.isInComponentStartTag = exports.isComponentTag = exports.getNodeIfIsInHTMLStartTag = exports.getLineAtPosition = exports.extractStyleTags = exports.walk = void 0;
+exports.getFirstNonWhitespaceIndex = exports.getLineOffsets = exports.offsetAt = exports.positionAt = exports.isInsideFrontmatter = exports.isInsideExpression = exports.isInTag = exports.isInComponentStartTag = exports.isComponentTag = exports.getNodeIfIsInHTMLStartTag = exports.getLineAtPosition = exports.extractScriptTags = exports.extractStyleTags = exports.walk = void 0;
 const vscode_languageserver_1 = require("vscode-languageserver");
 const utils_1 = require("../../utils");
 const parseHtml_1 = require("./parseHtml");
@@ -28,6 +28,13 @@ function extractTags(text, tag, html) {
             }
         }
     }
+    if (tag === 'script' && !matchedNodes.length && rootNodes.length) {
+        for (let child of walk(rootNodes[0])) {
+            if (child.tag === 'script') {
+                matchedNodes.push(child);
+            }
+        }
+    }
     return matchedNodes.map(transformToTagInfo);
     function transformToTagInfo(matchedNode) {
         const start = matchedNode.startTagEnd ?? matchedNode.start;
@@ -60,6 +67,14 @@ function extractStyleTags(source, html) {
     return styles;
 }
 exports.extractStyleTags = extractStyleTags;
+function extractScriptTags(source, html) {
+    const scripts = extractTags(source, 'script', html);
+    if (!scripts.length) {
+        return [];
+    }
+    return scripts;
+}
+exports.extractScriptTags = extractScriptTags;
 function parseAttributes(rawAttrs) {
     const attrs = {};
     if (!rawAttrs) {

package/dist/plugins/astro/AstroPlugin.js

@@ -9,7 +9,7 @@ class AstroPlugin {
         this.__name = 'astro';
         this.configManager = configManager;
         this.languageServiceManager = new LanguageServiceManager_1.LanguageServiceManager(docManager, workspaceUris, configManager);
-        this.completionProvider = new CompletionsProvider_1.CompletionsProviderImpl(docManager, this.languageServiceManager);
+        this.completionProvider = new CompletionsProvider_1.CompletionsProviderImpl(this.languageServiceManager);
     }
     async getCompletions(document, position, completionContext) {
         const completions = this.completionProvider.getCompletions(document, position, completionContext);

package/dist/plugins/astro/features/CompletionsProvider.d.ts

@@ -1,17 +1,16 @@
 import type { AppCompletionList, CompletionsProvider } from '../../interfaces';
-import type { AstroDocument, DocumentManager } from '../../../core/documents';
+import type { AstroDocument } from '../../../core/documents';
 import { CompletionContext, Position } from 'vscode-languageserver';
 import { LanguageServiceManager as TypeScriptLanguageServiceManager } from '../../typescript/LanguageServiceManager';
 export declare class CompletionsProviderImpl implements CompletionsProvider {
-    private readonly docManager;
     private readonly languageServiceManager;
+    private lastCompletion;
     directivesHTMLLang: import("vscode-html-languageservice").LanguageService;
-    constructor(docManager: DocumentManager, languageServiceManager: TypeScriptLanguageServiceManager);
+    constructor(languageServiceManager: TypeScriptLanguageServiceManager);
     getCompletions(document: AstroDocument, position: Position, completionContext?: CompletionContext): Promise<AppCompletionList | null>;
     private getComponentScriptCompletion;
-    private getPropCompletions;
+    private getPropCompletionsAndFilePath;
     private getImportedSymbol;
     private getPropType;
     private getCompletionItemForProperty;
-    private isAstroComponent;
 }

package/dist/plugins/astro/features/CompletionsProvider.js

@@ -13,21 +13,18 @@ const vscode_html_languageservice_1 = require("vscode-html-languageservice");
 const astro_attributes_1 = require("../../html/features/astro-attributes");
 const utils_4 = require("../../html/utils");
 class CompletionsProviderImpl {
-    constructor(docManager, languageServiceManager) {
+    constructor(languageServiceManager) {
+        this.lastCompletion = null;
         this.directivesHTMLLang = (0, vscode_html_languageservice_1.getLanguageService)({
             customDataProviders: [astro_attributes_1.astroDirectives],
             useDefaultDataProvider: false,
         });
-        this.docManager = docManager;
         this.languageServiceManager = languageServiceManager;
     }
     async getCompletions(document, position, completionContext) {
-        const doc = this.docManager.get(document.uri);
-        if (!doc)
-            return null;
         let items = [];
         if (completionContext?.triggerCharacter === '-') {
-            const frontmatter = this.getComponentScriptCompletion(doc, position, completionContext);
+            const frontmatter = this.getComponentScriptCompletion(document, position);
             if (frontmatter)
                 items.push(frontmatter);
         }
@@ -35,11 +32,11 @@ class CompletionsProviderImpl {
         const offset = document.offsetAt(position);
         const node = html.findNodeAt(offset);
         if ((0, utils_1.isInComponentStartTag)(html, offset) && !(0, utils_1.isInsideExpression)(document.getText(), node.start, offset)) {
-            const props = await this.getPropCompletions(document, position, completionContext);
+            const { completions: props, componentFilePath } = await this.getPropCompletionsAndFilePath(document, position, completionContext);
             if (props.length) {
                 items.push(...props);
             }
-            const isAstro = await this.isAstroComponent(document, node);
+            const isAstro = componentFilePath?.endsWith('.astro');
             if (!isAstro) {
                 const directives = (0, utils_4.removeDataAttrCompletion)(this.directivesHTMLLang.doComplete(document, position, html).items);
                 items.push(...directives);
@@ -47,7 +44,7 @@ class CompletionsProviderImpl {
         }
         return vscode_languageserver_1.CompletionList.create(items, true);
     }
-    getComponentScriptCompletion(document, position, completionContext) {
+    getComponentScriptCompletion(document, position) {
         const base = {
             kind: vscode_languageserver_1.CompletionItemKind.Snippet,
             label: '---',
@@ -55,7 +52,7 @@ class CompletionsProviderImpl {
             preselect: true,
             detail: 'Component script',
             insertTextFormat: vscode_languageserver_1.InsertTextFormat.Snippet,
-            commitCharacters: ['-'],
+            commitCharacters: [],
         };
         const prefix = document.getLineUntilOffset(document.offsetAt(position));
         if (document.astroMeta.frontmatter.state === null) {
@@ -78,25 +75,25 @@ class CompletionsProviderImpl {
         }
         return null;
     }
-    async getPropCompletions(document, position, completionContext) {
+    async getPropCompletionsAndFilePath(document, position, completionContext) {
         const offset = document.offsetAt(position);
         const html = document.html;
         const node = html.findNodeAt(offset);
         if (!(0, utils_2.isPossibleComponent)(node)) {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         const inAttribute = node.start + node.tag.length < offset;
         if (!inAttribute) {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         if (completionContext?.triggerCharacter === '/' || completionContext?.triggerCharacter === '>') {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         // If inside of attribute value, skip.
         if (completionContext &&
             completionContext.triggerKind === vscode_languageserver_1.CompletionTriggerKind.TriggerCharacter &&
             completionContext.triggerCharacter === '"') {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         const componentName = node.tag;
         const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
@@ -106,18 +103,34 @@ class CompletionsProviderImpl {
         const sourceFile = program?.getSourceFile(tsFilePath);
         const typeChecker = program?.getTypeChecker();
         if (!sourceFile || !typeChecker) {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         // Get the import statement
         const imp = this.getImportedSymbol(sourceFile, componentName);
         const importType = imp && typeChecker.getTypeAtLocation(imp);
         if (!importType) {
-            return [];
+            return { completions: [], componentFilePath: null };
+        }
+        const symbol = importType.getSymbol();
+        if (!symbol) {
+            return { completions: [], componentFilePath: null };
+        }
+        const symbolDeclaration = symbol.declarations;
+        if (!symbolDeclaration) {
+            return { completions: [], componentFilePath: null };
+        }
+        const filePath = symbolDeclaration[0].getSourceFile().fileName;
+        const componentSnapshot = await this.languageServiceManager.getSnapshot(filePath);
+        if (this.lastCompletion) {
+            if (this.lastCompletion.tag === componentName &&
+                this.lastCompletion.documentVersion == componentSnapshot.version) {
+                return { completions: this.lastCompletion.completions, componentFilePath: filePath };
+            }
         }
         // Get the component's props type
-        const componentType = this.getPropType(importType, typeChecker);
+        const componentType = this.getPropType(symbolDeclaration, typeChecker);
         if (!componentType) {
-            return [];
+            return { completions: [], componentFilePath: null };
         }
         let completionItems = [];
         // Add completions for this component's props type properties
@@ -131,7 +144,12 @@ class CompletionsProviderImpl {
         completionItems = completionItems.map((item) => {
             return { ...item, sortText: '_' };
         });
-        return completionItems;
+        this.lastCompletion = {
+            tag: componentName,
+            documentVersion: componentSnapshot.version,
+            completions: completionItems,
+        };
+        return { completions: completionItems, componentFilePath: filePath };
     }
     getImportedSymbol(sourceFile, identifier) {
         for (let list of sourceFile.getChildren()) {
@@ -159,24 +177,20 @@ class CompletionsProviderImpl {
         }
         return null;
     }
-    getPropType(type, typeChecker) {
-        const sym = type?.getSymbol();
-        if (!sym) {
-            return null;
-        }
-        for (const decl of sym?.getDeclarations() || []) {
+    getPropType(declarations, typeChecker) {
+        for (const decl of declarations) {
             const fileName = (0, utils_3.toVirtualFilePath)(decl.getSourceFile().fileName);
-            if (fileName.endsWith('.tsx') || fileName.endsWith('.jsx')) {
-                if (!typescript_1.default.isFunctionDeclaration(decl)) {
-                    console.error(`We only support function components for tsx/jsx at the moment.`);
+            if (fileName.endsWith('.tsx') || fileName.endsWith('.jsx') || fileName.endsWith('.d.ts')) {
+                if (!typescript_1.default.isFunctionDeclaration(decl) && !typescript_1.default.isFunctionTypeNode(decl)) {
+                    console.error(`We only support functions declarations at the moment`);
                     continue;
                 }
                 const fn = decl;
                 if (!fn.parameters.length)
                     continue;
                 const param1 = fn.parameters[0];
-                const type = typeChecker.getTypeAtLocation(param1);
-                return type;
+                const propType = typeChecker.getTypeAtLocation(param1);
+                return propType;
             }
         }
         return null;
@@ -216,28 +230,5 @@ class CompletionsProviderImpl {
         }
         return item;
     }
-    async isAstroComponent(document, node) {
-        const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
-        // Get the source file
-        const tsFilePath = (0, utils_3.toVirtualAstroFilePath)(tsDoc.filePath);
-        const program = lang.getProgram();
-        const sourceFile = program?.getSourceFile(tsFilePath);
-        const typeChecker = program?.getTypeChecker();
-        if (!sourceFile || !typeChecker) {
-            return false;
-        }
-        const componentName = node.tag;
-        const imp = this.getImportedSymbol(sourceFile, componentName);
-        const importType = imp && typeChecker.getTypeAtLocation(imp);
-        if (!importType) {
-            return false;
-        }
-        const symbolDeclaration = importType.getSymbol()?.declarations;
-        if (symbolDeclaration) {
-            const fileName = symbolDeclaration[0].getSourceFile().fileName;
-            return fileName.endsWith('.astro');
-        }
-        return false;
-    }
 }
 exports.CompletionsProviderImpl = CompletionsProviderImpl;

package/dist/plugins/typescript/features/CodeActionsProvider.js

@@ -23,8 +23,6 @@ class CodeActionsProviderImpl {
         const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
         const filePath = (0, utils_2.toVirtualAstroFilePath)(tsDoc.filePath);
         const fragment = await tsDoc.createFragment();
-        const start = fragment.offsetAt(fragment.getGeneratedPosition(range.start));
-        const end = fragment.offsetAt(fragment.getGeneratedPosition(range.end));
         const tsPreferences = await this.configManager.getTSPreferences(document);
         const formatOptions = await this.configManager.getTSFormatConfig(document);
         let result = [];
@@ -50,24 +48,57 @@ class CodeActionsProviderImpl {
                 .map((diag) => Number(diag.code))
                 // We currently cannot support quick fix for unreachable code properly due to the way our TSX output is structured
                 .filter((code) => code !== 7027);
-            let codeFixes = errorCodes.includes(2304)
-                ? this.getComponentQuickFix(start, end, lang, filePath, formatOptions, tsPreferences)
-                : undefined;
-            codeFixes =
-                codeFixes ?? lang.getCodeFixesAtPosition(filePath, start, end, errorCodes, formatOptions, tsPreferences);
-            const codeActions = codeFixes.map((fix) => codeFixToCodeAction(fix, context.diagnostics, context.only ? vscode_languageserver_types_1.CodeActionKind.QuickFix : vscode_languageserver_types_1.CodeActionKind.Empty));
+            const html = document.html;
+            const node = html.findNodeAt(document.offsetAt(range.start));
+            let codeFixes;
+            let isInsideScript = false;
+            if (node.tag === 'script') {
+                const { snapshot: scriptTagSnapshot, filePath: scriptFilePath } = (0, utils_2.getScriptTagSnapshot)(tsDoc, document, node);
+                const start = scriptTagSnapshot.offsetAt(scriptTagSnapshot.getGeneratedPosition(range.start));
+                const end = scriptTagSnapshot.offsetAt(scriptTagSnapshot.getGeneratedPosition(range.end));
+                codeFixes = lang.getCodeFixesAtPosition(scriptFilePath, start, end, errorCodes, formatOptions, tsPreferences);
+                codeFixes = codeFixes.map((fix) => ({
+                    ...fix,
+                    changes: mapScriptTagFixToOriginal(fix.changes, scriptTagSnapshot),
+                }));
+                isInsideScript = true;
+            }
+            else {
+                const start = fragment.offsetAt(fragment.getGeneratedPosition(range.start));
+                const end = fragment.offsetAt(fragment.getGeneratedPosition(range.end));
+                codeFixes = errorCodes.includes(2304)
+                    ? this.getComponentQuickFix(start, end, lang, filePath, formatOptions, tsPreferences)
+                    : undefined;
+                codeFixes =
+                    codeFixes ?? lang.getCodeFixesAtPosition(filePath, start, end, errorCodes, formatOptions, tsPreferences);
+            }
+            const codeActions = codeFixes.map((fix) => codeFixToCodeAction(fix, context.diagnostics, context.only ? vscode_languageserver_types_1.CodeActionKind.QuickFix : vscode_languageserver_types_1.CodeActionKind.Empty, isInsideScript));
             result.push(...codeActions);
         }
         return result;
-        function codeFixToCodeAction(codeFix, diagnostics, kind) {
+        function codeFixToCodeAction(codeFix, diagnostics, kind, isInsideScript) {
             const documentChanges = codeFix.changes.map((change) => {
                 return vscode_languageserver_types_1.TextDocumentEdit.create(vscode_languageserver_types_1.OptionalVersionedTextDocumentIdentifier.create(document.getURL(), null), change.textChanges.map((edit) => {
                     let originalRange = (0, documents_1.mapRangeToOriginal)(fragment, (0, utils_2.convertRange)(fragment, edit.span));
-                    if (codeFix.fixName === 'import') {
-                        return (0, CompletionsProvider_1.codeActionChangeToTextEdit)(document, fragment, edit);
+                    // Inside scripts, we don't need to restrain the insertion of code inside a specific zone as it will be
+                    // restricted to the area of the script tag by default
+                    if (!isInsideScript) {
+                        if (codeFix.fixName === 'import') {
+                            return (0, CompletionsProvider_1.codeActionChangeToTextEdit)(document, fragment, false, edit);
+                        }
+                        if (codeFix.fixName === 'fixMissingFunctionDeclaration') {
+                            originalRange = (0, utils_2.checkEndOfFileCodeInsert)(originalRange, document);
+                        }
                     }
-                    if (codeFix.fixName === 'fixMissingFunctionDeclaration') {
-                        originalRange = (0, utils_2.checkEndOfFileCodeInsert)(originalRange, document);
+                    else {
+                        // Make sure new imports are not added on the file line of the script tag
+                        if (codeFix.fixName === 'import') {
+                            const existingLine = (0, documents_1.getLineAtPosition)(document.positionAt(edit.span.start), document.getText());
+                            const isNewImport = !existingLine.trim().startsWith('import');
+                            if (!(edit.newText.startsWith('\n') || edit.newText.startsWith('\r\n')) && isNewImport) {
+                                edit.newText = typescript_1.default.sys.newLine + edit.newText;
+                            }
+                        }
                     }
                     return vscode_languageserver_types_1.TextEdit.replace(originalRange, edit.newText);
                 }));
@@ -78,6 +109,15 @@ class CodeActionsProviderImpl {
             codeAction.diagnostics = diagnostics;
             return codeAction;
         }
+        function mapScriptTagFixToOriginal(changes, scriptTagSnapshot) {
+            return changes.map((change) => {
+                change.textChanges.map((edit) => {
+                    edit.span.start = fragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(edit.span.start)));
+                    return edit;
+                });
+                return change;
+            });
+        }
     }
     getComponentQuickFix(start, end, lang, filePath, formatOptions, tsPreferences) {
         const sourceFile = lang.getProgram()?.getSourceFile(filePath);
@@ -107,16 +147,35 @@ class CodeActionsProviderImpl {
         return (0, lodash_1.flatten)(completion.entries.filter((c) => c.name === name || c.name === suffixedName).map(toFix));
     }
     async organizeSortImports(document, skipDestructiveCodeActions = false, cancellationToken) {
-        if (document.astroMeta.frontmatter.state !== 'closed') {
-            return [];
-        }
         const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
         const filePath = (0, utils_2.toVirtualAstroFilePath)(tsDoc.filePath);
         const fragment = await tsDoc.createFragment();
         if (cancellationToken?.isCancellationRequested) {
             return [];
         }
-        const changes = lang.organizeImports({ fileName: filePath, type: 'file', skipDestructiveCodeActions }, {}, {});
+        let changes = [];
+        if (document.astroMeta.frontmatter.state === 'closed') {
+            changes.push(...lang.organizeImports({ fileName: filePath, type: 'file', skipDestructiveCodeActions }, {}, {}));
+        }
+        document.scriptTags.forEach((scriptTag) => {
+            const { filePath: scriptFilePath, snapshot: scriptTagSnapshot } = (0, utils_2.getScriptTagSnapshot)(tsDoc, document, scriptTag.container);
+            const edits = lang.organizeImports({ fileName: scriptFilePath, type: 'file', skipDestructiveCodeActions }, {}, {});
+            edits.forEach((edit) => {
+                edit.fileName = tsDoc.filePath;
+                edit.textChanges = edit.textChanges
+                    .map((change) => {
+                    change.span.start = fragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(change.span.start)));
+                    return change;
+                })
+                    // Since our last line is a (virtual) export, organize imports will try to rewrite it, so let's only take
+                    // changes that actually happens inside the script tag
+                    .filter((change) => {
+                    return scriptTagSnapshot.isInGenerated(document.positionAt(change.span.start));
+                });
+                return edit;
+            });
+            changes.push(...edits);
+        });
         const documentChanges = changes.map((change) => {
             return vscode_languageserver_types_1.TextDocumentEdit.create(vscode_languageserver_types_1.OptionalVersionedTextDocumentIdentifier.create(document.url, null), change.textChanges.map((edit) => {
                 const range = (0, documents_1.mapRangeToOriginal)(fragment, (0, utils_2.convertRange)(fragment, edit.span));

package/dist/plugins/typescript/features/CompletionsProvider.d.ts

@@ -8,6 +8,7 @@ import { ConfigManager } from '../../../core/config';
 export interface CompletionItemData extends TextDocumentIdentifier {
     filePath: string;
     offset: number;
+    scriptTagIndex: number | undefined;
     originalItem: ts.CompletionEntry;
 }
 export declare class CompletionsProviderImpl implements CompletionsProvider<CompletionItemData> {
@@ -32,4 +33,4 @@ export declare class CompletionsProviderImpl implements CompletionsProvider<Comp
     private getExistingImports;
     private isAstroComponentImport;
 }
-export declare function codeActionChangeToTextEdit(document: AstroDocument, fragment: AstroSnapshotFragment, change: ts.TextChange): TextEdit;
+export declare function codeActionChangeToTextEdit(document: AstroDocument, fragment: AstroSnapshotFragment, isInsideScriptTag: boolean, change: ts.TextChange): TextEdit;

package/dist/plugins/typescript/features/CompletionsProvider.js

@@ -65,37 +65,64 @@ class CompletionsProviderImpl {
         const html = document.html;
         const offset = document.offsetAt(position);
         const node = html.findNodeAt(offset);
-        // TODO: Add support for script tags
-        if (node.tag === 'script') {
-            return null;
-        }
+        const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
+        let filePath = (0, utils_2.toVirtualAstroFilePath)(tsDoc.filePath);
+        let completions;
         const isCompletionInsideFrontmatter = (0, utils_1.isInsideFrontmatter)(document.getText(), offset);
         const isCompletionInsideExpression = (0, utils_1.isInsideExpression)(document.getText(), node.start, offset);
-        // PERF: Getting TS completions is fairly slow and I am currently not sure how to speed it up
-        // As such, we'll try to avoid getting them when unneeded, such as when we're doing HTML stuff
-        // When at the root of the document TypeScript offer all kinds of completions, because it doesn't know yet that
-        // it's JSX and not JS. As such, people who are using Emmet to write their template suffer from a very degraded experience
-        // from what they're used to in HTML files (which is instant completions). So let's disable ourselves when we're at the root
-        if (!isCompletionInsideFrontmatter && !node.parent && !isCompletionInsideExpression) {
-            return null;
-        }
-        // If the user just typed `<` with nothing else, let's disable ourselves until we're more sure if the user wants TS completions
-        if (!isCompletionInsideFrontmatter && node.parent && node.tag === undefined && !isCompletionInsideExpression) {
-            return null;
-        }
-        // If the current node is not a component (aka, it doesn't start with a caps), let's disable ourselves as the user
-        // is most likely looking for HTML completions
-        if (!isCompletionInsideFrontmatter && !(0, utils_1.isComponentTag)(node) && !isCompletionInsideExpression) {
-            return null;
-        }
         const tsPreferences = await this.configManager.getTSPreferences(document);
         const formatOptions = await this.configManager.getTSFormatConfig(document);
-        const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
-        const filePath = (0, utils_2.toVirtualAstroFilePath)(tsDoc.filePath);
-        const completions = lang.getCompletionsAtPosition(filePath, offset, {
-            ...tsPreferences,
-            triggerCharacter: validTriggerCharacter,
-        }, formatOptions);
+        let scriptTagIndex = undefined;
+        if (node.tag === 'script') {
+            const { filePath: scriptFilePath, offset: scriptOffset, index: scriptIndex, } = (0, utils_2.getScriptTagSnapshot)(tsDoc, document, node, position);
+            filePath = scriptFilePath;
+            scriptTagIndex = scriptIndex;
+            completions = lang.getCompletionsAtPosition(scriptFilePath, scriptOffset, {
+                ...tsPreferences,
+                // File extensions are required inside script tags, however TypeScript can't return completions with the `ts`
+                // extension, so what we'll do instead is force `minimal` (aka, no extension) and manually add the extensions
+                importModuleSpecifierEnding: 'minimal',
+                triggerCharacter: validTriggerCharacter,
+            }, formatOptions);
+            if (completions) {
+                // Manually adds file extensions to js and ts files
+                completions.entries = completions?.entries.map((comp) => {
+                    if (comp.kind === typescript_1.ScriptElementKind.scriptElement &&
+                        (comp.kindModifiers === '.js' || comp.kindModifiers === '.ts')) {
+                        return {
+                            ...comp,
+                            name: comp.name + comp.kindModifiers,
+                        };
+                    }
+                    else {
+                        return comp;
+                    }
+                });
+            }
+        }
+        else {
+            // PERF: Getting TS completions is fairly slow and I am currently not sure how to speed it up
+            // As such, we'll try to avoid getting them when unneeded, such as when we're doing HTML stuff
+            // When at the root of the document TypeScript offer all kinds of completions, because it doesn't know yet that
+            // it's JSX and not JS. As such, people who are using Emmet to write their template suffer from a very degraded experience
+            // from what they're used to in HTML files (which is instant completions). So let's disable ourselves when we're at the root
+            if (!isCompletionInsideFrontmatter && !node.parent && !isCompletionInsideExpression) {
+                return null;
+            }
+            // If the user just typed `<` with nothing else, let's disable ourselves until we're more sure if the user wants TS completions
+            if (!isCompletionInsideFrontmatter && node.parent && node.tag === undefined && !isCompletionInsideExpression) {
+                return null;
+            }
+            // If the current node is not a component (aka, it doesn't start with a caps), let's disable ourselves as the user
+            // is most likely looking for HTML completions
+            if (!isCompletionInsideFrontmatter && !(0, utils_1.isComponentTag)(node) && !isCompletionInsideExpression) {
+                return null;
+            }
+            completions = lang.getCompletionsAtPosition(filePath, offset, {
+                ...tsPreferences,
+                triggerCharacter: validTriggerCharacter,
+            }, formatOptions);
+        }
         if (completions === undefined || completions.entries.length === 0) {
             return null;
         }
@@ -107,7 +134,7 @@ class CompletionsProviderImpl {
         const existingImports = this.getExistingImports(document);
         const completionItems = completions.entries
             .filter(this.isValidCompletion)
-            .map((entry) => this.toCompletionItem(fragment, entry, filePath, offset, isCompletionInsideFrontmatter, existingImports))
+            .map((entry) => this.toCompletionItem(fragment, entry, filePath, offset, isCompletionInsideFrontmatter, scriptTagIndex, existingImports))
             .filter(utils_3.isNotNullOrUndefined)
             .map((comp) => this.fixTextEditRange(wordRangeStartPosition, comp));
         const completionList = vscode_languageserver_2.CompletionList.create(completionItems, true);
@@ -136,18 +163,29 @@ class CompletionsProviderImpl {
             item.documentation = itemDocumentation;
         }
         const actions = detail?.codeActions;
+        const isInsideScriptTag = data.scriptTagIndex !== undefined;
+        let scriptTagSnapshot;
+        if (isInsideScriptTag) {
+            const { snapshot } = (0, utils_2.getScriptTagSnapshot)(tsDoc, document, document.scriptTags[data.scriptTagIndex].container);
+            scriptTagSnapshot = snapshot;
+        }
         if (actions) {
             const edit = [];
             for (const action of actions) {
                 for (const change of action.changes) {
-                    edit.push(...change.textChanges.map((textChange) => codeActionChangeToTextEdit(document, fragment, textChange)));
+                    if (isInsideScriptTag) {
+                        change.textChanges.forEach((textChange) => {
+                            textChange.span.start = fragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(textChange.span.start)));
+                        });
+                    }
+                    edit.push(...change.textChanges.map((textChange) => codeActionChangeToTextEdit(document, fragment, isInsideScriptTag, textChange)));
                 }
             }
             item.additionalTextEdits = (item.additionalTextEdits ?? []).concat(edit);
         }
         return item;
     }
-    toCompletionItem(fragment, comp, filePath, offset, insideFrontmatter, existingImports) {
+    toCompletionItem(fragment, comp, filePath, offset, insideFrontmatter, scriptTagIndex, existingImports) {
         let item = vscode_languageserver_protocol_1.CompletionItem.create(comp.name);
         const isAstroComponent = this.isAstroComponentImport(comp.name);
         const isImport = comp.insertText?.includes('import');
@@ -194,6 +232,7 @@ class CompletionsProviderImpl {
             data: {
                 uri: fragment.getURL(),
                 filePath,
+                scriptTagIndex,
                 offset,
                 originalItem: comp,
             },
@@ -273,23 +312,33 @@ class CompletionsProviderImpl {
     }
 }
 exports.CompletionsProviderImpl = CompletionsProviderImpl;
-function codeActionChangeToTextEdit(document, fragment, change) {
+function codeActionChangeToTextEdit(document, fragment, isInsideScriptTag, change) {
     change.newText = (0, utils_2.removeAstroComponentSuffix)(change.newText);
-    // If we don't have a frontmatter already, create one with the import
-    const frontmatterState = document.astroMeta.frontmatter.state;
-    if (frontmatterState === null) {
-        return vscode_languageserver_1.TextEdit.replace(vscode_languageserver_1.Range.create(vscode_languageserver_1.Position.create(0, 0), vscode_languageserver_1.Position.create(0, 0)), `---${typescript_1.default.sys.newLine}${change.newText}---${typescript_1.default.sys.newLine}${typescript_1.default.sys.newLine}`);
-    }
     const { span } = change;
     let range;
     const virtualRange = (0, utils_2.convertRange)(fragment, span);
     range = (0, documents_1.mapRangeToOriginal)(fragment, virtualRange);
-    if (!(0, utils_1.isInsideFrontmatter)(document.getText(), document.offsetAt(range.start))) {
-        range = (0, utils_2.ensureFrontmatterInsert)(range, document);
+    if (!isInsideScriptTag) {
+        // If we don't have a frontmatter already, create one with the import
+        const frontmatterState = document.astroMeta.frontmatter.state;
+        if (frontmatterState === null) {
+            return vscode_languageserver_1.TextEdit.replace(vscode_languageserver_1.Range.create(vscode_languageserver_1.Position.create(0, 0), vscode_languageserver_1.Position.create(0, 0)), `---${typescript_1.default.sys.newLine}${change.newText}---${typescript_1.default.sys.newLine}${typescript_1.default.sys.newLine}`);
+        }
+        if (!(0, utils_1.isInsideFrontmatter)(document.getText(), document.offsetAt(range.start))) {
+            range = (0, utils_2.ensureFrontmatterInsert)(range, document);
+        }
+        // First import in a file will wrongly have a newline before it due to how the frontmatter is replaced by a comment
+        if (range.start.line === 1 && (change.newText.startsWith('\n') || change.newText.startsWith('\r\n'))) {
+            change.newText = change.newText.trimStart();
+        }
     }
-    // First import in a file will wrongly have a newline before it due to how the frontmatter is replaced by a comment
-    if (range.start.line === 1 && (change.newText.startsWith('\n') || change.newText.startsWith('\r\n'))) {
-        change.newText = change.newText.trimStart();
+    else {
+        const existingLine = (0, utils_1.getLineAtPosition)(document.positionAt(span.start), document.getText());
+        const isNewImport = !existingLine.trim().startsWith('import');
+        // Avoid putting new imports on the same line as the script tag opening
+        if (!(change.newText.startsWith('\n') || change.newText.startsWith('\r\n')) && isNewImport) {
+            change.newText = typescript_1.default.sys.newLine + change.newText;
+        }
     }
     return vscode_languageserver_1.TextEdit.replace(range, change.newText);
 }

package/dist/plugins/typescript/features/DefinitionsProvider.js

@@ -15,7 +15,28 @@ class DefinitionsProviderImpl {
         const tsFilePath = (0, utils_2.toVirtualAstroFilePath)(tsDoc.filePath);
         const fragmentPosition = mainFragment.getGeneratedPosition(position);
         const fragmentOffset = mainFragment.offsetAt(fragmentPosition);
-        const defs = lang.getDefinitionAndBoundSpan(tsFilePath, fragmentOffset);
+        let defs;
+        const html = document.html;
+        const offset = document.offsetAt(position);
+        const node = html.findNodeAt(offset);
+        if (node.tag === 'script') {
+            const { snapshot: scriptTagSnapshot, filePath: scriptFilePath, offset: scriptOffset, } = (0, utils_2.getScriptTagSnapshot)(tsDoc, document, node, position);
+            defs = lang.getDefinitionAndBoundSpan(scriptFilePath, scriptOffset);
+            if (defs) {
+                defs.definitions = defs.definitions?.map((def) => {
+                    const isInSameFile = def.fileName === scriptFilePath;
+                    def.fileName = isInSameFile ? tsFilePath : def.fileName;
+                    if (isInSameFile) {
+                        def.textSpan.start = mainFragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(def.textSpan.start)));
+                    }
+                    return def;
+                });
+                defs.textSpan.start = mainFragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(defs.textSpan.start)));
+            }
+        }
+        else {
+            defs = lang.getDefinitionAndBoundSpan(tsFilePath, fragmentOffset);
+        }
         if (!defs || !defs.definitions) {
             return [];
         }

package/dist/plugins/typescript/features/DiagnosticsProvider.js

@@ -20,24 +20,52 @@ class DiagnosticsProviderImpl {
         }
         const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
         const filePath = (0, utils_1.toVirtualAstroFilePath)(tsDoc.filePath);
+        const fragment = await tsDoc.createFragment();
+        let scriptDiagnostics = [];
+        document.scriptTags.forEach((scriptTag) => {
+            const { filePath: scriptFilePath, snapshot: scriptTagSnapshot } = (0, utils_1.getScriptTagSnapshot)(tsDoc, document, scriptTag.container);
+            const scriptDiagnostic = [
+                ...lang.getSyntacticDiagnostics(scriptFilePath),
+                ...lang.getSuggestionDiagnostics(scriptFilePath),
+                ...lang.getSemanticDiagnostics(scriptFilePath),
+            ]
+                // We need to duplicate the diagnostic creation here because we can't map TS's diagnostics range to the original
+                // file due to some internal cache inside TS that would cause it to being mapped twice in some cases
+                .map((diagnostic) => ({
+                range: (0, utils_1.convertRange)(scriptTagSnapshot, diagnostic),
+                severity: (0, utils_1.mapSeverity)(diagnostic.category),
+                source: 'ts',
+                message: typescript_1.default.flattenDiagnosticMessageText(diagnostic.messageText, '\n'),
+                code: diagnostic.code,
+                tags: getDiagnosticTag(diagnostic),
+            }))
+                .map(mapRange(scriptTagSnapshot, document));
+            scriptDiagnostics.push(...scriptDiagnostic);
+        });
         const { script: scriptBoundaries } = this.getTagBoundaries(lang, filePath);
         const syntaxDiagnostics = lang.getSyntacticDiagnostics(filePath);
         const suggestionDiagnostics = lang.getSuggestionDiagnostics(filePath);
-        const semanticDiagnostics = lang.getSemanticDiagnostics(filePath).filter((d) => {
-            return isNoWithinBoundary(scriptBoundaries, d);
+        const semanticDiagnostics = lang.getSemanticDiagnostics(filePath);
+        const diagnostics = [
+            ...syntaxDiagnostics,
+            ...suggestionDiagnostics,
+            ...semanticDiagnostics,
+        ].filter((diag) => {
+            return isNoWithinBoundary(scriptBoundaries, diag);
         });
-        const diagnostics = [...syntaxDiagnostics, ...suggestionDiagnostics, ...semanticDiagnostics];
-        const fragment = await tsDoc.createFragment();
-        return diagnostics
-            .map((diagnostic) => ({
-            range: (0, utils_1.convertRange)(tsDoc, diagnostic),
-            severity: (0, utils_1.mapSeverity)(diagnostic.category),
-            source: 'ts',
-            message: typescript_1.default.flattenDiagnosticMessageText(diagnostic.messageText, '\n'),
-            code: diagnostic.code,
-            tags: getDiagnosticTag(diagnostic),
-        }))
-            .map(mapRange(fragment, document))
+        return [
+            ...diagnostics
+                .map((diagnostic) => ({
+                range: (0, utils_1.convertRange)(tsDoc, diagnostic),
+                severity: (0, utils_1.mapSeverity)(diagnostic.category),
+                source: 'ts',
+                message: typescript_1.default.flattenDiagnosticMessageText(diagnostic.messageText, '\n'),
+                code: diagnostic.code,
+                tags: getDiagnosticTag(diagnostic),
+            }))
+                .map(mapRange(fragment, document)),
+            ...scriptDiagnostics,
+        ]
             .filter((diag) => {
             return (hasNoNegativeLines(diag) &&
                 isNoJSXImplicitRuntimeWarning(diag) &&
@@ -46,6 +74,7 @@ class DiagnosticsProviderImpl {
                 isNoSpreadExpected(diag) &&
                 isNoCantResolveJSONModule(diag) &&
                 isNoCantReturnOutsideFunction(diag) &&
+                isNoIsolatedModuleError(diag) &&
                 isNoJsxCannotHaveMultipleAttrsError(diag));
         })
             .map(enhanceIfNecessary);
@@ -146,12 +175,26 @@ function isNoCantReturnOutsideFunction(diagnostic) {
 function isNoCantResolveJSONModule(diagnostic) {
     return diagnostic.code !== 2732;
 }
+/**
+ * When the content of the file is invalid and can't be parsed properly for TSX generation, TS will show an error about
+ * how the current module can't be compiled under --isolatedModule, this is confusing to users so let's ignore this
+ */
+function isNoIsolatedModuleError(diagnostic) {
+    return diagnostic.code !== 1208;
+}
 /**
  * Some diagnostics have JSX-specific nomenclature or unclear description. Enhance them for more clarity.
  */
 function enhanceIfNecessary(diagnostic) {
+    // JSX element has no closing tag. JSX -> HTML
+    if (diagnostic.code === 17008) {
+        return {
+            ...diagnostic,
+            message: diagnostic.message.replace('JSX', 'HTML'),
+        };
+    }
+    // For the rare case where an user might try to put a client directive on something that is not a component
     if (diagnostic.code === 2322) {
-        // For the rare case where an user might try to put a client directive on something that is not a component
         if (diagnostic.message.includes("Property 'client:") && diagnostic.message.includes("to type 'HTMLProps")) {
             return {
                 ...diagnostic,

package/dist/plugins/typescript/features/FoldingRangesProvider.js

@@ -15,15 +15,22 @@ class FoldingRangesProviderImpl {
         const html = document.html;
         const { lang, tsDoc } = await this.languageServiceManager.getLSAndTSDoc(document);
         const filePath = (0, utils_1.toVirtualAstroFilePath)(tsDoc.filePath);
-        const outliningSpans = lang.getOutliningSpans(filePath);
-        const foldingRanges = [];
-        for (const span of outliningSpans) {
+        const outliningSpans = lang.getOutliningSpans(filePath).filter((span) => {
             const node = html.findNodeAt(span.textSpan.start);
             // Due to how our TSX output transform those tags into function calls or template literals
             // TypeScript thinks of those as outlining spans, which is fine but we don't want folding ranges for those
-            if (node.tag === 'script' || node.tag === 'Markdown' || node.tag === 'style') {
-                continue;
-            }
+            return node.tag !== 'script' && node.tag !== 'style' && node.tag !== 'Markdown';
+        });
+        const scriptOutliningSpans = [];
+        document.scriptTags.forEach((scriptTag) => {
+            const { snapshot: scriptTagSnapshot, filePath: scriptFilePath } = (0, utils_1.getScriptTagSnapshot)(tsDoc, document, scriptTag.container);
+            scriptOutliningSpans.push(...lang.getOutliningSpans(scriptFilePath).map((span) => {
+                span.textSpan.start = document.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(span.textSpan.start)));
+                return span;
+            }));
+        });
+        const foldingRanges = [];
+        for (const span of [...outliningSpans, ...scriptOutliningSpans]) {
             const start = document.positionAt(span.textSpan.start);
             const end = adjustFoldingEnd(start, document.positionAt(span.textSpan.start + span.textSpan.length), document);
             // When using this method for generating folding ranges, TypeScript tend to return some

package/dist/plugins/typescript/features/HoverProvider.js

@@ -18,7 +18,20 @@ class HoverProviderImpl {
         const fragment = await tsDoc.createFragment();
         const offset = fragment.offsetAt(fragment.getGeneratedPosition(position));
         const filePath = (0, utils_1.toVirtualAstroFilePath)(tsDoc.filePath);
-        let info = lang.getQuickInfoAtPosition(filePath, offset);
+        const html = document.html;
+        const documentOffset = document.offsetAt(position);
+        const node = html.findNodeAt(documentOffset);
+        let info;
+        if (node.tag === 'script') {
+            const { snapshot: scriptTagSnapshot, filePath: scriptFilePath, offset: scriptOffset, } = (0, utils_1.getScriptTagSnapshot)(tsDoc, document, node, position);
+            info = lang.getQuickInfoAtPosition(scriptFilePath, scriptOffset);
+            if (info) {
+                info.textSpan.start = fragment.offsetAt(scriptTagSnapshot.getOriginalPosition(scriptTagSnapshot.positionAt(info.textSpan.start)));
+            }
+        }
+        else {
+            info = lang.getQuickInfoAtPosition(filePath, offset);
+        }
         if (!info) {
             return null;
         }

package/dist/plugins/typescript/features/SignatureHelpProvider.js

@@ -20,8 +20,16 @@ class SignatureHelpProviderImpl {
         }
         const filePath = (0, utils_1.toVirtualAstroFilePath)(tsDoc.filePath);
         const offset = fragment.offsetAt(fragment.getGeneratedPosition(position));
+        const node = document.html.findNodeAt(offset);
+        let info;
         const triggerReason = this.toTsTriggerReason(context);
-        const info = lang.getSignatureHelpItems(filePath, offset, triggerReason ? { triggerReason } : undefined);
+        if (node.tag === 'script') {
+            const { filePath: scriptFilePath, offset: scriptOffset } = (0, utils_1.getScriptTagSnapshot)(tsDoc, document, node, position);
+            info = lang.getSignatureHelpItems(scriptFilePath, scriptOffset, triggerReason ? { triggerReason } : undefined);
+        }
+        else {
+            info = lang.getSignatureHelpItems(filePath, offset, triggerReason ? { triggerReason } : undefined);
+        }
         if (!info) {
             return null;
         }

package/dist/plugins/typescript/language-service.js

@@ -33,6 +33,7 @@ const utils_1 = require("../../utils");
 const module_loader_1 = require("./module-loader");
 const SnapshotManager_1 = require("./snapshots/SnapshotManager");
 const utils_2 = require("./utils");
+const DocumentSnapshot_1 = require("./snapshots/DocumentSnapshot");
 const DocumentSnapshotUtils = __importStar(require("./snapshots/utils"));
 const services = new Map();
 async function getLanguageService(path, workspaceUris, docContext) {
@@ -140,6 +141,12 @@ async function createLanguageService(tsconfigPath, docContext, workspaceUris) {
         }
         const newSnapshot = DocumentSnapshotUtils.createFromDocument(document);
         snapshotManager.set(filePath, newSnapshot);
+        document.scriptTags.forEach((scriptTag, index) => {
+            const scriptFilePath = filePath + `.__script${index}.js`;
+            const scriptSnapshot = new DocumentSnapshot_1.ScriptTagDocumentSnapshot(scriptTag, document, scriptFilePath);
+            snapshotManager.set(scriptFilePath, scriptSnapshot);
+            newSnapshot.scriptTagSnapshots?.push(scriptSnapshot);
+        });
         if (prevSnapshot && prevSnapshot.scriptKind !== newSnapshot.scriptKind) {
             // Restart language service as it doesn't handle script kind changes.
             languageService.dispose();
@@ -166,6 +173,16 @@ async function createLanguageService(tsconfigPath, docContext, workspaceUris) {
         astroModuleLoader.deleteUnresolvedResolutionsFromCache(fileName);
         doc = DocumentSnapshotUtils.createFromFilePath(fileName, docContext.createDocument);
         snapshotManager.set(fileName, doc);
+        // If we needed to create an Astro snapshot, also create its script tags snapshots
+        if ((0, utils_2.isAstroFilePath)(fileName)) {
+            const document = doc.parent;
+            document.scriptTags.forEach((scriptTag, index) => {
+                const scriptFilePath = fileName + `.__script${index}.js`;
+                const scriptSnapshot = new DocumentSnapshot_1.ScriptTagDocumentSnapshot(scriptTag, document, scriptFilePath);
+                snapshotManager.set(scriptFilePath, scriptSnapshot);
+                doc.scriptTagSnapshots?.push(scriptSnapshot);
+            });
+        }
         return doc;
     }
     function updateProjectFiles() {
@@ -214,6 +231,7 @@ async function createLanguageService(tsconfigPath, docContext, workspaceUris) {
             jsxFactory: 'astroHTML',
             module: typescript_1.default.ModuleKind.ESNext,
             target: typescript_1.default.ScriptTarget.ESNext,
+            isolatedModules: true,
             moduleResolution: typescript_1.default.ModuleResolutionKind.NodeJs,
         };
         const project = typescript_1.default.parseJsonConfigFileContent(configJson, typescript_1.default.sys, tsconfigRoot, forcedCompilerOptions, tsconfigPath, undefined, [

package/dist/plugins/typescript/snapshots/DocumentSnapshot.d.ts

@@ -1,6 +1,6 @@
 import ts from 'typescript';
 import { Position, TextDocumentContentChangeEvent } from 'vscode-languageserver';
-import { AstroDocument, DocumentMapper, IdentityMapper } from '../../../core/documents';
+import { AstroDocument, DocumentMapper, IdentityMapper, FragmentMapper, TagInformation } from '../../../core/documents';
 import { FrameworkExt } from '../utils';
 export interface DocumentSnapshot extends ts.IScriptSnapshot {
     version: number;
@@ -36,11 +36,12 @@ export interface SnapshotFragment extends DocumentMapper {
  * Snapshots used for Astro files
  */
 export declare class AstroSnapshot implements DocumentSnapshot {
-    private readonly parent;
+    readonly parent: AstroDocument;
     private readonly text;
     readonly scriptKind: ts.ScriptKind;
     private fragment?;
     version: number;
+    scriptTagSnapshots: ScriptTagDocumentSnapshot[];
     constructor(parent: AstroDocument, text: string, scriptKind: ts.ScriptKind);
     createFragment(): Promise<AstroSnapshotFragment>;
     destroyFragment(): null;
@@ -65,6 +66,25 @@ export declare class AstroSnapshotFragment implements SnapshotFragment {
     isInGenerated(pos: Position): boolean;
     getURL(): string;
 }
+export declare class ScriptTagDocumentSnapshot extends FragmentMapper implements DocumentSnapshot, SnapshotFragment {
+    scriptTag: TagInformation;
+    private readonly parent;
+    filePath: string;
+    readonly version: number;
+    private text;
+    scriptKind: ts.ScriptKind;
+    private lineOffsets?;
+    constructor(scriptTag: TagInformation, parent: AstroDocument, filePath: string);
+    positionAt(offset: number): Position;
+    offsetAt(position: Position): number;
+    createFragment(): Promise<SnapshotFragment>;
+    destroyFragment(): void;
+    getText(start: number, end: number): string;
+    getLength(): number;
+    getFullText(): string;
+    getChangeRange(): undefined;
+    private getLineOffsets;
+}
 /**
  * Snapshot used for anything that is not an Astro file
  * It's both used for .js(x)/.ts(x) files and .svelte/.vue files

package/dist/plugins/typescript/snapshots/DocumentSnapshot.js

@@ -1,6 +1,10 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TypeScriptDocumentSnapshot = exports.AstroSnapshotFragment = exports.AstroSnapshot = void 0;
+exports.TypeScriptDocumentSnapshot = exports.ScriptTagDocumentSnapshot = exports.AstroSnapshotFragment = exports.AstroSnapshot = void 0;
+const typescript_1 = __importDefault(require("typescript"));
 const documents_1 = require("../../../core/documents");
 const utils_1 = require("../../../utils");
 const utils_2 = require("../utils");
@@ -13,6 +17,7 @@ class AstroSnapshot {
         this.text = text;
         this.scriptKind = scriptKind;
         this.version = this.parent.version;
+        this.scriptTagSnapshots = [];
     }
     async createFragment() {
         if (!this.fragment) {
@@ -72,6 +77,48 @@ class AstroSnapshotFragment {
     }
 }
 exports.AstroSnapshotFragment = AstroSnapshotFragment;
+class ScriptTagDocumentSnapshot extends documents_1.FragmentMapper {
+    constructor(scriptTag, parent, filePath) {
+        super(parent.getText(), scriptTag, filePath);
+        this.scriptTag = scriptTag;
+        this.parent = parent;
+        this.filePath = filePath;
+        this.version = this.parent.version;
+        this.text = this.parent.getText().slice(this.scriptTag.start, this.scriptTag.end) + '\nexport {}';
+        this.scriptKind = typescript_1.default.ScriptKind.JS;
+    }
+    positionAt(offset) {
+        return (0, documents_1.positionAt)(offset, this.text, this.getLineOffsets());
+    }
+    offsetAt(position) {
+        return (0, documents_1.offsetAt)(position, this.text, this.getLineOffsets());
+    }
+    async createFragment() {
+        return this;
+    }
+    destroyFragment() {
+        //
+    }
+    getText(start, end) {
+        return this.text.substring(start, end);
+    }
+    getLength() {
+        return this.text.length;
+    }
+    getFullText() {
+        return this.text;
+    }
+    getChangeRange() {
+        return undefined;
+    }
+    getLineOffsets() {
+        if (!this.lineOffsets) {
+            this.lineOffsets = (0, documents_1.getLineOffsets)(this.text);
+        }
+        return this.lineOffsets;
+    }
+}
+exports.ScriptTagDocumentSnapshot = ScriptTagDocumentSnapshot;
 /**
  * Snapshot used for anything that is not an Astro file
  * It's both used for .js(x)/.ts(x) files and .svelte/.vue files

package/dist/plugins/typescript/snapshots/SnapshotManager.js

@@ -187,6 +187,7 @@ class SnapshotManager {
             const projectFiles = this.getProjectFileNames();
             let allFiles = Array.from(new Set([...projectFiles, ...this.getFileNames()]));
             allFiles = allFiles.map((file) => (0, utils_2.ensureRealFilePath)(file));
+            // eslint-disable-next-line no-console
             console.log('SnapshotManager File Statistics:\n' +
                 `Project files: ${projectFiles.length}\n` +
                 `Astro files: ${allFiles.filter((name) => name.endsWith('.astro')).length}\n` +

package/dist/plugins/typescript/utils.d.ts

@@ -1,7 +1,8 @@
 import ts from 'typescript';
 import { CompletionItemKind, DiagnosticSeverity, Position, Range, SymbolKind, SemanticTokensLegend } from 'vscode-languageserver';
 import { AstroDocument } from '../../core/documents';
-import { SnapshotFragment } from './snapshots/DocumentSnapshot';
+import { AstroSnapshot, ScriptTagDocumentSnapshot, SnapshotFragment } from './snapshots/DocumentSnapshot';
+import { Node } from 'vscode-html-languageservice';
 export declare const enum TokenType {
     class = 0,
     enum = 1,
@@ -58,4 +59,13 @@ export declare function toVirtualFilePath(filePath: string): string;
 export declare function toRealAstroFilePath(filePath: string): string;
 export declare function ensureRealAstroFilePath(filePath: string): string;
 export declare function ensureRealFilePath(filePath: string): string;
+export declare function getScriptTagSnapshot(snapshot: AstroSnapshot, document: AstroDocument, tagInfo: Node | {
+    start: number;
+    end: number;
+}, position?: Position): {
+    snapshot: ScriptTagDocumentSnapshot;
+    filePath: string;
+    index: number;
+    offset: number;
+};
 export {};

package/dist/plugins/typescript/utils.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ensureRealFilePath = exports.ensureRealAstroFilePath = exports.toRealAstroFilePath = exports.toVirtualFilePath = exports.toVirtualAstroFilePath = exports.isVirtualFilePath = exports.isVirtualSvelteFilePath = exports.isVirtualVueFilePath = exports.isVirtualAstroFilePath = exports.isFrameworkFilePath = exports.isAstroFilePath = exports.isVirtualFrameworkFilePath = exports.getFrameworkFromFilePath = exports.removeAstroComponentSuffix = exports.checkEndOfFileCodeInsert = exports.ensureFrontmatterInsert = exports.convertToLocationRange = exports.convertRange = exports.mapSeverity = exports.getScriptKindFromFileName = exports.isSubPath = exports.findTsConfigPath = exports.getExtensionFromScriptKind = exports.getCommitCharactersForScriptElement = exports.scriptElementKindToCompletionItemKind = exports.symbolKindFromString = exports.getSemanticTokenLegend = void 0;
+exports.getScriptTagSnapshot = exports.ensureRealFilePath = exports.ensureRealAstroFilePath = exports.toRealAstroFilePath = exports.toVirtualFilePath = exports.toVirtualAstroFilePath = exports.isVirtualFilePath = exports.isVirtualSvelteFilePath = exports.isVirtualVueFilePath = exports.isVirtualAstroFilePath = exports.isFrameworkFilePath = exports.isAstroFilePath = exports.isVirtualFrameworkFilePath = exports.getFrameworkFromFilePath = exports.removeAstroComponentSuffix = exports.checkEndOfFileCodeInsert = exports.ensureFrontmatterInsert = exports.convertToLocationRange = exports.convertRange = exports.mapSeverity = exports.getScriptKindFromFileName = exports.isSubPath = exports.findTsConfigPath = exports.getExtensionFromScriptKind = exports.getCommitCharactersForScriptElement = exports.scriptElementKindToCompletionItemKind = exports.symbolKindFromString = exports.getSemanticTokenLegend = void 0;
 const typescript_1 = __importDefault(require("typescript"));
 const path_1 = require("path");
 const utils_1 = require("../../utils");
@@ -346,3 +346,19 @@ function ensureRealFilePath(filePath) {
     }
 }
 exports.ensureRealFilePath = ensureRealFilePath;
+function getScriptTagSnapshot(snapshot, document, tagInfo, position) {
+    const index = document.scriptTags.findIndex((value) => value.container.start == tagInfo.start);
+    const scriptFilePath = snapshot.filePath + `.__script${index}.js`;
+    const scriptTagSnapshot = snapshot.scriptTagSnapshots[index];
+    let offset = 0;
+    if (position) {
+        offset = scriptTagSnapshot.offsetAt(scriptTagSnapshot.getGeneratedPosition(position));
+    }
+    return {
+        snapshot: scriptTagSnapshot,
+        filePath: scriptFilePath,
+        index,
+        offset,
+    };
+}
+exports.getScriptTagSnapshot = getScriptTagSnapshot;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astrojs/language-server",
-  "version": "0.16.1",
+  "version": "0.17.0",
   "author": "withastro",
   "license": "MIT",
   "type": "commonjs",