SOLVED: Page Scroll Position Issue on Refresh with "Enable Query Sort/Filter/Live Search" Feature Enabled

Browser: Chrome 110 / Edge
OS: Windows
I have encountered an issue that negatively impacts the user experience, and I was able to reproduce it on the BricksBuilder playground at “Try Bricks – Free playground for Bricks.

Tested on version: 1.11
Issue not present in previous version: 1.10.3

Issue Description:

When the “Enable query sort / filter / live search” feature is enabled, refreshing the front-end page causes it to scroll back to the top. For example, if a visitor has scrolled 70% down a long page (the scroll depth can vary), refreshing the page will return them to the top, requiring them to manually scroll back to where they left off. This creates a poor user experience. However, when the “Enable query sort / filter / live search” feature is disabled and the page is reloaded, this issue no longer occurs; the page refreshes and remains at the previously viewed scroll position as expected.

1 Like

Hello @a-ben,

thank you for your report.

I was able to replicate this and I’ve added it to the internal bug tracker. Once we fix the issue, we will update this topic.

Thanks and best regards,
Matej

Hi Matej,

Thank you for confirming the issue and adding it to the internal bug tracker. I appreciate your quick response and look forward to the update once it’s resolved.

Best regards,
Ben

1 Like

Hi

I have a similar problem. If “Enable query sort / filter / live search” is switched on, the scroll navigation does not work.

Example: I have a table of contents which scrolls sticky in a post. If I click on the first anchor, the browser scrolls to the corresponding section. If I click on the second anchor, the browser scrolls to the second section. However, when I click on the back button in the browser, the scroll position of the first section is not restored.

In addition, when I call up the URL with the anchor ID, the browser only scrolls to the section the first time. When I refresh the browser, the scrolling fails.

1 Like

Hi Matej,

Before this issue is officially fixed, is there any temporary workaround that allows us to keep the “Enable query sort / filter / live search” feature enabled while avoiding the scroll-to-top behavior after refreshing the page? Thanks in advance!

1 Like

Hi @a-ben,

sadly, not that I’m aware of.

Best regards,
Matej

This issue still happen until now 1.12.4
I hope this bug can be fixed in 2.0
Thank Matej

2 Likes

Hi Matej, is there any update for this issue? It’s kind of bad UX :frowning:

1 Like

Hi @minhnhut,

not yet. No news on this.

Matej

Looks like they’re setting history.scrollRestoration = 'manual' which causes the behaviour. This code is there for a reason, as it prevents some strange scrolling issues (as I’m told). However, I used some JS to set it back to auto and haven’t had any issues yet. Please test this extensively though as your mileage may vary

1 Like

Hi Josh, mind sharing that JS snippet you used as a quick fix? Would love to try it out too. Thanks!

document.addEventListener('DOMContentLoaded', () => {
  setTimeout(() => {
		history.scrollRestoration = 'auto';
  }, 300)
});

The timeout is because Bricks also applies their script on DOMContentLoaded

3 Likes

Hi Matej, is there any update for this issue? It’s kind of bad UX :frowning:

No updates yet @a-ben.

Matej

Hi, my customer would like to go away from me because of this issue. Is there a workaround?

I mean, my case is more complex: I don’t need only scroll position restoration, I also need the previous product category page not reloaded but restored as I use infinite scroll for the products. So the scroll position is not enough. All these things are built in Bricks and it is not complete enough yet for filter, infinite scroll and back button. I think it would be more professional to sync these functions. We need your help, please.

Hi @Design2WP,

sadly, I have to bring bad news. As far as I know, there is no workaround for this.

For restoring position in infinite scroll, there is a feature request topic that you can comment on: URL update on Infinite Scroll - #6 by MartinWB

Best regards,
Matej

Hi Matej,

It’s been more than a year since this issue was added to the internal bug tracker, and Bricks has already evolved significantly—even reaching version 2.1.4 with major updates.

Could you please consider moving this bug a bit higher in the internal priority list so it can be addressed in one of the upcoming releases? This issue still affects the user experience quite noticeably, and it would be great to see it fixed sooner rather than later.

Thanks a lot for your help and continued support.

2 Likes

Hi @a-ben,

I’ll forward this again to the developers who are working on this feature. That’s what I can do for now.

Thank you for understanding,
Matej

1 Like

We fixed this issue in Bricks 2.2 beta, which is now available in your account.
Changelog: Bricks 2.2-beta Changelog – Bricks

Please let us know if you are still experiencing issues.

As with any pre-stable release, please do not use it on a production/live website. It is only meant for testing in a local or staging environment. The more feedback we get, the better :v:

3 Likes