Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Svelte 4: $$props not working in customElement when setting properties with accessors #11289

Open
ls-bit opened this issue Apr 22, 2024 · 0 comments

Comments

@ls-bit
Copy link

ls-bit commented Apr 22, 2024

Describe the bug

Given a custom element component:

<svelte:options
    customElement={{
        tag: null,
    }}
/>

<script>
	export let name;
</script>

<p>$$props: {JSON.stringify($$props)}</p>
<p>$$restProps: {JSON.stringify($$restProps)}</p>

$$props and $$restProps do work when setting properties with attributes:

<ce-test name="name" other="other"></ce-test>

// output:
// $$props: {"name":"name","other":"other"}
// $$restProps: {"other":"other"}

$$props and $$restProps do not work when setting undeclared properties with accessors. Undeclared properties are missing:

const customElement = document.createElement('ce-test');
customElement.name = 'name';
customElement.other = 'other';

// output:
// $$props: {"name":"name"}
// $$restProps: {}

Related to #5482, #5608

Reproduction

https://github.com/ls-bit/svelte-ce-bug

Logs

No response

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12800H
    Memory: 4.74 GB / 31.68 GB
  Binaries:
    Node: 18.20.2 - ~\AppData\Local\Volta\tools\image\node\18.20.2\node.EXE
    Yarn: 4.0.0-rc.42 - ~\AppData\Local\Volta\tools\image\yarn\4.0.0-rc.42\bin\yarn.CMD
    npm: 10.5.0 - ~\AppData\Local\Volta\tools\image\node\18.20.2\npm.CMD
    pnpm: 8.15.6 - C:\Program Files\Volta\pnpm.EXE
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    svelte: ^4.2.15 => 4.2.15

Severity

annoyance

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant