frend / frend.co

Frend — A collection of accessible, modern front-end components.
http://frend.co
MIT License
635 stars 25 forks source link

InnerHTML in open modal link. #100

Closed jeroenkampinga closed 7 years ago

jeroenkampinga commented 7 years ago

When I create a "a href" element to open the modal with innerHTML like a and I click on the link to open the modal it throws a JS error:

fr-dialogmodal.js?1480591233158:6 Uncaught TypeError: Cannot read property 'querySelectorAll' of null(…)

Link example:

<a href="#" class="js--modal-open" data-video-id="12345678" aria-controls="modal-video"> <span> Link title </span> </a>

Is it not possible to have a open-modal link with "span" or other elements inside? I've debugged the JS a bit and it looks like it's going wrong on line 121: let button = e.target;

When clicking on a link with inner elements the target is the "span" instead of the "a href", so it can't find the aria-controls.

Is there a fix for this?

thomasdigby commented 7 years ago

Yes, I think e.currentTarget should fix this, let me take a look today, hopefully should have a fix up later.

jeroenkampinga commented 7 years ago

Your solution fixes the problem for me, thanks!