useStyles$, useStylesScoped$: style "literal strings" are not hot-reloaded even though page refreshes

[jmmon]

Qwik Version

0.9.0

Operating System (or Browser)

Windows, Edge

Node Version (if applicable)

16.16.0

Which component is affected?

Qwik Rollup / Vite plugin

Expected Behaviour

Expected styles to update when changing them in the code, i.e.:

useStylesScoped$(`
.header {
    font-size: 2rem;
    background: orange; // adding/removing/changing this, for example
}
`);

Actual Behaviour

The page refreshes but the change is (usually) not reflected in the browser:

Somewhat rarely, the page refreshes twice, once on code change and second when I click an interaction/button, and this seems refetch the styles (and everything) and so the changes do happen correctly. But usually, this is not the case.

Additional Information

Also affects useStyles$().

Doesn't seem to affect when using a separate .css file e.g. useStyles$(styles), so if I move the css to a file and import it it updates on change as expected.

Seems to affect the playground as well, try changing the color or background and it (usually) doesn't apply the changes: https://tinyurl.com/4v6c8btt (playground link, just used a shortener because of the crazy long URL)

[ramsaylanier]

I'm seeing something similar to this using 0.12.1.

When using useStyleScoped$ and an external .css file, I'm not seeing updates when I add classes to my css. Im importing css like so:

import styles from "./file.css?inline";

(without using inline works and I see hot updates, but it also imports the CSS globally).

In order for my changes to show up I have to actually restart the dev server.

EDIT for clarity: I'm seeing updates when I remove a class. But if I add the class back, the updates do not show. For reference, this is the CSS that is being added and removed:

.container{
  text-align: center;
}

[manucorporat]

Soon to be fixed with https://github.com/BuilderIO/qwik/pull/1972