diff --git a/packages/svelte/src/internal/client/dom/template.js b/packages/svelte/src/internal/client/dom/template.js index 6ff3b0fa19a0..575bf55cf62b 100644 --- a/packages/svelte/src/internal/client/dom/template.js +++ b/packages/svelte/src/internal/client/dom/template.js @@ -252,6 +252,10 @@ export function append(anchor, dom) { let uid = 1; +export function reset_props_id() { + uid = 1; +} + /** * Create (or hydrate) an unique UID for the component instance. */ diff --git a/packages/svelte/tests/runtime-legacy/shared.ts b/packages/svelte/tests/runtime-legacy/shared.ts index e6dc0f385bf9..76036852c246 100644 --- a/packages/svelte/tests/runtime-legacy/shared.ts +++ b/packages/svelte/tests/runtime-legacy/shared.ts @@ -11,6 +11,7 @@ import { setup_html_equal } from '../html_equal.js'; import { raf } from '../animation-helpers.js'; import type { CompileOptions } from '#compiler'; import { suite_with_variants, type BaseTest } from '../suite.js'; +import { reset_props_id } from '../../src/internal/client/dom/template.js'; type Assert = typeof import('vitest').assert & { htmlEqual(a: string, b: string, description?: string): void; @@ -345,6 +346,7 @@ async function run_test_variant( if (runes) { props = proxy({ ...(config.props || {}) }); + reset_props_id(); if (manual_hydrate) { hydrate_fn = () => { instance = hydrate(mod.default, { diff --git a/packages/svelte/tests/runtime-runes/samples/props-id/_config.js b/packages/svelte/tests/runtime-runes/samples/props-id/_config.js index b40d1ce2997d..416ef6cfbea2 100644 --- a/packages/svelte/tests/runtime-runes/samples/props-id/_config.js +++ b/packages/svelte/tests/runtime-runes/samples/props-id/_config.js @@ -3,25 +3,57 @@ import { test } from '../../test'; export default test({ test({ assert, target, variant }) { - const ps = [...target.querySelectorAll('p')].map((p) => p.innerHTML); - const unique = new Set(ps); - assert.equal(ps.length, unique.size); - - if (variant === 'hydrate') { - const start = ps.map((p) => p.substring(0, 1)); - assert.deepEqual(start, ['s', 's', 's', 's']); + if (variant === 'dom') { + assert.htmlEqual( + target.innerHTML, + ` + +
c2
+c3
+c4
+ ` + ); + } else { + assert.htmlEqual( + target.innerHTML, + ` + +s2
+s3
+s4
+ ` + ); } let button = target.querySelector('button'); flushSync(() => button?.click()); - const ps_after = [...target.querySelectorAll('p')].map((p) => p.innerHTML); - const unique_after = new Set(ps_after); - assert.equal(ps_after.length, unique_after.size); - - if (variant === 'hydrate') { - const start = ps_after.map((p) => p.substring(0, 1)); - assert.deepEqual(start, ['s', 's', 's', 's', 'c']); + if (variant === 'dom') { + assert.htmlEqual( + target.innerHTML, + ` + +c2
+c3
+c4
+c5
+ ` + ); + } else { + assert.htmlEqual( + target.innerHTML, + ` + +s2
+s3
+s4
+c1
+ ` + ); } } }); diff --git a/packages/svelte/tests/runtime-runes/samples/props-id/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-id/main.svelte index a736ef60fa5c..646bb2ebdefe 100644 --- a/packages/svelte/tests/runtime-runes/samples/props-id/main.svelte +++ b/packages/svelte/tests/runtime-runes/samples/props-id/main.svelte @@ -8,7 +8,7 @@ -{id}
+