Menu Icons are not shown in production mode

vaadin / flow

Vaadin Flow is a Java framework binding Vaadin web components to Java. This is part of Vaadin 10+.

Apache License 2.0

618 stars 167 forks source link

Menu Icons are not shown in production mode #19536

Closed mshabarov closed 5 months ago

mshabarov commented 5 months ago

Description of the bug

Menu icons are not shown in the main menu in production mode, however they shown well in dev mode, see screenshot:

Prod mode Screenshot 2024-06-07 at 10 16 34

Dev mode Screenshot 2024-06-07 at 10 28 27

Expected behavior

Menu icons are shown

Minimal reproducible example

Checkout https://github.com/vaadin/flow-hilla-hybrid-example/pull/47 and run mvn spring-boot:run -Pproduction, then open localhost:8080, login with user/user, navigate to any Hilla view.

Versions

Vaadin / Flow version: 24.4.0.rc1

mshabarov commented 5 months ago

This seems to be an issue in Icon React component in Vaadin 24.4 pre-release.

I could reproduce the same with skeleton-starter-hilla-react and 24.4.0.rc1 by adding <Icon icon='vaadin:user'></Icon> to the @index.tsx.

This isn't an issue for web-component <vaadin-icon>, cannot reproduce with skeleton-starter-hilla-lit, nor with Hilla 2.5.

When used as a React wrapper, the <vaadin-icon> web-component doesn't have the SVG content in prod, but in dev it does:

Prod mode

Dev mode

mshabarov commented 5 months ago

It was a mistake in project's code. Icon and <vaadin-icon> (react and web components) need an explicit import of import '@vaadin/icons';. Proposed for closure, but additional clarification in the docs would be nice.