[🐞] `Actual value for useContext() can not be found`, when using nested context provider components, that dynamically shows children using `<Slot/>`

[genki]

Which component is affected?

Qwik Runtime

Describe the bug

I found this issue when I am trying to write some abstract components acting as control flow such like <If/>, <Then/>

Here is what I wanted to do.

export default component$(() => {
  const users:User[] = [
    {name:"Foo"},
    {name:"Bar", age:40},
  ]
  return <div>
    {users.map((u,i) => {
      return <UserCtx user={u}>
        <div>
          <span>Name:</span><span><UserAttr attr="name"/></span>
          <IfUserAttr attr="age">
            <span>Age:</span><span><Then/></span>
          </IfUserAttr>
        </div>
      </UserCtx>
    })}
  </div>;
});

This is almost working but the <Then/> caused unexpected error that I have titled. While the detail is in the reproduction URL, it might be the dynamic conditional <Slot/> inside the multiple hierarchical context provider components is not treated nicely.

It may be relating to #3531

Reproduction

https://qwik.dev/playground/#f=7VdNS8NAEL37K0oOpYXFerAgaZMQBSEG9CCCEHIotoFiaaVNoRL2vztvdrOZxlj0pmAvm25m33y9nZlI0ozHV02mQF7VkEC16KbuHp8f9iXRWjXkFI81T09SjrP%2FhHYYcFBQs3w7KUzoP13yyLd9BNFneaMVbWyahnQwpdpEl3e%2B670u3jcF49HZiB%2ByNHevncX0Lu0R7gLlz64TAx6X5ZZMf9tNCSLuQHZbyzUVWsKJWgZZPHUG2%2BDUjCD9Xgz7zwwZXsqDdbp9h7EdDjxMCB7lx4knRYew84dOLAvI2wNAuSkPOCIucQVU7fPiQ0Q7MnaUF2uj4mmFoJu7D2IQgfRQqkPcjvUhgF2p%2BUEABxVip%2F0mKWnobDa6eZYKZK20hkuTWSjiJQNiTjpoVlgU1LLmpnRZV5Li9zpjZKjr0DzBQqd8%2BiqnSaEsRGRX3K%2FVSobL7Pf7ItUuQNSk1y1etZwQBgovkuKTBhv477SdJjw7Zm6Wk4KMa1nFNcO73Ww8reTO9WzrKVQQ%2F%2FKC3%2BSCw%2FiUMcIMek4D%2B2CwV0unEb9auL5OEA2qvRYl1uHY%2F%2FiUCe%2BhfzriZ7PDEMwqpCrwYKE3Cq2MBBAENKLkgCclaiUxOXasA6npxBw1oMJ0%2FpxzzcH6aDb0UNNqJP47%2B1%2Ft7B8

Steps to reproduce

Please visit the link above and it causes the error.

System Info

System:
    OS: macOS 14.6.1
    CPU: (8) arm64 Apple M2
    Memory: 57.00 MB / 24.00 GB
    Shell: 3.6.1 - /opt/homebrew/bin/fish
  Binaries:
    Node: 20.12.1 - /opt/homebrew/opt/node@20/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 10.5.0 - /opt/homebrew/opt/node@20/bin/npm
    pnpm: 9.11.0 - /opt/homebrew/bin/pnpm
    bun: 1.1.26 - ~/.bun/bin/bun
  Browsers:
    Chrome: 131.0.6778.205
    Safari: 17.6
  npmPackages:
    @builder.io/partytown: 0.10.2 => 0.10.2 
    @builder.io/qwik: workspace:^ => 1.10.0 
    @builder.io/qwik-city: workspace:^ => 1.10.0 
    typescript: 5.4.5 => 5.4.5 
    undici: * => 6.6.2 
    vite: 5.3.5 => 5.3.5

Additional Information

No response

[gioboa]

Thanks for your feedback. Can you check the behaviour with v2 please?

[genki]

@gioboa it also caused the error on v2. https://qwikdev-build-v2.qwik-8nx.pages.dev/playground/#f=7VdfS8MwEH%2Ffpxh5GB0Ep%2BBAu7WlCkIt6IMIQunDcCsMxyZrB5OS7%2B7dJU1utQ73IPhgX9Kml9%2F9%2B%2BUu4aQZj69cppC80pFAtugm759eHncV0Fo6crLXhqdHKUfZf8Z2GFBQsGb55qQwgW%2FY5JFv%2BghGn%2BS1Vmxj0zSEhSnUJti887L%2FtvjYFIQHayN6ydLc%2FrYWw7%2B0D7gLLH9mnGjwuKq2YPp7OQWIuAPZTi3XUGgBJ2oZZPBkD21Dp2YA6fdjtL%2BnyfBa7Y3T7T2M06En8IQgID9WPCk6hK0%2FsGJZoLxZgCi31R6XsE1cI6ryafBRRFkydpQXY6Ok0wpAu72PxAACqSFXh3E71IcB7ErNCQH0aoyd8l1S0tDarHXTWSrgtdIYzk0moYiGDBFz0AFnhUUBLWuuS5dxJSn%2BrjNaBroOnCdI6JhP3%2BU0KaSBiMyI%2B2u14uHS84MBS7UNEDTpdYtXLSeYgcyLpPiiwQT%2BJ23Hhack5mY5KMioltVUM8TdZiOU5DM3s62QWEH8y3P6kzMO2xsR7YbyDA7snreTS6sRn0a42U4oGtQ7xUosu1nRN15lwgfUPx3Ru54hCGIVpioQaKEYhUaGAzACalFwQHCJRkkMjh3qwNR0Yo4cKDO9uerpD%2BOjnlBDBaOWONbZL67Z3fWUzn5wp%2F3v67%2FR1z8B

[gioboa]

Thanks for checking, would you like to create a failing v2 test for this? You can take inspiration by this commit The v2 branch is build/v2

[GrandSchtroumpf]

Maybe try to call the context just after providing it. For example :

export default component$(() => {
  useContextProvider(MyContext, 'data');
  useContext(MyContext); // This makes sure the context is serialized during SSR when sent to the client
  return <Slot />
})

[wmertens]

simplified: https://qwikdev-build-v2.qwik-8nx.pages.dev/playground/#f=Q0o0JhZIEQVKuzqINKCDltp0vIIj%2FEtLgKlaB5E2kZiwZIo3xUGCJrmkwjMNGDbo6Rlug52GUmaaEtC5UA2eaaHApOBYUlIE0oUvmYI8AfQrKG1C9QILmTxcuiAqgNkaWGDbImc%2FsAuBZsANBquBpHmisg2W7As2U0dBXR1sLrBKBCZSSN0DaiWVgArEtMwKYOmXWQKVx2mGEbLTEI09G5BfwTENabrhy6OGlkitUFLyKErrdDSH0iKHAgA

The problem is that if the context value is falsy, it fails

maybe the nesting is a problem in v1 but not in v2