Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[🐞] Tagged function depending on condition of the signal value causes SSR error #7121

Open
genki opened this issue Dec 2, 2024 · 2 comments
Labels

Comments

@genki
Copy link
Contributor

genki commented Dec 2, 2024

Which component is affected?

Qwik Runtime

Describe the bug

May be relating to #6946

It causes SSR error if there is a tagged function in the JSX that is depending on a condition of the signal value like this:

    <div>{counter.value > 0 ? "hello" : t`world`}</div>

Where the counter is a signal number and the t is the tagged function.

Reproduction

https://qwikdev-build-v2.qwik-8nx.pages.dev/playground/#f=7VZNa8MwDP0rIvSQ0m7kti3QjG2wX7BbKXiwwGCDjHhjFOP%2F3mfJttyPQw89tNBbiCRLepafXjE0D%2Fd3h4ZmnlfunGQJyx%2F9ZKZL91Dt3lsFLAQEuL4OQ4CBWbwf27jUZVN0GZyoC5iSFzl97cKQKXS2fevBSXCS%2B7JP4%2Fi%2BzoekY776NQ6xy2YVgklXfu14f%2FsiIsXIllnIgo%2FzH2u%2Bxbv%2F66fRnWtcIsUK3mbi8OXphiaOvb1hNy%2FesW4NCfV4DJXC8wxWPBU8yNCK6CoaPMPmj%2BGdojCwuvTM2NQN9yz2ULTMWEKwMFoxAuEtY2I0eRkvojZ%2FVDdLL6lz6qihR%2Fo1n%2BFJGmrx%2BT%2BM3x%2FGZ%2B2cArMFAltNIp5VM7oD%2BM5mvmNz1trFsbauOHk13U8JG%2BeETZPitTM9X9n58th5Aw

Steps to reproduce

Please visit the link above and see the SSR error is happening.
If you remove the condition and just place sololy the tagged function, the error would not occur.

System Info

System:
    OS: macOS 14.6.1
    CPU: (8) arm64 Apple M2
    Memory: 83.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.86
    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

@genki genki added STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working labels Dec 2, 2024
@genki
Copy link
Contributor Author

genki commented Dec 9, 2024

Sometimes the reproduction doesn't see by error, so I paste the code here.
The line <div>{counter.value > 0 ? thello : tworld}</div> causes the SSR error.

import { component$, useStore, Signal, useSignal, useTask$ } from "@builder.io/qwik";

const useFoo = (counter:Signal<number>) => {
  const state = useStore({});
  return (s:TemplateStringsArray) => {
    const key = s[0];
    useTask$(({track}) => {
      const count = track(() => counter.value)
      state[key] = `${key} - ${count}`
    })
    return state[key];
  }
}

const useBar = (counter:Signal<number>) => {
  const state = useStore({});
  return (key:string) => {
    useTask$(({track}) => {
      const count = track(() => counter.value)
      state[key] = `${key} - ${count}`
    })
    return state[key];
  }
}

export default component$(() => {
  const counter = useSignal(0);
  const t = useFoo(counter);
  const s = useBar(counter);
  return <>
    Count up
    <div>{counter.value > 0 ? t`hello` : t`world`}</div>
    <div>{t`world`}!</div>
    <button onClick$={() => counter.value++}>Click</button>
    <div>{s("hello")}</div>
    <div>{s("world")}!</div>
  </>;
});

@wmertens wmertens added VERSION: upcoming major and removed STATUS-1: needs triage New issue which needs to be triaged labels Dec 9, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants