Style hotswap breaks "external" / addon styles

[stefanuebe]

Description of the bug

I use an addon, that imports styles for a component via @Stylesheet. Initially the styles are loaded and applied correctly. When I now change something in the styles of my application (styles.css), Vaadin hotswaps the styles and unloads the addon style. I have to reload the page to make all styles being applied again.

Happens in SB (jar/war) and plain servlet.

Expected behavior

The addon styles should be kept untouched.

Minimal reproducible example

Addon

@StyleSheet("context://frontend/addon.styles.css")
public class AddonField extends TextField {
}

vaadin-text-field {
    color: red;
}

Place the addon.styles.css in your addon module under src/main/resources/META-INF/resources/frontend.

Demo

@SpringBootApplication
@StyleSheet("context://" + Lumo.STYLESHEET) // Use Aura.STYLESHEET to use Aura instead
@StyleSheet("context://" + Lumo.UTILITY_STYLESHEET) // Use Aura.STYLESHEET to use Aura instead
@StyleSheet("context://styles.css") // Your custom styles
public class Application implements AppShellConfigurator {

    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }
}

@Route("")
public class DefaultView extends VerticalLayout {

    public DefaultView() {
        AddonField field = new AddonField();
        field.setValue("Test");
        add(field);
    }
}

Use the default styles of the starter and add some content

html {
    background-color: white;
}

Reproduce

1. Start the application
2. You should see a text field with a red colored value "Test".
3. Edit the demo styles.css and remove the background color (or do something else, doesn't matter)
4. The textfield color should now be "default" black again.

Versions

• Vaadin / Flow version: 25.0.7
• Java version: OpenJdk 25.0.2
• OS version: Kubuntu 25
• Browser version (if applicable): Chrome
• Application Server (if applicable): SB Tomcat
• IDE (if applicable): Intellij IDEA

[mcollovati]

The problem seems to be that PublicResourcesLiveUpdater looks for stylesheet changes only in project resource folders, and if it does not find a physical file, it tells Flow to vaadin-dev-tools to update it with a null content, meaning to remove the CSS.

Probably we should also verify if the path corresponds to an existing classpath resource, and in that case just ignore it. Or maybe also check into frontend/generated/jar-resource.

[mcollovati]

There's also another little issue here: when Flow copies resources from JARs it relocates files into frontend folder to the generated/jar-resources root, causing a difference between @StyleSheet and @CssImport paths. The first annotation needs the frontend part, the second can skip it.
For example, src/main/resources/META-INF/resources/frontend/addon.styles.css is copied to src/main/fronted/generated/jar-resources/addon.styles.css.

For stylesheet, the container correctly resolves the path with fronted/, but a potential live reload of generated/jar-resources might have specific logic for frontend.