chromaui / storybook-addon-pseudo-states

CSS pseudo-classes for Storybook
MIT License
89 stars 28 forks source link

DOMException: Failed to execute 'insertRule' on webkit rules #37

Closed brutus-law closed 8 months ago

brutus-law commented 2 years ago

Was trying out this plugin so I'm on version 1.15.1 but getting the following errors. "@storybook/react": "^6.5.9", DOMException: Failed to execute 'insertRule' on 'CSSStyleSheet': Failed to parse the rule 'body ::-webkit-scrollbar-thumb:hover, body ::-webkit-scrollbar-thumb.pseudo-hover, .pseudo-hover body ::-webkit-scrollbar-thumb { background: rgba(128, 135, 139, 0.8); }'.

DOMException: Failed to execute 'insertRule' on 'CSSStyleSheet': Failed to parse the rule '.custom-range::-webkit-slider-thumb:active, .custom-range::-webkit-slider-thumb.pseudo-active, .pseudo-active .custom-range::-webkit-slider-thumb { background-color: rgb(255, 230, 224); }'.

image image

github-actions[bot] commented 8 months ago

:rocket: Issue was released in v2.3.0-next.0 :rocket:

DmSor commented 6 months ago

Having the same problem with -webkit-datetime-edit-hour-field, -webkit-datetime-edit-minute-field, -webkit-datetime-edit-second-field. I think the issue is not solved.

ghengeveld commented 6 months ago

@m-akinc Did you consider these by any chance?

m-akinc commented 6 months ago

@m-akinc Did you consider these by any chance?

I hadn't looked for all the possible ::-webkit-* pseudo-elements, but doing so now, I'm not sure there's a reliable, comprehensive list. There are also quite a few, so I'd be inclined to just handle everything starting with ::-webkit- the same way. Probably should do the same for ::-moz-*, ::-ms-*, and ::-o-*, too. I can put up a PR for that in the next day or so.

Edit: it was simple, so I just put it up: #120