-
-
Notifications
You must be signed in to change notification settings - Fork 8.2k
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
App instance cannot render inside larger SVG #2926
Labels
🍰 p2-nice-to-have
Priority 2: this is not breaking anything but nice to have it addressed.
🐞 bug
Something isn't working
Comments
It's caused by runtime bug, not compiler. Here's the reproduction with render functions: |
We should avoid checking whether an element is SVG in |
posva
added
🐞 bug
Something isn't working
🍰 p2-nice-to-have
Priority 2: this is not breaking anything but nice to have it addressed.
labels
Jan 4, 2021
yyx990803
pushed a commit
that referenced
this issue
Mar 1, 2021
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Labels
🍰 p2-nice-to-have
Priority 2: this is not breaking anything but nice to have it addressed.
🐞 bug
Something isn't working
Version
3.0.5
Reproduction link
https://codepen.io/hisrootness/pen/GRjxNzL
Steps to reproduce
createApp
to encapsulate a<g>
element with children representing SVG shapes.<svg>
element.What is expected?
The nodes added by Vue app to the parent SVG image should be instances of
SVGElement
and should be able to affect the drawing.What is actually happening?
The app nodes are added to DOM, but they are not instances of
SVGElement
and they don't draw anything on the parent SVG image.In Vue2 I was able to add my component to existing SVG image (not created by Vue). In Vue3 SVG rendering only seems to work when the
<svg>
element itself is rendered by the Vue instance.Here is example when the drawing works (the only difference from repro is that
id="app"
is above the<svg>
element instead on it):https://codepen.io/hisrootness/pen/MWjVbLJ
And here is an example showing that it used to work in Vue 2:
https://jsfiddle.net/hisrootness/7nkob98v/1/
The text was updated successfully, but these errors were encountered: