react-flip-toolkit icon indicating copy to clipboard operation
react-flip-toolkit copied to clipboard

Published 20 hours ago • verified publisher icon aholachek

Flip id is not sanitized before being put in the data attribute

Open michal-rybinski-91 opened this issue 3 years ago • 2 comments

This leads to errors with query selector:

SyntaxError: Failed to execute 'querySelectorAll' on 'Element': '[data-flipper-id="0.62822"] [data-flip-id="Kontrolle "Nummer falsch" in Hubspot"]' is not a valid selector.

michal-rybinski-91 avatar Jul 30 '22 09:07 michal-rybinski-91

Thanks for making this issue! An easy workaround is to make sure your flip ids are valid data attributes. The next time I update the library I'll add some processing to check for spaces.

aholachek avatar Sep 03 '22 13:09 aholachek

Thank you for replying. Yeah, that's how I have resolved it. There is no build-in browser API for sanitizing string meant to be used in selectors, at least I didn't find it, so I ended up using some snippet from SO Would be nice for lib to do it, or at least mention in the doc that this id will be used as data attribute and passed to selector "as is".

michal-rybinski-91 avatar Sep 03 '22 14:09 michal-rybinski-91