Skip to content

Commit b92fe79

Browse files
Rich-Harrisdummdidummbrunnerh
authored
docs: add note on stricter attribute syntax (#12988)
closes #12910 --------- Co-authored-by: Simon H <[email protected]> Co-authored-by: brunnerh <[email protected]>
1 parent b4382e4 commit b92fe79

File tree

1 file changed

+17
-0
lines changed

1 file changed

+17
-0
lines changed

sites/svelte-5-preview/src/routes/docs/content/03-appendix/02-breaking-changes.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -244,6 +244,23 @@ When using `onwheel`, `onmousewheel`, `ontouchstart` and `ontouchmove` event att
244244

245245
In the very rare cases that you need to prevent these event defaults, you should use [`on`](https://svelte-5-preview.vercel.app/docs/imports#svelte-events) instead (for example inside an action).
246246

247+
### Attribute/prop syntax is stricter
248+
249+
In Svelte 4, complex attribute values needn't be quoted:
250+
251+
<!-- prettier-ignore -->
252+
```svelte
253+
<Component prop=this{is}valid />
254+
```
255+
256+
This is a footgun. In runes mode, if you want to concatenate stuff you must wrap the value in quotes:
257+
258+
```svelte
259+
<Component prop="this{is}valid" />
260+
```
261+
262+
Note that Svelte 5 will also warn if you have a single expression wrapped in quotes, like `answer="{42}"` — in Svelte 6, that will cause the value to be converted to a string, rather than passed as a number.
263+
247264
## Other breaking changes
248265

249266
### Stricter `@const` assignment validation

0 commit comments

Comments
 (0)