From 3e1abc0b87ea9ce46a97ff53035d727fdf31a04a Mon Sep 17 00:00:00 2001 From: Dominic Gannaway Date: Mon, 10 Jun 2024 12:32:56 +0100 Subject: [PATCH] fix: ensure dev validation in dynamic component works as intended (#11985) Fixes #11984 --- .changeset/neat-jokes-beam.md | 5 +++++ .../phases/3-transform/client/visitors/template.js | 10 ++++++++-- .../samples/dynamic-component-this/Test.svelte | 3 +++ .../samples/dynamic-component-this/_config.js | 11 +++++++++++ .../samples/dynamic-component-this/main.svelte | 7 +++++++ 5 files changed, 34 insertions(+), 2 deletions(-) create mode 100644 .changeset/neat-jokes-beam.md create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/Test.svelte create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/_config.js create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/main.svelte diff --git a/.changeset/neat-jokes-beam.md b/.changeset/neat-jokes-beam.md new file mode 100644 index 0000000000..9e15dcef12 --- /dev/null +++ b/.changeset/neat-jokes-beam.md @@ -0,0 +1,5 @@ +--- +"svelte": patch +--- + +fix: enusre dev validation in dynamic component works as intended diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js index 2060364389..7a8f9660f4 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js @@ -671,6 +671,9 @@ function serialize_inline_component(node, component_name, context) { /** @type {import('estree').Identifier | import('estree').MemberExpression | null} */ let bind_this = null; + /** + * @type {import("estree").ExpressionStatement[]} + */ const binding_initializers = []; /** @@ -920,6 +923,8 @@ function serialize_inline_component(node, component_name, context) { }; } + const statements = [...snippet_declarations]; + if (node.type === 'SvelteComponent') { const prev = fn; @@ -930,6 +935,7 @@ function serialize_inline_component(node, component_name, context) { b.arrow( [b.id(component_name)], b.block([ + ...binding_initializers, b.stmt( context.state.options.dev ? b.call('$.validate_dynamic_component', b.thunk(prev(node_id))) @@ -939,10 +945,10 @@ function serialize_inline_component(node, component_name, context) { ) ); }; + } else { + statements.push(...binding_initializers); } - const statements = [...snippet_declarations, ...binding_initializers]; - if (Object.keys(custom_css_props).length > 0) { context.state.template.push( context.state.metadata.namespace === 'svg' diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/Test.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/Test.svelte new file mode 100644 index 0000000000..fddcf1803a --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/Test.svelte @@ -0,0 +1,3 @@ + diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/_config.js b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/_config.js new file mode 100644 index 0000000000..f9df7b78a9 --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/_config.js @@ -0,0 +1,11 @@ +import { test } from '../../test'; + +export default test({ + compileOptions: { + dev: true + }, + + test({ assert, component, target }) { + // Shouldn't error + } +}); diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/main.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/main.svelte new file mode 100644 index 0000000000..6b0fe3fe2b --- /dev/null +++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-component-this/main.svelte @@ -0,0 +1,7 @@ + + +