diff --git a/.changeset/twelve-suits-drive.md b/.changeset/twelve-suits-drive.md new file mode 100644 index 0000000000..de7390ae95 --- /dev/null +++ b/.changeset/twelve-suits-drive.md @@ -0,0 +1,5 @@ +--- +"svelte": patch +--- + +fix: Add data-* to svg attributes diff --git a/documentation/docs/02-template-syntax/02-basic-markup.md b/documentation/docs/02-template-syntax/02-basic-markup.md index 7656a599be..281790ac71 100644 --- a/documentation/docs/02-template-syntax/02-basic-markup.md +++ b/documentation/docs/02-template-syntax/02-basic-markup.md @@ -113,11 +113,12 @@ Text can also contain JavaScript expressions: > If you're using a regular expression (`RegExp`) [literal notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#literal_notation_and_constructor), you'll need to wrap it in parentheses. + ```svelte

Hello {name}!

{a} + {b} = {a + b}.

-
{/^[A-Za-z ]+$/.test(value) ? x : y}
+
{(/^[A-Za-z ]+$/).test(value) ? x : y}
``` ## Comments diff --git a/packages/svelte/elements.d.ts b/packages/svelte/elements.d.ts index ec450284c5..9a7e7b3aa8 100644 --- a/packages/svelte/elements.d.ts +++ b/packages/svelte/elements.d.ts @@ -1451,6 +1451,9 @@ export interface SVGAttributes extends AriaAttributes, DO yChannelSelector?: string | undefined | null; z?: number | string | undefined | null; zoomAndPan?: string | undefined | null; + + // allow any data- attribute + [key: `data-${string}`]: any; } export interface HTMLWebViewAttributes extends HTMLAttributes { diff --git a/packages/svelte/src/compiler/compile/nodes/Element.js b/packages/svelte/src/compiler/compile/nodes/Element.js index 3e31ff3305..187177dae4 100644 --- a/packages/svelte/src/compiler/compile/nodes/Element.js +++ b/packages/svelte/src/compiler/compile/nodes/Element.js @@ -531,7 +531,6 @@ export default class Element extends Node { this.name === 'option' || this.is_dynamic_element || this.tag_expr.dynamic_dependencies().length || - this.is_dynamic_element || component.compile_options.dev ) { this.parent.cannot_use_innerhtml(); // need to use add_location diff --git a/packages/svelte/test/helpers.js b/packages/svelte/test/helpers.js index 596086f986..b5ee539be8 100644 --- a/packages/svelte/test/helpers.js +++ b/packages/svelte/test/helpers.js @@ -100,7 +100,7 @@ export function show_output(cwd, options = {}) { }); } -const svelte_path = fileURLToPath(new URL('..', import.meta.url)).replace(/\\/g, '/'); +const svelte_path = fileURLToPath(new URL('..', import.meta.url).href).replace(/\\/g, '/'); const AsyncFunction = /** @type {typeof Function} */ (async function () {}.constructor);