[Webkit-unassigned] [Bug 231054] Implement CSSStyleSheet ReplaceSync() Functionality

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=231054

serapath <a.praetorius at serapath.de> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |a.praetorius at serapath.de

--- Comment #5 from serapath <a.praetorius at serapath.de> ---
I was very surprised this web standard seems to work everywhere but Safari.

https://caniuse.com/mdn-api_cssstylesheet_replacesync

My company uses it in combination with 


const sheet = new CSSStyleSheet()
sheet.replaceSync(css)
const shadow = el.attachShadow({ mode: 'closed' })
shadow.adoptedStyleSheets = [sheet]


to create re-usable components that can be themed and even though the components were created in different contexts by different developers, the default css of each component will never clash with the css of other components.

Previously we had to either stricly follow conventions like BEM

Or we had to emply css-in-js libraries which prefix or postfix every selector with some sort of short hash to make sure it is unique and doesn't clash.

The technique above allows us to not bother anymore with conventions like BEM which work but require a lot of discipline on the side of developers and we also do not need to use css-in-js libraries anymore.

Please consider supporting this feature soon :-)

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220808/c4f32aee/attachment.htm>