qwikifiers / qwikifiers/qwik-ui
[🐞] Accordion w/ useLocation on Qwik UI site
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 695
- Forks
- 142
- PR merge metrics
- No merged PRs in 30d
Description
Which package is affected?
Headless Kit
Describe the bug
import { component$ } from '@builder.io/qwik';
import { useLocation } from '@builder.io/qwik-city';
import { Accordion } from '@qwik-ui/headless';
export const DocsNavigation = component$(() => {
const location = useLocation();
return (
<Accordion.Root>
<Accordion.Item>
<Accordion.Trigger>trigger</Accordion.Trigger>
<Accordion.Content>
<ul class="flex flex-col gap-2">
{Array.from({ length: 5 }).map(() => {
const isLinkActive = location.url.pathname;
return <></>;
})}
</ul>
</Accordion.Content>
</Accordion.Item>
</Accordion.Root>
);
});
When using the above instead of what's currently in navigation-docs.tsx, we run into the following error:
10:46:02 PM [vite] Internal server error: Code(27): Missing Object ID for captured object
at createAndLogError (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:110:52)
at logErrorAndStop (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:61:15)
at qError (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:287:10)
at mustGetObjId (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5540:15)
at mapJoin (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5690:16)
at Module._pauseFromContexts (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5643:23)
at beforeClose (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/@builder.io/qwik/dist/server.mjs:520:30)
at /Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1274:20
at /Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1728:24
at async renderRoot$1 (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1273:3)
/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/@builder.io/qwik/dist/core.mjs:116
throw err;
^
Error: Code(27): Missing Object ID for captured object
at createAndLogError (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:110:52)
at logErrorAndStop (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:61:15)
at qError (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:287:10)
at mustGetObjId (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5540:15)
at mapJoin (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5690:16)
at Module._pauseFromContexts (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:5643:23)
at beforeClose (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/@builder.io/qwik/dist/server.mjs:520:30)
at /Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1274:20
at /Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1728:24
at async renderRoot$1 (/Users/jackshelton/dev/open-source/qwik-ui/node_modules/.pnpm/@builder.io+qwik@1.7.3_@types+node@20.12.12_sass@1.77.4_terser@5.31.1/node_modules/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1273:3)
Node.js v20.12.2
This seems to happen specifically on the qwik ui site, when the boolean is inside the first map, useLocation is used, and is inside the Accordion Content.
Reproduction
above
Steps to reproduce
I was unable to reproduce in an empty app, but directly in the Qwik UI site:
- copy the above code
- paste it into
navigation-docs.tsx - run
pnpm dev - navigate to the browser
System Info
System:
OS: macOS 14.5
CPU: (8) arm64 Apple M3
Memory: 202.36 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.12.2 - /usr/local/bin/node
npm: 10.5.0 - /usr/local/bin/npm
pnpm: 9.5.0 - /usr/local/bin/pnpm
bun: 1.1.7 - ~/.bun/bin/bun
Browsers:
Brave Browser: 125.1.66.118
Chrome: 127.0.6533.120
Safari: 17.5
npmPackages:
@builder.io/qwik: 1.7.3 => 1.7.3
@builder.io/qwik-city: 1.7.3 => 1.7.3
typescript: 5.4.5 => 5.4.5
undici: 5.28.4 => 5.28.4
vite: 5.2.11 => 5.2.11
Additional Information
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Qwik UI site's navigation-docs.tsx and reproduce the issue by running pnpm dev, then placing the reported useLocation and map inside Accordion.Content. Investigate the Qwik 1.7.3 rendering error and verify that the navigation renders without the “Missing Object ID for captured object” failure.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100