Grid Helper Dense Mode does not work with productive build

[timomeinen]

Describe the bug

The dense mode does not work in production mode. Maybe the styles are not bundled when the production bundle is created?

Expected behavior

No response

Minimal reproducible example

No response

Add-on Version

2.0.0

Vaadin Version

25

Additional information

No response

[mlopezFC]

Hi @timomeinen !
Dense mode seems to be working on our demo application that is actually deployed in production mode.
Can you try creating a new small sample application, integrate the add-on, copy the demos and then run it in production mode? .. if it works, compare it to your application to spot significant differences, if it doesn't attach the sample project here so we can take a look.
Thanks!

[timomeinen]

Hi @mlopezFC,

please find a small example of the problem here: https://github.com/timomeinen/grid-helpers-issue-171

I have just added a checkbox of the DENSE mode to the start.vaadin.com demo application.

I remember I had a similar issue with a different plugin and solved it by manually referencing the JS via Annotation to force it being packed into the prod.bundle. Here also the vaadin:build-frontend does not pickup the dependency and says, no bundle is needed:

[INFO] --- vaadin:25.0.7:build-frontend (default-cli) @ app ---
[INFO] Reflections took 725 ms to scan 118 urls, producing 5125 keys and 20651 values
[INFO] Scanning classes to find frontend configurations and dependencies...
[INFO] Visited 1255 classes. Took 1006 ms.
[INFO] Checking if a production mode bundle build is needed
[INFO] A production mode bundle build is not needed

A production mode bundle build is not needed

[timomeinen]

The problem is that GridHelper is not recognized as Vaadin Component by the vaadin-maven-plugin and thus it does not recognize the @CssImport(value = "./fcGridHelper/vaadin-menu-bar.css", themeFor = "vaadin-menu-bar"). The result is that the CSS is missing in the bundle:

❯ grep "fcGridHelper/vaadin-menu-bar.css" target/classes/META-INF/VAADIN/config/stats.json

In contrast the dev mode bundle has the required file:

❯ grep "fcGridHelper/vaadin-menu-bar.css" target/dev-bundle/config/stats.json

  "Frontend/generated/jar-resources/fcGridHelper/vaadin-menu-bar.css",
  "fcGridHelper/vaadin-menu-bar.css": "6d32eb58d19bd3dc5a606b217e67b7b358cca3d4eb55ed06b38c57e48fdeb9be",

I tried to use com.vaadin.flow.component.dependency.Uses to give Vaadin a hint to include Grid-Helpers StyleSheets and JavaScript dependencies, but as GridHelper is not a com.vaadin.flow.component.Component it does not work:

@Uses(GridHelper.class) // Compile error as GridHelper is not instanceof Component

Instead, when we force bundling by disabling the byte-code scanner with <optimizeBundle>false</optimizeBundle>, it works:

<plugin>
    <groupId>com.vaadin</groupId>
    <artifactId>vaadin-maven-plugin</artifactId>
    <version>${vaadin.version}</version>
    <configuration>
        <optimizeBundle>false</optimizeBundle>
    </configuration>
    <executions>
        <execution>
            <goals>
                <goal>build-frontend</goal>
            </goals>
        </execution>
    </executions>
</plugin>

This will add the files to the prod bundle:

❯ grep "fcGridHelper/vaadin-menu-bar.css" target/classes/META-INF/VAADIN/config/stats.json
  "Frontend/generated/jar-resources/fcGridHelper/vaadin-menu-bar.css",
  "fcGridHelper/vaadin-menu-bar.css": "6d32eb58d19bd3dc5a606b217e67b7b358cca3d4eb55ed06b38c57e48fdeb9be",

But this is not ideal as the prod bundle will now be unneccassary big.

[timomeinen]

Note: adding the CSS import to my own view, works as well of course:

@CssImport(value = GridHelper.GRID_STYLES, themeFor = "vaadin-grid")

[javier-godoy]

Hello. Did you add com.flowingcode to whitelisted-packages?

https://github.com/FlowingCode/GridHelpers?tab=readme-ov-file#special-configuration-when-using-spring