Skip to content

IE11 closest polyfill with SVG elements #2900

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.

Sign up for GitHub

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

Jump to bottom
Closed
Alex--C opened this issue Mar 22, 2019 · 3 comments · Fixed by #2901
Closed

IE11 closest polyfill with SVG elements #2900

Alex--C opened this issue Mar 22, 2019 · 3 comments · Fixed by #2901
Labels
Status: Confirmed Type: Bug

Comments

@Alex--C
Copy link

Alex--C commented Mar 22, 2019

Since IE11 does not support Element.prototype.closest, it falls back to the included polyfill. This polyfill fails if element happens to be an SVG since SVGs do not have the parentElement property in Internet Explorer. The polyfill then tries to access undefined.parentElement.

A possible fix would be to use parentNode instead of parentElement or check whether element is undefined in the do...while loop. I don't think that this would break anything, but I don't know enough about the inner workings of bootstrap-vue.
@Alex--C Alex--C changed the title IE11 closest polyfill with SVG elements IE11 closest polyfill with SVG elements Mar 22, 2019
@tmorehouse
Copy link
Member

You could pre-load a more robust polyfill at the top of your project, and the helper utility closest will use that version of the polyfill.

Using parentNode might break when encountering text nodes and other non HTML Element nodes.

@tmorehouse
Copy link
Member

tmorehouse commented Mar 22, 2019 •
edited
Loading

Although I do see the polyfill at MDN has been updated:

https://developer.mozilla.org/en-US/docs/Web/API/Element/closest#Polyfill

And they fallback using el = el.parentElement || el.parentNode

We can update our "polyfill" (which isn't really a polyfill, as we don't override the prototype) to use the latest polyfill example from MDN.

@tmorehouse
Copy link
Member

tmorehouse commented Mar 22, 2019 •
edited
Loading

@Alex--C do you know if on IE 11 if an <svg> element satisfies the following?

svg.nodeType === Node.ELEMENT_NODE // Node type === 1

@tmorehouse tmorehouse mentioned this issue Mar 22, 2019
Merged
18 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Status: Confirmed Type: Bug
Projects
None yet
Milestone
No milestone
3 participants
@jacobmllr95 @tmorehouse @Alex--C