🐛 BUG: Multiple property spreads with class don't work properly with scoped CSS

[rafal-majewski]

What version of astro are you using?

1.0.0-rc.7

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

Linux

Describe the Bug

There is a problem with multiple property spreads like <div {...props1} {...props2} />. If the element is locally styled and the second props object contains a class entry then the class is not applied.

Reversing the order of props spreading works: <div {...props2} {...props1} /> produces the correct result.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/astro-multi-spread-props-problem

Participation

• [ ] I am willing to submit a pull request for this issue.

[natemoo-re]

Thanks for opening an issue!

We are doing some compiler magic behind the scenes to make scoped classes work with spread attributes, but I don't think we considered multiple spreads. It's totally valid, we just haven't implemented it yet.

As a workaround, you can always explicitly pass class since you know where it's coming from.