GlobalHive / vuejs-tour

VueJS Tour is a lightweight, simple and customizable tour plugin. It provides a quick and easy way to guide your users through your application.
https://globalhive.github.io/vuejs-tour/
MIT License
83 stars 7 forks source link

Hide tour when selector is not found #48

Closed BayBreezy closed 8 months ago

BayBreezy commented 8 months ago

Hello @GlobalHive ,

Thanks for the package, really appreciate it.

I noticed that when a selector that does not exist in the DOM is add to a step(the starting step), an error is logged and the tour is displayed at the bottom corner of the web page.

This is the error logged in the browser

Uncaught TypeError: Cannot read properties of null (reading 'classList')

And then this is what it looks like in the bottom corner

image

Notice the page now overflows even tho i set it to be 100vh.

I fixed it by adding the correct selector but I thought it would be nice to let you know of this issue.

GlobalHive commented 8 months ago

Hello @BayBreezy If a selector is not found, it jumps to the next one.

If there is only one, then you're right. I'm going to add a security check and hide the element.

Sincerely, Sascha

BayBreezy commented 8 months ago

Thanks. Btw, I might make a module out of this package for nuxt.. I will make some changes to the code if that is alright with you. I saw the MIT license, just felt like giving a heads up :)

GlobalHive commented 8 months ago

Yeah no problem, just make sure to keep me in there 😅

BayBreezy commented 8 months ago

Hey @GlobalHive , I published the nuxt version.

https://nuxt-tour.behonbaker.com/ Repo: https://github.com/BayBreezy/nuxt-tour

GlobalHive commented 8 months ago

Hello @BayBreezy i just fixed your issue, i am going to push an update today. Now if there's no step, it goes to the next one until it just ends.

The errors will still be show in console so you know whats wrong. Sincerely, Sascha

BayBreezy commented 8 months ago

Thank you