Server: CSS variable polyfill doesn't work with vue-style-loader

[juliushaertl]

When migrating the firstrunwizard to vue, I recognized that any stylesheets included into the bundle with vue-style-loader will not be handled by the css variables polyfill. This is actually just an issue with IE11, where the polyfill is used.

I tried adding the watch option https://github.com/jhildenbiddle/css-vars-ponyfill#optionswatch but it doesn't seem to work.

For now I just ship the css as a separate file, since if loaded via it is actually polyfilled, but ideally it should also work with inlined styles from vue-style-loader, so ideas how we could solve that would be nice. @nextcloud/vue

[ChristophWurst]

My bad. I tested it but didn't notice something was broken.

Is it possible that the ponyfill is loaded too late?

[skjnldsv]

@juliushaertl strange, I remember having this talk with @rullzer on one of his _independent css file => vue scoped style pr_, and it was working :thinking:

Is it because of the new npm management of the deps?
Can you try just before the merge see if it was working?

[juliushaertl]

Just tried, it actually works with updatenotifications, so I must be doing something wrong. Maybe related to the asynchronous loading of the firstrunwizard javascript. I'll dig further ...

[rullzer]

@juliushaertl hacky idea. Can't we rerun the polyfill if on IE and loading a script async is done :P?

[skjnldsv]

@rullzer if we want to make ie unusable, better completely drop it then :p

[juliushaertl]

Never mind. My branch was having an outdated package-lock.json, therefore a different version of the polyfill was installed then mentioned in package.json, so watch wasn't available. All fine now.

[skjnldsv]

@ChristophWurst see, lockfiles are evil! :O

[ChristophWurst]

:innocent: