gilbarbara / react-joyride

Create guided tours in your apps
https://react-joyride.com/
MIT License
6.62k stars 519 forks source link

Invalid selector errors are not catched #1035

Open bcalou opened 1 month ago

bcalou commented 1 month ago

Hi and thanks for your work!

🐛 Bug Report

When using a "modern" CSS selector such as :has, older browser will fail to use document.querySelector, which is expected :

Uncaught DOMException: Document.querySelector: '.my-form__field:has(input#name)' is not a valid selector

However, the error is not catched and the whole app crashes (white page).

To Reproduce

Use the reproduction link below or : Try to select an element with a selector that your browser does not support. You can make up a selector that doesn't exist so it will fail regardless of the browser.

Expected behavior

I believe the error should be catched and the step (or tour) skipped. I think it may be a common mistake to think that the selector will fail silently (as they do when using CSS, but not when using querySelector).

Link to repl or repo (highly encouraged)

Try this tour : the second step should crash your page.

codesandbox

Thanks :)

gilbarbara commented 1 month ago

Hey @bcalou Thanks for your report. I've already fixed it in the #1036 PR. I'm waiting for a response to another issue, and I'll release it next week.