Products are not loaded after scrolling up

[BorisovskiP]

In the product listing page , when you scroll down a page (for example page 4), open a product , then go back with the browser back button to the same product page listing, the products from the previous pages are not displayed.

The product listing begins from that page (page 4) and at the top there a toolbar of how many products are shown ( Product 13-24 from 731 )

*Preconditions ()**

• PHP 7.2
• Magento version: 2.3.4
• Default theme
• No custom modules are included that would effect the product listing

Steps to reproduce

1. Open the product listing page and stroll to a page grater then 1.
2. Click on any product, then using the browser back button go back to the product listings
3. Scroll to the top to see that the products from the previous pages are not loaded.

*Expected result ()**

1. The products from all the previous pages should be shown or at least from the past 2-3 pages

[BorisovskiP]

Do you also think that this is a bug @damian-pastorini @gsomoza ?

[gsomoza]

No: this one is by design, because loading the previous pages is a bit risky (e.g. DoS) and technically complicated to implement. So we're letting people implement that themselves if they want to by hooking to the plugin using the provided method(s). There's more information on https://github.com/Strategery-Inc/Magento2-InfiniteScroll/issues/55

[BorisovskiP]

Ok, thanks for the explanation.

[sprankhub]

@gsomoza thanks for the explanation! However, I do not quite follow. What exactly is risky? I imagine the perfect UX as follows:

• User opens category page, sees products from first page.
• User scrolls down, products from pages 2, 3, 4, ... are added.
• From page 4, user clicks on a product, so that the product page is opened.
• User clicks back button. Only products from page 4 are shown. First product is shown at the top of the screen, so that the user can still scroll up.
• User scrolls up. Products from pages 3, 2, 1 are added.

So in the end, I think scrolling up should work exactly in the same way as scrolling down. This is expected behaviour for me TBH. Could you elaborate why this is not possible / risky @gsomoza?

[gsomoza]

There are two main reasons why I consider the "infinite upwards scroll" feature risky:

UX

This is a feature everyone "thinks" they want, but once they experience it they actually wouldn't like it at all. This applies especially to users who aren't very dexterous:

1. Depending where you are on the page (e.g. page 20), it might be hard to get to the header of the previous page once you go "back". It's already hard to get to the bottom of the page with standard Infinite Scroll, so if they can't get to the header the user would be "trapped" in an infinite scroll in both directions and the only way out would be to click on a product. Ouch.
2. Even if you manage to get to the top of the page, the user would have to be quite dexterous to click on a link there before the "previous" page gets inserted at the top and the header gets pushed out of view again...
3. What's more, if we allow getting to the very top and we try to avoid the header getting pushed up again out of view, it would mean making sure the previous page gets inserted in a way that the content gets pushed "down" without scrolling the view - and in that case it would auto-trigger another request to the previous-1 page, and then another to previous-2, etc. until all 20 previous pages are loaded, making the items the user might be interested in from page 15 be pushed downwards further and further out of the user's reach.
4. The only viable solutions I can think of would be to
   1. Use a "sticky header" plus some very smart JS that would allow the user to scroll up a bit more, just enough to trigger the previous page-load. This would make all themes that don't have sticky headers immediately incompatible with this feature. So then it's not so interesting to add it to this extension, which is supposed to work "out of the box" on most standard themes, both with and without sticky headers.
   2. Or add a button that the user has to click to "load previous page". But then that's essentially the same as having pagination controls at the top 🤷‍♂️

Maintenance

The second reason builds on top of the previous one: code that would make this work wouldn't actually be simple and straightforward, and it would probably be quite frontend-heavy / opinionated. This means it will also probably have compatibility issues with many more themes. This paired with the fact that his is a feature that sounds really interesting to have, might cause an explosion of "bug" requests (aka "free support" requests 😜) in this repository because the feature is either not working or the UI has issues similar to what I described above..

Conclusion

I'd love to see someone finally put the puzzle together on this vision of a perfect Infinite Scroll experience – which is a dream that I know SO many people have (EDIT: and once upon a time I did too!)... but having worked with this for so many years, I have yet to see a smooth implementation for the "go back" experience in general in the first place! – let alone the "infinite upwards scroll" feature...

[sprankhub]

Thanks for the detailed explanation @gsomoza!

To be honest, solution 2 - having a "load previous products" button - sounds like exactly the right thing to me. This could of course be configurable. Do you consider this a proper feature request or do you think this should not be part of the extension at all?

[gsomoza]

Yes, I can see this extension adding that feature as a configurable option that can be enabled, it could be interesting for many people. Would you consider contributing that feature?

[sprankhub]

Cool. I cannot tell yet. If the client would like to have it, I am happy to contribute it. Otherwise, I fear it will not happen due to the lack of time. Should we then re-open this issue or would you like to create a new one with the concrete feature?

[gsomoza]

We can reopen this issue, then we can reference the whole discussion for context on future support requests etc, as there's some useful information. Let me know if you're able to work on it and I'll reopen!