Repository: sveltejs/language-tools
Pull request #1547 (2022-07-03 12:56:06)

(fix) adjust element typings
for new transformation: use svelte:body instad of sveltebody


Patch:
diff --git a/packages/language-server/src/plugins/typescript/ComponentInfoProvider.ts b/packages/language-server/src/plugins/typescript/ComponentInfoProvider.ts
index a114f645..ae9a5913 100644
--- a/packages/language-server/src/plugins/typescript/ComponentInfoProvider.ts
+++ b/packages/language-server/src/plugins/typescript/ComponentInfoProvider.ts
@@ -8,7 +8,8 @@ export type ComponentPartInfo = ReturnType<ComponentEvents['getAll']>;
 export interface ComponentInfoProvider {
     getEvents(): ComponentPartInfo;
     getSlotLets(slot?: string): ComponentPartInfo;
-    getProps(propName: string): ts.CompletionEntry[];
+    getProps(): ComponentPartInfo;
+    getProp(propName: string): ts.CompletionEntry[];
 }
 
 export class JsOrTsComponentInfoProvider implements ComponentInfoProvider {
@@ -45,7 +46,16 @@ export class JsOrTsComponentInfoProvider implements ComponentInfoProvider {
         return this.mapPropertiesOfType(slotLetsType);
     }
 
-    getProps(propName: string): ts.CompletionEntry[] {
+    getProps() {
+        const props = this.getType('$$prop_def');
+        if (!props) {
+            return [];
+        }
+
+        return this.mapPropertiesOfType(props);
+    }
+
+    getProp(propName: string): ts.CompletionEntry[] {
         const props = this.getType('$$prop_def');
         if (!props) {
             return [];
diff --git a/packages/language-server/src/plugins/typescript/features/CompletionProvider.ts b/packages/language-server/src/plugins/typescript/features/CompletionProvider.ts
index dd27474d..544a24c1 100644
--- a/packages/language-server/src/plugins/typescript/features/CompletionProvider.ts
+++ b/packages/language-server/src/plugins/typescript/features/CompletionProvider.ts
@@ -3,6 +3,7 @@ import {
     CancellationToken,
     CompletionContext,
     CompletionItem,
+    CompletionItemKind,
     CompletionList,
     CompletionTriggerKind,
     MarkupContent,
@@ -197,6 +198,41 @@ export class CompletionsProviderImpl implements CompletionsProvider<CompletionEn
             return tsDoc.parserError ? CompletionList.create([], true) : null;
         }
 
+        if (
+            completions.length > 500 &&
+            svelteNode?.type === 'Element' &&
+            completions[0].kind !== ts.ScriptElementKind.memberVariableElement
+        ) {
+            // False global completions inside element start tag
+            return null;
+        }
+
+        if (
+            completions.length > 500 &&
+            svelteNode?.type === 'InlineComponent' &&
+            ['  ', ' >', ' /'].includes(
+                document.getText().substring(originalOffset - 1, originalOffset + 1)
+            )
+        ) {
+            // Very likely false global completions inside component start tag -> narrow
+            const props =
+                componentInfo
+                    ?.getProps()
+                    .map((entry) =>
+                        this.componentInfoToCompletionEntry(
+                            entry,
+                            '',
+                            CompletionItemKind.Field,
+                            document,
+                            wordRange
+                        )
+                    ) || [];
+            return CompletionList.create(
+                [...eventAndSlotLetCompletions, ...props],
+                !!tsDoc.parserError
+            );
+        }
+
         const existingImports = this.getExistingImports(document);
         const wordRangeStartPosition = document.positionAt(wordRange.start);
         const completionItems = completions
@@ -255,33 +291,59 @@ export class CompletionsProviderImpl implements CompletionsProvider<CompletionEn
 
     private getEventAndSlotLetCompletions(
         componentInfo: ComponentInfoProvider | null,
-        doc: Document,
+        document: Document,
         wordRange: { start: number; end: number }
     ): Array<AppCompletionItem<CompletionEntryWithIdentifier>> {
         if (componentInfo === null) {
             return [];
         }
 
+        return [
+            ...componentInfo
+                .getEvents()
+                .map((event) =>
+                    this.componentInfoToCompletionEntry(
+                        event,
+                        'on:',
+                        undefined,
+                        document,
+                        wordRange
+                    )
+                ),
+            ...componentInfo
+                .getSlotLets()
+                .map((slot) =>
+                    this.componentInfoToCompletionEntry(
+                        slot,
+                        'let:',
+                        undefined,
+                        document,
+                        wordRange
+                    )
+                )
+        ];
+    }
+
+    private componentInfoToCompletionEntry(
+        info: ComponentPartInfo[0],
+        prefix: string,
+        kind: CompletionItemKind | undefined,
+        doc: Document,
+        wordRange: { start: number; end: number }
+    ): AppCompletionItem<CompletionEntryWithIdentifier> {
         const { start, end } = wordRange;
-        const events = componentInfo.getEvents().map((event) => mapToCompletionEntry(event, 'on:'));
-        const slotLets = componentInfo
-            .getSlotLets()
-            .map((slot) => mapToCompletionEntry(slot, 'let:'));
-        return [...events, ...slotLets];
-
-        function mapToCompletionEntry(info: ComponentPartInfo[0], prefix: string) {
-            const slotName = prefix + info.name;
-            return {
-                label: slotName,
-                sortText: '-1',
-                detail: info.name + ': ' + info.type,
-                documentation: info.doc && { kind: MarkupKind.Markdown, value: info.doc },
-                textEdit:
-                    start !== end
-                        ? TextEdit.replace(toRange(doc.getText(), start, end), slotName)
-                        : undefined
-            };
-        }
+        const name = prefix + info.name;
+        return {
+            label: name,
+            kind,
+            sortText: '-1',
+            detail: info.name + ': ' + info.type,
+            documentation: info.doc && { kind: MarkupKind.Markdown, value: info.doc },
+            textEdit:
+                start !== end
+                    ? TextEdit.replace(toRange(doc.getText(), start, end), name)
+                    : undefined
+        };
     }
 
     private toCompletionItem(
@@ -677,7 +739,7 @@ export class CompletionsProviderImpl implements CompletionsProvider<CompletionEn
               }
             : undefined;
 
-        return componentInfo.getProps(jsxAttribute.name.getText()).map((item) => ({
+        return componentInfo.getProp(jsxAttribute.name.getText()).map((item) => ({
             ...item,
             replacementSpan
         }));
diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts
index 4c6c9b96..1abd0fe7 100644
--- a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts
+++ b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts
@@ -98,9 +98,9 @@ export class Element {
                 // remove the colon: svelte:xxx -> sveltexxx
                 const nodeName = `svelte${this.node.name.substring(7)}`;
                 this._name = '$$_' + nodeName + this.computeDepth();
-                this.startTransformation.push(`{ ${createElement}("${nodeName}", {`);
+                this.startTransformation.push(`{ ${createElement}("${this.node.name}", {`);
                 this.addNameConstDeclaration = () =>
-                    (this.startTransformation[0] = `{ const ${this._name} = ${createElement}("${nodeName}", {`);
+                    (this.startTransformation[0] = `{ const ${this._name} = ${createElement}("${this.node.name}", {`);
                 break;
             }
             case 'svelte:element': {
diff --git a/packages/svelte2tsx/svelte-jsx.d.ts b/packages/svelte2tsx/svelte-jsx.d.ts
index 1d3d2dde..77da6d93 100644
--- a/packages/svelte2tsx/svelte-jsx.d.ts
+++ b/packages/svelte2tsx/svelte-jsx.d.ts
@@ -294,11 +294,11 @@ declare namespace svelteHTML {
     view: SVGProps<SVGViewElement>;
 
     // Svelte specific
-    sveltewindow: HTMLProps<Window> & SvelteWindowProps;
-    sveltebody: HTMLProps<HTMLElement>;
-    sveltefragment: { slot?: string; };
-    svelteoptions: { [name: string]: any };
-    sveltehead: { [name: string]: any };
+    'svelte:window': HTMLProps<Window> & SvelteWindowProps;
+    'svelte:body': HTMLProps<HTMLElement>;
+    'svelte:fragment': { slot?: string; };
+    'svelte:options': { [name: string]: any };
+    'svelte:head': { [name: string]: any };
 
     [name: string]: { [name: string]: any };
   }


Test patch:
diff --git a/packages/language-server/test/plugins/typescript/features/CompletionProvider.test.ts b/packages/language-server/test/plugins/typescript/features/CompletionProvider.test.ts
index 09c55fce..23e3d225 100644
--- a/packages/language-server/test/plugins/typescript/features/CompletionProvider.test.ts
+++ b/packages/language-server/test/plugins/typescript/features/CompletionProvider.test.ts
@@ -187,6 +187,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'on:aa',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: undefined
                 },
                 {
@@ -197,6 +198,7 @@ function test(useNewTransformation: boolean) {
                     },
                     label: 'on:ab',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: undefined
                 },
                 {
@@ -204,6 +206,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'on:ac',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: undefined
                 }
             ]);
@@ -237,6 +240,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'on:aa',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:aa',
                         range: {
@@ -259,6 +263,7 @@ function test(useNewTransformation: boolean) {
                     },
                     label: 'on:ab',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:ab',
                         range: {
@@ -278,6 +283,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'on:ac',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:ac',
                         range: {
@@ -319,6 +325,7 @@ function test(useNewTransformation: boolean) {
                     },
                     label: 'on:c',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: undefined
                 }
             ]);
@@ -347,6 +354,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'on:event1',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:event1',
                         range: {
@@ -369,6 +377,7 @@ function test(useNewTransformation: boolean) {
                     },
                     label: 'on:event2',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:event2',
                         range: {
@@ -409,6 +418,7 @@ function test(useNewTransformation: boolean) {
                     label: 'on:event1',
                     sortText: '-1',
                     documentation: '',
+                    kind: undefined,
                     textEdit: {
                         newText: 'on:event1',
                         range: {
@@ -1063,6 +1073,7 @@ function test(useNewTransformation: boolean) {
                     documentation: '',
                     label: 'let:let1',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'let:let1',
                         range: {
@@ -1085,6 +1096,7 @@ function test(useNewTransformation: boolean) {
                     },
                     label: 'let:let2',
                     sortText: '-1',
+                    kind: undefined,
                     textEdit: {
                         newText: 'let:let2',
                         range: {
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/action-svelte-body/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/action-svelte-body/expectedv2.js
index 926ea7c5..ea3887a8 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/action-svelte-body/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/action-svelte-body/expectedv2.js
@@ -1,1 +1,1 @@
-  { svelteHTML.createElement("sveltebody", { });__sveltets_2_ensureAction(blink(svelteHTML.mapElementTag('body')));}
\ No newline at end of file
+  { svelteHTML.createElement("svelte:body", { });__sveltets_2_ensureAction(blink(svelteHTML.mapElementTag('body')));}
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this-svelte-body/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this-svelte-body/expectedv2.js
index fc82c6f8..5e03943b 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this-svelte-body/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/binding-this-svelte-body/expectedv2.js
@@ -1,1 +1,1 @@
- { const $$_sveltebody0 = svelteHTML.createElement("sveltebody", {  });element = $$_sveltebody0;}
\ No newline at end of file
+ { const $$_sveltebody0 = svelteHTML.createElement("svelte:body", {  });element = $$_sveltebody0;}
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/if-nested-slot-let-shadowed/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/if-nested-slot-let-shadowed/expectedv2.js
index 70bf2268..9f5e3e84 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/if-nested-slot-let-shadowed/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/if-nested-slot-let-shadowed/expectedv2.js
@@ -11,7 +11,7 @@ if(hello && hello1){
                 hello;
             }
          }Comp}
-         {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,hello,} = $$_Comp0.$$slot_def["named1"];$$_$$;{ svelteHTML.createElement("sveltefragment", {  });
+         {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,hello,} = $$_Comp0.$$slot_def["named1"];$$_$$;{ svelteHTML.createElement("svelte:fragment", {  });
             if(hello){
                 hello;
             }
@@ -67,7 +67,7 @@ if(hello && hello1){
     }else{
         hello; bye;
     }
-     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,hello,} = $$_Comp0.$$slot_def["named1"];$$_$$;{ svelteHTML.createElement("sveltefragment", {  });
+     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,hello,} = $$_Comp0.$$slot_def["named1"];$$_$$;{ svelteHTML.createElement("svelte:fragment", {  });
         if(hello && bye){
             hello; bye;
         } else if (hello && bye){
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/svelte-fragment/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/svelte-fragment/expectedv2.js
index abf40a1c..31326609 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/svelte-fragment/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/svelte-fragment/expectedv2.js
@@ -1,19 +1,19 @@
  { const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: {}});
-     { svelteHTML.createElement("sveltefragment", {});
+     { svelteHTML.createElement("svelte:fragment", {});
          { svelteHTML.createElement("p", {});  }
      }
 
-     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,} = $$_Component0.$$slot_def["named"];$$_$$;{ svelteHTML.createElement("sveltefragment", { });
+     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,} = $$_Component0.$$slot_def["named"];$$_$$;{ svelteHTML.createElement("svelte:fragment", { });
          { svelteHTML.createElement("p", {});  }
      }}
  Component}
 
  { const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: {}});
-     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,foo,bar:baz,} = $$_Component0.$$slot_def.default;$$_$$;{ svelteHTML.createElement("sveltefragment", {   });
+     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,foo,bar:baz,} = $$_Component0.$$slot_def.default;$$_$$;{ svelteHTML.createElement("svelte:fragment", {   });
          { svelteHTML.createElement("p", {});foo; baz; }
      }}
 
-     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,foo,bar:baz,} = $$_Component0.$$slot_def["named"];$$_$$;{ svelteHTML.createElement("sveltefragment", {    });
+     {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,foo,bar:baz,} = $$_Component0.$$slot_def["named"];$$_$$;{ svelteHTML.createElement("svelte:fragment", {    });
          { svelteHTML.createElement("p", {});foo; baz; }
      }}
  Component}
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltehead-title/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltehead-title/expectedv2.js
index 99b023e7..709e7318 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltehead-title/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltehead-title/expectedv2.js
@@ -1,3 +1,3 @@
- { svelteHTML.createElement("sveltehead", {});
+ { svelteHTML.createElement("svelte:head", {});
 	 { svelteHTML.createElement("title", {});  }
  }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/accessors-config-attr-false/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/accessors-config-attr-false/expectedv2.ts
index 76c68551..187d5b65 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/accessors-config-attr-false/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/accessors-config-attr-false/expectedv2.ts
@@ -3,7 +3,7 @@
 
 	 let foo: number = undefined/*Ωignore_startΩ*/;foo = __sveltets_1_any(foo);/*Ωignore_endΩ*/;
 ;
-async () => { { svelteHTML.createElement("svelteoptions", {  "accessors":false,});}
+async () => { { svelteHTML.createElement("svelte:options", {  "accessors":false,});}
 };
 return { props: {foo: foo}, slots: {}, getters: {}, events: {} }}
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/const-tag-component/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/const-tag-component/expectedv2.ts
index 6cfe66b3..106bcdbd 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/const-tag-component/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/const-tag-component/expectedv2.ts
@@ -14,21 +14,21 @@ function render() {
 async () => {
 
  { const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: {box,}});
-	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,box,} = $$_Component0.$$slot_def["box1"];$$_$$;{ svelteHTML.createElement("sveltefragment", {  });
+	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,box,} = $$_Component0.$$slot_def["box1"];$$_$$;{ svelteHTML.createElement("svelte:fragment", {  });
 		const {area, volume} = calculate(box.width, box.height, constant);
 		const perimeter = (box.width + box.height) * constant;
 		const [width, height, sum] = [box.width * constant, box.height, box.width * constant + box.height];	
 		 { svelteHTML.createElement("div", {});area; volume; perimeter; width; height; sum; }
 	 }}
 
-	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,width,height,} = $$_Component0.$$slot_def["box2"];$$_$$;{ svelteHTML.createElement("sveltefragment", {   });
+	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,width,height,} = $$_Component0.$$slot_def["box2"];$$_$$;{ svelteHTML.createElement("svelte:fragment", {   });
 		const {area, volume} = calculate(width, height, constant);
 		const perimeter = (width + height) * constant;
 		const [_width, _height, sum] = [width * constant, height, width * constant + height];	
 		 { svelteHTML.createElement("div", {});area; volume; perimeter; _width; _height; sum; }
 	 }}
 
-	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,box:{width, height},} = $$_Component0.$$slot_def.default;$$_$$;{ svelteHTML.createElement("sveltefragment", {  });
+	 {const {/*Ωignore_startΩ*/$$_$$/*Ωignore_endΩ*/,box:{width, height},} = $$_Component0.$$slot_def.default;$$_$$;{ svelteHTML.createElement("svelte:fragment", {  });
 		const {area, volume} = calculate(width, height, constant);
 		const perimeter = (width + height) * constant;
 		const [_width, _height, sum] = [width * constant, height, width * constant + height];	
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
index e001594e..d65196c9 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
@@ -1,7 +1,7 @@
 ///<reference types="svelte" />
 ;function render() {
-async () => { { svelteHTML.createElement("sveltebody", { "onclick":undefined,}); }
- { svelteHTML.createElement("sveltewindow", { "onresize":undefined,}); }};
+async () => { { svelteHTML.createElement("svelte:body", { "onclick":undefined,}); }
+ { svelteHTML.createElement("svelte:window", { "onresize":undefined,}); }};
 return { props: {}, slots: {}, getters: {}, events: {'click':__sveltets_1_mapBodyEvent('click'), 'resize':__sveltets_1_mapWindowEvent('resize')} }}
 
 export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/script-inside-head-after-toplevel-script/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/script-inside-head-after-toplevel-script/expectedv2.ts
index a52d14b9..a21a8ca2 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/script-inside-head-after-toplevel-script/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/script-inside-head-after-toplevel-script/expectedv2.ts
@@ -9,7 +9,7 @@ async () => { { svelteHTML.createElement("div", {});
 
 
 
- { svelteHTML.createElement("sveltehead", {});
+ { svelteHTML.createElement("svelte:head", {});
    { svelteHTML.createElement("link", {    "rel":`stylesheet`,"href":`/lib/jodit.es2018.min.css`,});}
   
  }};
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-not-present/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-not-present/expectedv2.ts
index 23824701..83da8160 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-not-present/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-not-present/expectedv2.ts
@@ -4,7 +4,7 @@
 	 let foo: number = undefined/*Ωignore_startΩ*/;foo = __sveltets_1_any(foo);/*Ωignore_endΩ*/
 	 const bar: string = ''
 ;
-async () => { { svelteHTML.createElement("svelteoptions", {});}
+async () => { { svelteHTML.createElement("svelte:options", {});}
 };
 return { props: {foo: foo , bar: bar}, slots: {}, getters: {bar: bar}, events: {} }}
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-present/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-present/expectedv2.ts
index 39426dc4..649458fe 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-present/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-attr-present/expectedv2.ts
@@ -7,7 +7,7 @@
 	
 	 const bar: string = ''
 ;
-async () => {  { svelteHTML.createElement("svelteoptions", {"accessors":true,});}
+async () => {  { svelteHTML.createElement("svelte:options", {"accessors":true,});}
 };
 return { props: {foo: foo , foo2: foo2 , class: clazz , bar: bar}, slots: {}, getters: {bar: bar}, events: {} }}
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-false/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-false/expectedv2.ts
index f5ffa64c..59199bd0 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-false/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-false/expectedv2.ts
@@ -4,7 +4,7 @@
 	 let foo: number = undefined/*Ωignore_startΩ*/;foo = __sveltets_1_any(foo);/*Ωignore_endΩ*/
 	 const bar: string = ''
 ;
-async () => { { svelteHTML.createElement("svelteoptions", {  "accessors":false,});}
+async () => { { svelteHTML.createElement("svelte:options", {  "accessors":false,});}
 };
 return { props: {foo: foo , bar: bar}, slots: {}, getters: {bar: bar}, events: {} }}
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-true/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-true/expectedv2.ts
index f944b7c6..ddc53ae3 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-true/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-accessors-mustachetag-true/expectedv2.ts
@@ -7,7 +7,7 @@
 	
 	 const bar: string = ''
 ;
-async () => { { svelteHTML.createElement("svelteoptions", {  "accessors":true,});}
+async () => { { svelteHTML.createElement("svelte:options", {  "accessors":true,});}
 };
 return { props: {foo: foo , foo2: foo2 , class: clazz , bar: bar}, slots: {}, getters: {bar: bar}, events: {} }}
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
index 334209e1..b1b20348 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
@@ -6,13 +6,13 @@ async () => {if(true){
  { const $$_svelte_component0C = __sveltets_2_ensureComponent(testComponent); new $$_svelte_component0C({ target: __sveltets_2_any(), props: {   "propa":5,}});
      { svelteHTML.createElement("h1", {});  }
  }
- { svelteHTML.createElement("sveltewindow", {   "onclick":e => {},});}
- { svelteHTML.createElement("sveltebody", {   "onclick":e => {},});}
- { svelteHTML.createElement("sveltehead", {});
+ { svelteHTML.createElement("svelte:window", {   "onclick":e => {},});}
+ { svelteHTML.createElement("svelte:body", {   "onclick":e => {},});}
+ { svelteHTML.createElement("svelte:head", {});
      { svelteHTML.createElement("h1", {});  }
  }
- { svelteHTML.createElement("svelteoptions", {});}
- { svelteHTML.createElement("sveltefragment", {});}};
+ { svelteHTML.createElement("svelte:options", {});}
+ { svelteHTML.createElement("svelte:fragment", {});}};
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {