Invalid RGB Value! - Breaks the theme generator in perpetuity

[A-iko]

Current Behavior

Hello there skeleton friends!

In my enthusiasm in messing around with the theme generator, I think i've managed to break it... Forever.
Mind you I haven't tried restarting my browser yet, but refreshing or clearing my cache doesn't seem to do the trick. My apologies if this isn't the correct repository to post this, but I couldn't find a repository containing the skeleton.dev website.

This bug will initially cause the theme generator to just, disappear.

Note: The button says "Quickstart", but this occurs after clicking on "Theme Generator". The button doesn't seem to update to the active page

After a refresh, the theme generator reappears but is unusable. None of the buttons respond.

Checking the console yields the following error:

Expected Behavior

I expect to be able to configure a new theme no matter the circumstances.

Steps To Reproduce

1. In the Theme Generator, make one of the colour values illegal (by, for example, removing the last character)
2. Navigate to a different page in the docs
3. Navigate back to the Theme Generator
4. Nothing works anymore :(
5. Refreshing the page brings the theme generator back, but it's still not functional.

Link to Reproduction / Stackblitz

N/A

More Information

Other than this, I think this is a fantastic repository. Being able to sketch out a nice looking website in record time really tickles my prototyping spirit! Thank you for your hard work.

[endigo9740]

@A-iko We've noted that sometimes the theme generator can get into a stuck state - you have two options:

1. Toggle it on and off again, this should reset it
2. If that doesn't work, open up and clear your local storage values for the store

The state for this feature is stored in local storage, so clearing that should restore you into a working state.

Please confirm and we'll close this out if this restores things for you.

[A-iko]

@endigo9740 The toggle doesn't work, but clearing local storage does seem to do the job. It seems that the components don't completely load due to the invalid value in the first place.

However, and I don't mean to impose anything, I feel like this is so easy to trigger (and not really trivial for the average website user to resolve) that this is something probably worth fixing. Especially since I think it shouldn't be hugely difficult. That's just my 2 cents though, if you disagree you can definitely close this report.

Thanks for your help!

[Mahmoud-zino]

Most likely we should only validate the color value before saving it to local storage...
@endigo9740 I would be happy to tackle this issue if you don't have other plans.

[A-iko]

Need be I could probably have a look at it too, if the site is open source somewhere :)

[endigo9740]

@Mahmoud-zino I'd appreciate you taking a look.

However, and I don't mean to impose anything, I feel like this is so easy to trigger (and not really trivial for the average website user to resolve) that this is something probably worth fixing. Especially since I think it shouldn't be hugely difficult. That's just my 2 cents though, if you disagree you can definitely close this report.

We have some plans in store for the theme generator, we're just working our way towards this. Any major reworks will come as part of this:

• NEXT: New Theme Generator #1142

[A-iko]

That makes sense, thank you for your time!

[Mahmoud-zino]

@A-iko

Need be I could probably have a look at it too, if the site is open source somewhere :)

everything skeleton related is open source 😉

I have already created a PR (#1745), you can test it if you want.