We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
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:element
disabled="false"
Using svelte:element results in boolean attributes being incorreclty set, or at least not like they would be set with propper elements.
Example (REPL with comparison to propper element)
<!-- SvelteElementButton --> <script> export let disabled = false; </script> <svelte:element {disabled} this={'button'} > <slot/> </svelte:element> <!-- App --> <SvelteElementButton> bla </SvelteElementButton> <!-- Renders --> <button disabled="false">bla</button> <!-- Expected --> <button disabled>bla</button>
In this case it disables the buttons because disabled="false" will still make the browser disable the button.
I also tried using require with input elements and it's the same there: https://svelte.dev/repl/55ddd8362fa04dad908f0877a60f3377?version=3.47.0
require
I then also tried using hidden with the button again and there it seems to work as expected: https://svelte.dev/repl/c8dd16ea3ebe4ff5aa8ddaca3db6ad34?version=3.47.0
hidden
A random thing I've found is using {...$$restProps} fixes it: https://svelte.dev/repl/7258278f483442bd9bcd64a6bec0d5ae?version=3.47.0
https://svelte.dev/repl/8c4f406ef863453cb7616cd5c0b796d7?version=3.47.0
No response
System: OS: macOS 12.3.1 CPU: (8) arm64 Apple M1 Pro Memory: 1.20 GB / 16.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node npm: 8.3.1 - ~/.nvm/versions/node/v16.14.0/bin/npm Browsers: Chrome: 100.0.4896.127 Firefox: 98.0.1 Safari: 15.4 npmPackages: svelte: ^3.47.0 => 3.47.0
annoyance
use disabled={disabled || null} instead
disabled={disabled || null}
The text was updated successfully, but these errors were encountered:
set_attributes
<svelte:element>
This should be fixed in 3.48.0 - https://svelte.dev/repl/8c4f406ef863453cb7616cd5c0b796d7?version=3.48.0
Sorry, something went wrong.
class:foo
Successfully merging a pull request may close this issue.
Describe the bug
Using
svelte:element
results in boolean attributes being incorreclty set, or at least not like they would be set with propper elements.Example (REPL with comparison to propper element)
In this case it disables the buttons because
disabled="false"
will still make the browser disable the button.I also tried using
require
with input elements and it's the same there: https://svelte.dev/repl/55ddd8362fa04dad908f0877a60f3377?version=3.47.0I then also tried using
hidden
with the button again and there it seems to work as expected:https://svelte.dev/repl/c8dd16ea3ebe4ff5aa8ddaca3db6ad34?version=3.47.0
A random thing I've found is using {...$$restProps} fixes it: https://svelte.dev/repl/7258278f483442bd9bcd64a6bec0d5ae?version=3.47.0
Reproduction
https://svelte.dev/repl/8c4f406ef863453cb7616cd5c0b796d7?version=3.47.0
Logs
No response
System Info
Severity
annoyance
Workaround
use
disabled={disabled || null}
insteadThe text was updated successfully, but these errors were encountered: