I have a web component that requires to re-use external stylesheet.
Reading: https://web.dev/constructable-stylesheets/, which was recently updated, it says:
Gotchas
In earlier versions of the specification, replace() allowed @import rules and returned a Promise that resolved when these were finished loading. This feature was removed from the specification and @import rules are ignored with a warning as of Chrome 84.
MDN confirms this for both replace and replaceSync:
Note: If any of the rules passed in text are an external stylesheet imported with the @import rule, those rules will be removed, and a warning printed to the console.
All the material I read says do it like this (the depreciated method):
sheet.replaceSync('@import url("styles.css");');
// or
sheet.replace('@import url("styles.css");');
I can find multiple issues talking about removing this feature, without proposing how one is supposed to do it instead, e.g.: https://groups.google.com/a/chromium.org/g/blink-dev/c/RKG8oxp22RY/m/fdFnG1rGCgAJ?pli=1
So how does one create a constructable-stylesheet from an external file?
