Skip to content

docs: order of attribute and props matter #15509

@sacrosanctic

Description

@sacrosanctic
Contributor

Describe the bug

<input
  {...rest}
  type="text"
/>
<input
  type="text"
  {...rest}
/>

These do not produce the same results and I don't see it documented in https://svelte.dev/docs/svelte/basic-markup or https://svelte.dev/docs/svelte/$props#Rest-props

I'm propose adding it to basic-markup and that addresses both elements and components.

Reproduction

REPL

Logs

System Info

.

Severity

annoyance

Activity

paoloricciuti

paoloricciuti commented on Mar 14, 2025

@paoloricciuti
Member

I think it is pretty intuitive but I'm not opposed to add a section to the docs

sacrosanctic

sacrosanctic commented on Mar 14, 2025

@sacrosanctic
ContributorAuthor

In vanilla HTML, the ordering does not matter. So it can be a hidden gotcha.

7nik

7nik commented on Mar 15, 2025

@7nik
Contributor

In vanilla JS, the ordering does matter. So it isn't so hidden.

let obj = { foo: 42 };
let a = {
  foo: 123,
  ...obj,
};
let b = {
  ...obj,
  foo: 123,
};

a and b will have different values in foo and the same applies to props.
But, yeah, there is nothing bad in reminding it in the docs and/or tutorial.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Participants

      @sacrosanctic@Conduitry@paoloricciuti@7nik

      Issue actions

        docs: order of attribute and props matter · Issue #15509 · sveltejs/svelte