[🐞] React component hydrates even though it shouldn't

[jweb89]

Which component is affected?

Qwik Runtime

Describe the bug

When conditionally rendering any component and passing an object prop to another react component the react component gets hydrated when it should not.

Reproduction

https://stackblitz.com/edit/qwik-starter-xrdirb?file=src%2Fcomponents%2FButton.jsx,src%2Froutes%2Findex.tsx

Steps to reproduce

Click Button 1 See Button 3 hydrate when it shoudn't. The props are not changing and Button 3 hasn't been clicked.

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @builder.io/qwik: ^0.16.1 => 0.16.1 
    @builder.io/qwik-city: 0.0.118 => 0.0.118 
    @builder.io/qwik-react: 0.2.1 => 0.2.1 
    vite: 3.1.1 => 3.1.1

Additional Information

This seemed to happen we when updated from qwik 0.13.3 to 0.15.2. I marked this as qwik runtime because it happens on 0.15.2 or 0.16.2 of qwik while still being on qwik-react 0.2.1. If you downgrade to 0.13.3 qwik in stackblitz you can see it works as expected

[stackblitz[bot]]

Start a new pull request in StackBlitz Codeflow.

• qwik-starter-xrdirb (Open reproduction)

[manucorporat]

Well... i can see how this works this way, we could fix leveraging some metadata our optimizer generates about immutable props...

[jweb89]

That would be good. I found a work around by moving the conditional rendering to its own component but this was kind of an issue for us because we were using onClick events to wake up react buttons which caused modals to open by default. So all of the modals were opening as soon as one buttons was clicked.

[manucorporat]

Should be fixed already!