Skip to content

Don't always stringify attrs #4440

Closed
@Crisfole

Description

@Crisfole

Is your feature request related to a problem? Please describe.

It's irritating that html elements being rendered with attrs get stringified when the value being passed them is falsey. Specifically in the null | undefined | false case. Currently null and undefined act as expected (they just skip the attr), but false gets serialized as "false" which is actually truthy.

<a {href} {download}>Download</a>

Describe the solution you'd like

Treat false like undefined and null are currently. Warn when a non-string value is being automatically stringified for an html element. You almost never want [Object object] in your html. You almost never want the elements of your array indiscriminately joined with commas in your html.

Describe alternatives you've considered
I can easily fix this by using {download || undefined} but I'd really rather not.

How important is this feature to you?
I don't think it's important to me personally because the fix is easy. I do think it's a gotcha that could affect adoption.

Additional context

Link.svelte

<script>
  export href;
  export let download = false;
</script>

<a {href} {download}>Download</a>

Consumer.svelte

<script>
  import Link from './Link.svelte'
</script>

<Link href='www.google.com'>Google</Link>
<Link href='https://www.youtube.com/watch?v=dQw4w9WgXcQ' download>Video</Link>

Above, the google link gets a download=false attr, and the video gets a download=true. In both cases they're considered download links. Even worse, passing download={false} still fails the same way.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions