Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unwanted detection of SVG elements in foreign namespace #6257

Closed
halfnelson opened this issue Apr 28, 2021 · 2 comments
Closed

Unwanted detection of SVG elements in foreign namespace #6257

halfnelson opened this issue Apr 28, 2021 · 2 comments

Comments

@halfnelson
Copy link
Contributor

halfnelson commented Apr 28, 2021

Describe the bug
When using a foreign namespace, svelte is detecting some elements as SVG which changes is handling of the elements including lower casing the attributes. Expected behaviour would be to skip special SVG handling when in a foreign namespace.

This has hit svelte-nodegui which has an element called 'view' which is triggering svelte to place it in the SVG namespace and force attributes to match SVG case ( nodegui/svelte-nodegui#43 )

<svelte:options namespace="foreign" />
<window>
    <view class="vertical">
	window_1 = document.createElementNS("https://svelte.dev/docs#svelte_options", "window");
	view2 = svg_element("view");
	view0 = svg_element("view");
	text0 = svg_element("text");

To Reproduce

REPL: https://svelte.dev/repl/a64f21f99f3d48de992a731a76818c32?version=3.37.0

Expected behavior
all elements should be treated as foreign namespace (unless they have an xmlns attribute)

Severity
This is blocking users of svelte-nodegui from using certain attributes like readOnly and wordWrap

@halfnelson
Copy link
Contributor Author

halfnelson commented Apr 28, 2021

https://github.com/sveltejs/svelte/blob/master/src/compiler/compile/nodes/Element.ts#L110 looks like the culprit

	if (!parent_element) {
		return explicit_namespace || (svg.test(element.name)
			? namespaces.svg
			: null);
	}

	if (svg.test(element.name.toLowerCase())) return namespaces.svg;
	if (parent_element.name.toLowerCase() === 'foreignobject') return null;

	return parent_element.namespace;

Top level elements get the explicit_namespace, but child elements get forced to svg if they match the svg element regex

@Conduitry
Copy link
Member

Your fix for this has been included in 3.38.0 - thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants