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

[🐞] useLocation URL searchParams is null #4956

Open
lbensaad opened this issue Aug 17, 2023 · 5 comments
Open

[🐞] useLocation URL searchParams is null #4956

lbensaad opened this issue Aug 17, 2023 · 5 comments
Labels
STATUS-2: team is working on this Scheduled for work by the core team TYPE: bug Something isn't working WAITING FOR: team Waiting for one of the core team members to review and reply

Comments

@lbensaad
Copy link
Contributor

lbensaad commented Aug 17, 2023

Which component is affected?

Qwik City (routing)

Describe the bug

Please note first that this bug appears only on SSG pages. It does not appear in dev mode.
using qwik v1.2.7. I have a page with parameters like ?id=7, when I use a Link to navigate to that page then const id = loc.url.searchParams.get('id') will correctly return the id '7' but when I reload/refresh the page or directly navigate to the page then It will return a null. While const id = new URLSearchParams(document.location.search).get("id") will correctly get the id '7'
This issue does not appear on pnpm dev mode, it works correctly. It appears only in SSG using pnpm build then serve the dist folder using http-server or nginx.

Add this code to file src/routes/index.tsx:

  const loc = useLocation();
  useVisibleTask$(()=>{
    const id1 = new URLSearchParams(document.location.search).get("id");
    const id2 = loc.url.searchParams.get("id");
    
    alert(`id1 = ${id1} vs id2 = ${id2}`);
  });

Add the adapter SSG: pnpm qwik add then select: Adapter: Static site (.html files)
Build the static html files with pnpm build then serve the dist folder with http-server ./dist
open the page giving it a parameter in the url like this http://localhost:8080/?id=7
you should get and alert with message: id1 = 7 vs id2 = 7
but you will get this alert message: id1 = 7 vs id2 = null

Reproduction

https://stackblitz.com/edit/qwik-starter-9umyqd

Steps to reproduce

run: pnpm i && pnpm build then http-server ./dist. After that open /?id=7

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (8) x64 Intel(R) Core(TM) i7-2670QM CPU @ 2.20GHz
    Memory: 4.31 GB / 15.59 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 19.7.0 - ~/.nvm/versions/node/v19.7.0/bin/node
    npm: 9.5.0 - ~/.nvm/versions/node/v19.7.0/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Firefox: 116.0.2
  npmPackages:
    @builder.io/partytown: latest => 0.8.0 
    @builder.io/qwik: latest => 1.2.7 
    @builder.io/qwik-city: latest => 1.2.7 
    vite: latest => 4.4.9

Additional Information

No response

@lbensaad lbensaad added STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working labels Aug 17, 2023
@stackblitz
Copy link

stackblitz bot commented Aug 17, 2023

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.

@haitaojarvis
Copy link

Met the exact same bug, hopefully some future minor release will fix this.

@gioboa gioboa added WAITING FOR: team Waiting for one of the core team members to review and reply STATUS-2: team is working on this Scheduled for work by the core team and removed STATUS-1: needs triage New issue which needs to be triaged labels Jun 17, 2024
@JerryWu1234
Copy link
Contributor

I can try this

@wmertens
Copy link
Member

wmertens commented Aug 5, 2024

Possibly related: #6753

@JerryWu1234
Copy link
Contributor

thank you for your tips

@JerryWu1234 JerryWu1234 mentioned this issue Aug 8, 2024
7 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
STATUS-2: team is working on this Scheduled for work by the core team TYPE: bug Something isn't working WAITING FOR: team Waiting for one of the core team members to review and reply
Projects
Status: Backlog
Development

No branches or pull requests

5 participants