[V20] Duplicate Lumo version when using npm

web-padawan commented 3 years ago

Description of the bug / feature

When using npm for Vaadin 20, some transitive dependencies are not locked (in particular, vaadin-overlay). This causes duplicates as soon as a newer alpha of the web components is released from the monorepo.

Minimal reproducible example

Here is how to reproduce the issue:

download a V20 project from start.vaadin.com
update version in pom.xml to 20.0.0.alpha5
run with mvn spring-boot:run
add vaadin.pnpm.enable = false
run rm -rf node_modules target
run with mvn spring-boot:run

Uncaught (in promise) DOMException: Failed to execute 'define' on 'CustomElementRegistry': the name "vaadin-lumo-styles" has already been used with this registry
    at eval (webpack-internal:///../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/version.js:14:16)
    at Module.../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/version.js (http://localhost:8080/VAADIN/build/vaadin-0-c4994e564f66ab02f796.cache.js:3549:1)
    at __webpack_require__ (http://localhost:8080/VAADIN/build/vaadin-bundle-1882670d596991653229.cache.js:64:30)
    at eval (webpack-internal:///../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/color.js:6:69)
    at Module.../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/color.js (http://localhost:8080/VAADIN/build/vaadin-0-c4994e564f66ab02f796.cache.js:3489:1)
    at __webpack_require__ (http://localhost:8080/VAADIN/build/vaadin-bundle-1882670d596991653229.cache.js:64:30)
    at eval (webpack-internal:///../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/mixins/overlay.js:4:67)
    at Module.../node_modules/@vaadin/vaadin-overlay/node_modules/@vaadin/vaadin-lumo-styles/mixins/overlay.js (http://localhost:8080/VAADIN/build/vaadin-0-c4994e564f66ab02f796.cache.js:3501:1)
    at __webpack_require__ (http://localhost:8080/VAADIN/build/vaadin-bundle-1882670d596991653229.cache.js:64:30)
    at eval (webpack-internal:///../node_modules/@vaadin/vaadin-overlay/theme/lumo/vaadin-overlay-styles.js:3:102)```

Expected behavior

All the Vaadin components should use the consistent version (in this case 20.0.0-alpha2)

Actual behavior

Pinned components use a fixed version (e.g. 20.0.0-alpha2) but their transitive dependencies might use newer versions when available (e.g. 20.0.0-alpha3) causing duplicates and conflicts.

Versions:

Vaadin / Flow version: 20.0.0.alpha5 / Flow 7 alpha

pleku commented 3 years ago

So to fix this and keep consistent builds (not using ^ and let npm pick newer versions), could we just read all the versions from e.g. https://github.com/vaadin/vaadin-core-shrinkwrap/blob/master/npm-shrinkwrap.json or from vaadin_versions.json ?

as soon as a newer alpha

Is this only a problem for prereleases ? I understood based on earlier discussion that it is the same for stable versions, but need to clarify @web-padawan

web-padawan commented 3 years ago

Yes, if all the versions for transitive dependencies from that JSON file are pinned in package.json including vaadin-overlay, vaadin-element-mixin etc for example to 20.0.0-alpha1 then a newer version will not be installed.

I tested this locally with a basic npm project and got a flat tree without duplicates using the following versions:

package.json

``` { "name": "test", "private": true, "dependencies": { "@polymer/iron-a11y-announcer": "^3.0.2", "@polymer/iron-a11y-keys-behavior": "^3.0.1", "@polymer/iron-fit-behavior": "^3.0.2", "@polymer/iron-flex-layout": "^3.0.1", "@polymer/iron-icon": "^3.0.1", "@polymer/iron-iconset-svg": "^3.0.1", "@polymer/iron-list": "^3.1.0", "@polymer/iron-media-query": "^3.0.1", "@polymer/iron-meta": "^3.0.1", "@polymer/iron-overlay-behavior": "^3.0.3", "@polymer/iron-resizable-behavior": "^3.0.1", "@polymer/iron-scroll-target-behavior": "^3.0.1", "@webcomponents/shadycss": "^1.9.6", "@vaadin/vaadin-accordion": "20.0.0-alpha1", "@vaadin/vaadin-app-layout": "20.0.0-alpha1", "@vaadin/vaadin-avatar": "20.0.0-alpha1", "@vaadin/vaadin-button": "20.0.0-alpha1", "@vaadin/vaadin-checkbox": "20.0.0-alpha1", "@vaadin/vaadin-combo-box": "20.0.0-alpha1", "@vaadin/vaadin-context-menu": "20.0.0-alpha1", "@vaadin/vaadin-control-state-mixin": "20.0.0-alpha1", "@vaadin/vaadin-custom-field": "20.0.0-alpha1", "@vaadin/vaadin-date-picker": "20.0.0-alpha1", "@vaadin/vaadin-date-time-picker": "20.0.0-alpha1", "@vaadin/vaadin-details": "20.0.0-alpha1", "@vaadin/vaadin-development-mode-detector": "^2.0.4", "@vaadin/vaadin-dialog": "20.0.0-alpha1", "@vaadin/vaadin-element-mixin": "20.0.0-alpha1", "@vaadin/vaadin-form-layout": "20.0.0-alpha1", "@vaadin/vaadin-grid": "20.0.0-alpha1", "@vaadin/vaadin-icons": "20.0.0-alpha1", "@vaadin/vaadin-item": "20.0.0-alpha1", "@vaadin/vaadin-list-box": "20.0.0-alpha1", "@vaadin/vaadin-list-mixin": "20.0.0-alpha1", "@vaadin/vaadin-login": "20.0.0-alpha1", "@vaadin/vaadin-lumo-styles": "20.0.0-alpha1", "@vaadin/vaadin-material-styles": "20.0.0-alpha1", "@vaadin/vaadin-menu-bar": "20.0.0-alpha1", "@vaadin/vaadin-messages": "20.0.0-alpha1", "@vaadin/vaadin-notification": "20.0.0-alpha1", "@vaadin/vaadin-ordered-layout": "20.0.0-alpha1", "@vaadin/vaadin-overlay": "20.0.0-alpha1", "@vaadin/vaadin-progress-bar": "20.0.0-alpha1", "@vaadin/vaadin-radio-button": "20.0.0-alpha1", "@vaadin/router": "^1.7.4", "@vaadin/vaadin-select": "20.0.0-alpha1", "@vaadin/vaadin-split-layout": "20.0.0-alpha1", "@vaadin/vaadin-tabs": "20.0.0-alpha1", "@vaadin/vaadin-text-field": "20.0.0-alpha1", "@vaadin/vaadin-themable-mixin": "20.0.0-alpha1", "@vaadin/vaadin-time-picker": "20.0.0-alpha1", "@vaadin/vaadin-upload": "20.0.0-alpha1", "@vaadin/vaadin-usage-statistics": "^2.1.0" } } ```

vaadin-bot commented 3 years ago

This ticket/PR has been released with platform 20.0.0.beta2. For prerelease versions, it will be included in its final version.

pleku commented 3 years ago

@web-padawan WDYT could this issue reproduce in Vaadin 14-series too ? The related Flow fix has not been backported yet but it seems to be stable.

web-padawan commented 3 years ago

I would say in theory this problem could also happen in Vaadin 14 if we make a patch release of vaadin-overlay. But unlike in the monorepo, we don't bump versions for individual components on every transitive dependency release.

So the fix probably should be backported to prevent such cases, although I'm not sure if this ever happens.

vaadin-bot commented 3 years ago

This ticket/PR has been released with platform 14.7.0.beta1 and is also targeting the upcoming stable 14.7.0 version.

vaadin / flow