From 697d64d399086a8d540fb7fc906b5a8205592bc2 Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 23 Jul 2021 16:39:16 +0800 Subject: [PATCH 1/4] (fix) emitDts for components with no script --- packages/svelte2tsx/src/svelte2tsx/index.ts | 7 +---- .../expected/TestNoScript.svelte.d.ts | 27 +++++++++++++++++++ .../javascript/src/TestNoScript.svelte | 3 +++ .../samples/creates-dts/expected.tsx | 5 ++-- .../creates-no-script-dts/expected.tsx | 16 +++++++++++ .../creates-no-script-dts/input.svelte | 1 + .../samples/ts-$$generics-dts/expected.tsx | 3 ++- .../samples/ts-creates-dts/expected.tsx | 5 ++-- 8 files changed, 56 insertions(+), 11 deletions(-) create mode 100644 packages/svelte2tsx/test/emitDts/samples/javascript/expected/TestNoScript.svelte.d.ts create mode 100644 packages/svelte2tsx/test/emitDts/samples/javascript/src/TestNoScript.svelte create mode 100644 packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx create mode 100644 packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte diff --git a/packages/svelte2tsx/src/svelte2tsx/index.ts b/packages/svelte2tsx/src/svelte2tsx/index.ts index b3898bcd2..c2bdc9738 100644 --- a/packages/svelte2tsx/src/svelte2tsx/index.ts +++ b/packages/svelte2tsx/src/svelte2tsx/index.ts @@ -401,12 +401,7 @@ declare function __sveltets_1_createSvelteComponentTyped( ); let code = str.toString(); // Remove all tsx occurences and the template part from the output - code = - code - .substr(0, code.indexOf('\n() => (<>')) - // prepended before each script block - .replace('<>;', '') - .replace('<>;', '') + code.substr(code.lastIndexOf(');') + ');'.length); + code = code.replace(/\<>.*?<\/>/gs, '').replace('() => ();', '') return { code }; diff --git a/packages/svelte2tsx/test/emitDts/samples/javascript/expected/TestNoScript.svelte.d.ts b/packages/svelte2tsx/test/emitDts/samples/javascript/expected/TestNoScript.svelte.d.ts new file mode 100644 index 000000000..f102c232d --- /dev/null +++ b/packages/svelte2tsx/test/emitDts/samples/javascript/expected/TestNoScript.svelte.d.ts @@ -0,0 +1,27 @@ +/** @typedef {typeof __propDef.props} TestNoScriptProps */ +/** @typedef {typeof __propDef.events} TestNoScriptEvents */ +/** @typedef {typeof __propDef.slots} TestNoScriptSlots */ +export default class TestNoScript extends SvelteComponentTyped<{}, { + click: MouseEvent; +} & { + [evt: string]: CustomEvent; +}, { + default: {}; +}> { +} +export type TestNoScriptProps = typeof __propDef.props; +export type TestNoScriptEvents = typeof __propDef.events; +export type TestNoScriptSlots = typeof __propDef.slots; +import { SvelteComponentTyped } from "svelte"; +declare const __propDef: { + props: {}; + events: { + click: MouseEvent; + } & { + [evt: string]: CustomEvent; + }; + slots: { + default: {}; + }; +}; +export {}; diff --git a/packages/svelte2tsx/test/emitDts/samples/javascript/src/TestNoScript.svelte b/packages/svelte2tsx/test/emitDts/samples/javascript/src/TestNoScript.svelte new file mode 100644 index 000000000..652e1fa99 --- /dev/null +++ b/packages/svelte2tsx/test/emitDts/samples/javascript/src/TestNoScript.svelte @@ -0,0 +1,3 @@ +
+ +
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx index c84b1a5cb..70fee4fdf 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx @@ -4,9 +4,9 @@ declare function __sveltets_1_createSvelteComponentTyped( render: {props: Props, events: Events, slots: Slots } ): SvelteComponentConstructor,Svelte2TsxComponentConstructorParameters>; - - export const foo = 'foo'; ; + export const foo = 'foo'; +;; import { createEventDispatcher } from 'svelte'; function render() { @@ -19,6 +19,7 @@ function render() { const dispatch = createEventDispatcher(); dispatch('hi'); ; + return { props: { /** @type {boolean} */bar: bar , foobar: foobar}, slots: {'default': {bar:bar}}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click'), 'hi': __sveltets_1_customEvent} }} const __propDef = __sveltets_1_partial(['foobar'], __sveltets_1_with_any_event(render())); diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx new file mode 100644 index 000000000..0fa4be3ef --- /dev/null +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx @@ -0,0 +1,16 @@ +import { SvelteComponentTyped } from "svelte" + +declare function __sveltets_1_createSvelteComponentTyped( + render: {props: Props, events: Events, slots: Slots } +): SvelteComponentConstructor,Svelte2TsxComponentConstructorParameters>; + +;function render() { + +return { props: {}, slots: {'default': {}}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click')} }} +const __propDef = __sveltets_1_partial(__sveltets_1_with_any_event(render())); +/** @typedef {typeof __propDef.props} InputProps */ +/** @typedef {typeof __propDef.events} InputEvents */ +/** @typedef {typeof __propDef.slots} InputSlots */ + +export default class Input extends __sveltets_1_createSvelteComponentTyped(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) { +} \ No newline at end of file diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte new file mode 100644 index 000000000..fc950a64c --- /dev/null +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx index eb3243201..9a97e8f4a 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx @@ -1,6 +1,6 @@ import { SvelteComponentTyped } from "svelte" - +; import { createEventDispatcher } from 'svelte'; function render/*Ωignore_startΩ*//*Ωignore_endΩ*/() { @@ -16,6 +16,7 @@ function render/*Ωignore_startΩ*//*Ωig const dispatch = createEventDispatcher<{a: A}>(); ; + return { props: {a: a , b: b , c: c} as {a: A, b: B, c: C}, slots: {'default': {c:c}}, getters: {}, events: {...__sveltets_1_toEventTypings<{a: A}>()} }} class __sveltets_Render { props() { diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx index baf7319fb..2c32947aa 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx @@ -1,8 +1,8 @@ import { SvelteComponentTyped } from "svelte" - - export const foo = 'foo'; ; + export const foo = 'foo'; +;; import Bar from './bar'; import { createEventDispatcher } from 'svelte'; function render() { @@ -15,6 +15,7 @@ function render() { const dispatch = createEventDispatcher<{swipe: string}>(); ; + return { props: {bar: bar , foobar: foobar} as {bar: Bar, foobar?: typeof foobar}, slots: {'default': {bar:bar}}, getters: {}, events: {...__sveltets_1_toEventTypings<{swipe: string}>(), 'click':__sveltets_1_mapElementEvent('click')} }} const __propDef = __sveltets_1_with_any_event(render()); export type InputProps = typeof __propDef.props; From 69f837a7ef1765e8c31bb6196e5788faf1899623 Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 23 Jul 2021 16:46:16 +0800 Subject: [PATCH 2/4] format --- packages/svelte2tsx/src/svelte2tsx/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/svelte2tsx/src/svelte2tsx/index.ts b/packages/svelte2tsx/src/svelte2tsx/index.ts index c2bdc9738..58b268265 100644 --- a/packages/svelte2tsx/src/svelte2tsx/index.ts +++ b/packages/svelte2tsx/src/svelte2tsx/index.ts @@ -401,7 +401,7 @@ declare function __sveltets_1_createSvelteComponentTyped( ); let code = str.toString(); // Remove all tsx occurences and the template part from the output - code = code.replace(/\<>.*?<\/>/gs, '').replace('() => ();', '') + code = code.replace(/\<>.*?<\/>/gs, '').replace('() => ();', ''); return { code }; From d61cd1c1754437cbf245fcfa13f1aa94436aace2 Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 23 Jul 2021 17:18:08 +0800 Subject: [PATCH 3/4] format --- packages/svelte2tsx/src/svelte2tsx/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/svelte2tsx/src/svelte2tsx/index.ts b/packages/svelte2tsx/src/svelte2tsx/index.ts index 58b268265..ce8210806 100644 --- a/packages/svelte2tsx/src/svelte2tsx/index.ts +++ b/packages/svelte2tsx/src/svelte2tsx/index.ts @@ -401,7 +401,7 @@ declare function __sveltets_1_createSvelteComponentTyped( ); let code = str.toString(); // Remove all tsx occurences and the template part from the output - code = code.replace(/\<>.*?<\/>/gs, '').replace('() => ();', ''); + code = code.replace(/<>.*?<\/>/gs, '').replace('() => ();', ''); return { code }; From 8b771412c444a30fd0253419c1c2f3c6863e646f Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 23 Jul 2021 20:06:55 +0800 Subject: [PATCH 4/4] (fix) robust tsx replace strategy --- packages/svelte2tsx/src/svelte2tsx/index.ts | 9 ++++++++- .../test/svelte2tsx/samples/creates-dts/expected.tsx | 5 ++--- .../samples/creates-no-script-dts/expected.tsx | 2 +- .../samples/creates-no-script-dts/input.svelte | 5 ++++- .../svelte2tsx/samples/ts-$$generics-dts/expected.tsx | 3 +-- .../test/svelte2tsx/samples/ts-creates-dts/expected.tsx | 5 ++--- 6 files changed, 18 insertions(+), 11 deletions(-) diff --git a/packages/svelte2tsx/src/svelte2tsx/index.ts b/packages/svelte2tsx/src/svelte2tsx/index.ts index ce8210806..fea34351c 100644 --- a/packages/svelte2tsx/src/svelte2tsx/index.ts +++ b/packages/svelte2tsx/src/svelte2tsx/index.ts @@ -401,7 +401,14 @@ declare function __sveltets_1_createSvelteComponentTyped( ); let code = str.toString(); // Remove all tsx occurences and the template part from the output - code = code.replace(/<>.*?<\/>/gs, '').replace('() => ();', ''); + code = code + // prepended before each script block + .replace('<>;', '') + .replace('<>;', '') + // tsx in render function + .replace(/<>.*<\/>/s, '') + .replace('\n() => ();', ''); + return { code }; diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx index 70fee4fdf..c84b1a5cb 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-dts/expected.tsx @@ -4,9 +4,9 @@ declare function __sveltets_1_createSvelteComponentTyped( render: {props: Props, events: Events, slots: Slots } ): SvelteComponentConstructor,Svelte2TsxComponentConstructorParameters>; -; + export const foo = 'foo'; -;; +; import { createEventDispatcher } from 'svelte'; function render() { @@ -19,7 +19,6 @@ function render() { const dispatch = createEventDispatcher(); dispatch('hi'); ; - return { props: { /** @type {boolean} */bar: bar , foobar: foobar}, slots: {'default': {bar:bar}}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click'), 'hi': __sveltets_1_customEvent} }} const __propDef = __sveltets_1_partial(['foobar'], __sveltets_1_with_any_event(render())); diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx index 0fa4be3ef..9fa8f915e 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/expected.tsx @@ -4,7 +4,7 @@ declare function __sveltets_1_createSvelteComponentTyped( render: {props: Props, events: Events, slots: Slots } ): SvelteComponentConstructor,Svelte2TsxComponentConstructorParameters>; -;function render() { +function render() { return { props: {}, slots: {'default': {}}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click')} }} const __propDef = __sveltets_1_partial(__sveltets_1_with_any_event(render())); diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte index fc950a64c..71f606acf 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte +++ b/packages/svelte2tsx/test/svelte2tsx/samples/creates-no-script-dts/input.svelte @@ -1 +1,4 @@ - \ No newline at end of file + +{#await Promise.resolve(0) then n} + {n} +{/await} \ No newline at end of file diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx index 9a97e8f4a..eb3243201 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-$$generics-dts/expected.tsx @@ -1,6 +1,6 @@ import { SvelteComponentTyped } from "svelte" -; + import { createEventDispatcher } from 'svelte'; function render/*Ωignore_startΩ*//*Ωignore_endΩ*/() { @@ -16,7 +16,6 @@ function render/*Ωignore_startΩ*//*Ωig const dispatch = createEventDispatcher<{a: A}>(); ; - return { props: {a: a , b: b , c: c} as {a: A, b: B, c: C}, slots: {'default': {c:c}}, getters: {}, events: {...__sveltets_1_toEventTypings<{a: A}>()} }} class __sveltets_Render { props() { diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx index 2c32947aa..baf7319fb 100644 --- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx +++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-creates-dts/expected.tsx @@ -1,8 +1,8 @@ import { SvelteComponentTyped } from "svelte" -; + export const foo = 'foo'; -;; +; import Bar from './bar'; import { createEventDispatcher } from 'svelte'; function render() { @@ -15,7 +15,6 @@ function render() { const dispatch = createEventDispatcher<{swipe: string}>(); ; - return { props: {bar: bar , foobar: foobar} as {bar: Bar, foobar?: typeof foobar}, slots: {'default': {bar:bar}}, getters: {}, events: {...__sveltets_1_toEventTypings<{swipe: string}>(), 'click':__sveltets_1_mapElementEvent('click')} }} const __propDef = __sveltets_1_with_any_event(render()); export type InputProps = typeof __propDef.props;