diff --git a/.changeset/orange-ants-greet.md b/.changeset/orange-ants-greet.md new file mode 100644 index 0000000000..6f7c684fee --- /dev/null +++ b/.changeset/orange-ants-greet.md @@ -0,0 +1,5 @@ +--- +'svelte': minor +--- + +feat: allow use of createContext when instantiating components programmatically diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js index c76f0b1ce7..c09f5fdd05 100644 --- a/packages/svelte/src/internal/client/render.js +++ b/packages/svelte/src/internal/client/render.js @@ -208,11 +208,9 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro pending: () => {} }, (anchor_node) => { - if (context) { - push({}); - var ctx = /** @type {ComponentContext} */ (component_context); - ctx.c = context; - } + push({}); + var ctx = /** @type {ComponentContext} */ (component_context); + if (context) ctx.c = context; if (events) { // We can't spread the object or else we'd lose the state proxy stuff, if it is one @@ -241,9 +239,7 @@ function _mount(Component, { target, anchor, props = {}, events, context, intro } } - if (context) { - pop(); - } + pop(); } ); diff --git a/packages/svelte/src/internal/server/renderer.js b/packages/svelte/src/internal/server/renderer.js index 4da0b05cfd..17899899ae 100644 --- a/packages/svelte/src/internal/server/renderer.js +++ b/packages/svelte/src/internal/server/renderer.js @@ -611,18 +611,14 @@ export class Renderer { renderer.push(BLOCK_OPEN); - if (options.context) { - push(); - /** @type {SSRContext} */ (ssr_context).c = options.context; - /** @type {SSRContext} */ (ssr_context).r = renderer; - } + push(); + if (options.context) /** @type {SSRContext} */ (ssr_context).c = options.context; + /** @type {SSRContext} */ (ssr_context).r = renderer; // @ts-expect-error component(renderer, options.props ?? {}); - if (options.context) { - pop(); - } + pop(); renderer.push(BLOCK_CLOSE); diff --git a/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/Child.svelte b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/Child.svelte new file mode 100644 index 0000000000..3e39d5043e --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/Child.svelte @@ -0,0 +1,7 @@ + + +

{message}

diff --git a/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/_config.js b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/_config.js new file mode 100644 index 0000000000..f4374c8759 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/_config.js @@ -0,0 +1,8 @@ +import { test } from '../../test'; + +export default test({ + ssrHtml: `
`, + html: `

hello

`, + + test() {} +}); diff --git a/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/main.svelte b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/main.svelte new file mode 100644 index 0000000000..3c42dbf180 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/create-context-programmatic/main.svelte @@ -0,0 +1,20 @@ + + +
{ + mount(Wrapper(Child), { target }); +}}>