diff --git a/packages/playwright-ct-vue/registerSource.mjs b/packages/playwright-ct-vue/registerSource.mjs index 07ce5298f4..33bc74e731 100644 --- a/packages/playwright-ct-vue/registerSource.mjs +++ b/packages/playwright-ct-vue/registerSource.mjs @@ -188,7 +188,7 @@ function __pwWrapFunctions(slots) { for (const [key, value] of Object.entries(slots || {})) slotsWithRenderFunctions[key] = () => [value]; } else if (slots?.length) { - slots['default'] = () => slots; + slotsWithRenderFunctions['default'] = () => slots; } return slotsWithRenderFunctions; } diff --git a/tests/components/ct-vue-vite/src/components/SlotDefaultValue.vue b/tests/components/ct-vue-vite/src/components/SlotDefaultValue.vue new file mode 100644 index 0000000000..c5944a3f8a --- /dev/null +++ b/tests/components/ct-vue-vite/src/components/SlotDefaultValue.vue @@ -0,0 +1,3 @@ + diff --git a/tests/components/ct-vue-vite/tests/slots/slots.spec.js b/tests/components/ct-vue-vite/tests/slots/slots.spec.js index a33c9dac92..7d36d9733b 100644 --- a/tests/components/ct-vue-vite/tests/slots/slots.spec.js +++ b/tests/components/ct-vue-vite/tests/slots/slots.spec.js @@ -2,6 +2,7 @@ import { test, expect } from '@playwright/experimental-ct-vue'; import DefaultSlot from '@/components/DefaultSlot.vue'; import NamedSlots from '@/components/NamedSlots.vue'; import Button from '@/components/Button.vue'; +import SlotDefaultValue from "@/components/SlotDefaultValue.vue"; test('render a default slot', async ({ mount }) => { const component = await mount(DefaultSlot, { @@ -49,3 +50,13 @@ test('render a component with a named slot', async ({ mount }) => { await expect(component).toContainText('Main Content'); await expect(component).toContainText('Footer'); }); + +test('updating default slot should work', { annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32809' } }, async ({ mount }) => { + const slots = { default: 'foo' }; + + const component = await mount(SlotDefaultValue, { slots }); + await expect(component).toHaveText('foo'); + + await component.update({ slots }); + await expect(component).toHaveText('foo'); +}); diff --git a/tests/components/ct-vue-vite/tests/slots/slots.spec.ts b/tests/components/ct-vue-vite/tests/slots/slots.spec.ts index a33c9dac92..7d36d9733b 100644 --- a/tests/components/ct-vue-vite/tests/slots/slots.spec.ts +++ b/tests/components/ct-vue-vite/tests/slots/slots.spec.ts @@ -2,6 +2,7 @@ import { test, expect } from '@playwright/experimental-ct-vue'; import DefaultSlot from '@/components/DefaultSlot.vue'; import NamedSlots from '@/components/NamedSlots.vue'; import Button from '@/components/Button.vue'; +import SlotDefaultValue from "@/components/SlotDefaultValue.vue"; test('render a default slot', async ({ mount }) => { const component = await mount(DefaultSlot, { @@ -49,3 +50,13 @@ test('render a component with a named slot', async ({ mount }) => { await expect(component).toContainText('Main Content'); await expect(component).toContainText('Footer'); }); + +test('updating default slot should work', { annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/32809' } }, async ({ mount }) => { + const slots = { default: 'foo' }; + + const component = await mount(SlotDefaultValue, { slots }); + await expect(component).toHaveText('foo'); + + await component.update({ slots }); + await expect(component).toHaveText('foo'); +});