bug: Dependency mismatch with certain libraries when hydrate output target about stencil

[rwaskiewicz]

Hey @zagnut007 👋

Thanks for the issue! Do you know of any previous versions of UUID where this did work by chance? Going back a few major versions of the library, I can reproduce this - unsure if this is from UUID getting newly pulled in by cypress or this was previously working on an older version of UUID.

Interestingly enough, this doesn't seem to reproduce on Node 20, but does on Node 18 🤔

[zagnut007]

I didn't try on any older versions of UUID. I am using version 12 of Cypress and everything is working. It's only upgrading to the next major version that introduces the collision.

[rwaskiewicz]

Gotcha, thanks! Would it possible to pull in a polyfill for crypto if you're stuck (I assume) on Node 18?

I'm going to label this to get in our backlog for someone to take a closer look

[christian-bromann]

It seems I am not able to reproduce this anymore. This even works for me with Node.js v16. I am also using Mac with an M2 chip and am getting:

❯ nvm use 18
Now using node v18.20.2 (npm v10.5.0)
❯ npm test

> [email protected] test
> stencil test --spec --e2e

[55:48.5]  @stencil/core
[55:48.7]  v4.12.4 🐮
[55:48.7]  testing e2e and spec files
[55:49.4]  build, example, dev mode, started ...
[55:49.5]  transpile started ...
[55:50.5]  transpile finished in 928 ms
[55:50.5]  copy started ...
[55:50.5]  generate custom elements + source maps started ...
[55:50.5]  generate hydrate app started ...
[55:50.5]  generate lazy + source maps started ...
[55:50.6]  copy finished (0 files) in 118 ms
[55:50.8]  generate custom elements + source maps finished in 309 ms
[55:51.0]  generate lazy + source maps finished in 505 ms
[55:51.0]  generate hydrate app finished in 506 ms
[55:51.0]  build finished in 1.65 s

[55:51.0]  jest args: --spec --e2e --max-workers=8
 FAIL  src/components/my-component/my-component.e2e.ts
  ● my-component › renders changes to the name data

    expect(received).toEqual(expected) // deep equality

    Expected: "Hello, World! I'm "
    Received: "Hello, World! I'm  afd57d48-f781-4c4d-bed2-8d74ca2c521f"

      16 |     const component = await page.find('my-component');
      17 |     const element = await page.find('my-component >>> div');
    > 18 |     expect(element.textContent).toEqual(`Hello, World! I'm `);
         |                                 ^
      19 |
      20 |     component.setProperty('first', 'James');
      21 |     await page.waitForChanges();

      at Object.<anonymous> (src/components/my-component/my-component.e2e.ts:18:33)

Compiling works too:

❯ node -v
v18.20.2
❯ npm run build

> example@0.0.1 build
> stencil build

[57:14.5]  @stencil/core
[57:14.7]  v4.12.4 🐮
[57:15.3]  build, example, prod mode, started ...
[57:15.3]  transpile started ...
[57:16.5]  transpile finished in 1.19 s
[57:16.5]  copy started ...
[57:16.5]  generate custom elements + source maps started ...
[57:16.5]  generate hydrate app started ...
[57:16.5]  generate lazy + source maps started ...
[57:16.6]  copy finished (0 files) in 102 ms
[57:17.0]  generate custom elements + source maps finished in 471 ms
[57:17.0]  generate hydrate app finished in 471 ms
[57:17.0]  generate lazy + source maps finished in 475 ms
[57:17.0]  build finished in 1.71 s

Anything I am missing?