[✨] Remember the scroll position forward and not just backward

[williamsdyyz]

The latest comment give you the context.

Which component is affected?

Qwik Runtime

Describe the bug

I'm trying to show dialog boxes based on a search param like
<Link href="./?dialog=about" scroll={false}>About us</Link>

I need the scroll position of the document to stay put when the user clicks the link. Unfortunately scroll={false} isn't doing that.

Reproduction

https://stackblitz.com/edit/qwik-starter-wvympk?file=src%2Froutes%2Flink-scroll%2Findex.tsx

Steps to reproduce

1. Run npm install & npm dev.
2. Go to the /link-scroll route in the browser
3. Scroll down
4. Click any link
5. Document scrolls to top

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @builder.io/qwik: ^1.4.3 => 1.4.3 
    @builder.io/qwik-city: ^1.4.3 => 1.4.3 
    typescript: 5.3.3 => 5.3.3 
    undici: 5.28.2 => 5.28.2 
    vite: 4.5.2 => 4.5.2

Additional Information

No response

[JerryWu1234]

please help to check link

[JerryWu1234]

https://qwikstarterwvympk-skus--5173--71ef666c.local-credentialless.webcontainer.io/link-scroll
@williamsdyyz

[williamsdyyz]

@JerryWu1234 Link updated in the original post. Apologies, I'm not too familiar with Stackblitz

[maiieul]

I can only see that in your stackblitz @williamsdyyz

[williamsdyyz]

Append /link-scroll to the address in the preview pane. The share link I created already had that. But I guess not. ¯_(ツ)_/¯
I also added a link on the first page since Stackblitz and I are having a disagreement.

[shairez]

thanks @williamsdyyz

So the purpose of the scroll value is for using the "back" button to go back to a route and have it "remember" the scroll position.

For navigating normally, it doesn't remember the scroll positions, only for going back in history.

Maybe this should be documented better?

[williamsdyyz]

@shairez Interesting. False assumption on my part. That prop is not documented at all.

In that case, the issue changes somewhat. For the use-case of showing a modal dialog that can be closed with the back button (similar to Android UX), there is no way to stop the navigation to the dialog from scrolling the underlying document to top.

I've added an example to the link-scroll page: scroll down, click "Open dialog". The dialog appears but the document scrolls to top which is undesirable. The back button nicely closes the dialog and the scroll position is restored to where it should ideally have been all along.

I guess this is really a feature request, not a bug.

Is there any existing way to achieve what I need?

[gioboa]

We moved this issue to qwik-evolution repo to create a RFC discussion for this.
Here is our Qwik RFC process thanks.