[🐞] Option-click not working to open source - DX

[rapporian]

Which component is affected?

Qwik Runtime

Describe the bug

Option-click in dev mode is not working to automatically open the source which makes the DX difficult to quickly navigate. There appears to be a leading slash (/) that prevents VSCode from opening to the file. Manually removing this %2F resolves auto-open.

http://localhost:5173/__open-in-editor?file=%2Fsrc%2Froutes%2Ffoo%2Fbar.tsx%3A307%3A9

Reproduction

qwik.new

Steps to reproduce

Build project, option-click on a DIV.

System Info

System:
    OS: macOS 15.1.1
    CPU: (16) arm64 Apple M4 Max
    Memory: 1.87 GB / 128.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.18.1 - ~/.nvm/versions/node/v20.18.1/bin/node
    npm: 10.8.2 - ~/.nvm/versions/node/v20.18.1/bin/npm
    pnpm: 9.8.0 - ~/Library/pnpm/pnpm
    bun: 1.1.33 - /opt/homebrew/bin/bun
  Browsers:
    Chrome: 131.0.6778.109
    Edge: 131.0.2903.86
    Safari: 18.1.1

Additional Information

Cc: @wmertens - per conversation regarding DX, capturing issue here.

[gioboa]

Hi @srapport I tested "open source" feature on my Mac and Linux and in both cases it's doing an HTTP call with the full path (from the root of my system) 🤔

[wmertens]

@gioboa look in the html source to check that all components have a full path for their data-qwik-inspector attribute. I'm looking at a codebase where that's not the case 🤔

[wmertens]

ok what's happening is that the qwikVite plugin is passing a relative path like src/root.tsx to the optimizer and the optimizer adds a / in front. That path is used for the click-to-component so it doesn't find it.

I'll see if I can remove that processing.

[gioboa]

@wmertens I tried with the starter and the path used was a full path. Let me know if you need more info

[rapporian]

Thank you @gioboa & @wmertens. Wout, ping me if you don't see this on the dev build.

[wmertens]

I found the issue and an looking at ways to fix it