Do not select stacked pages when querying for previous page in router back

[blikblum]

Fixes #3975

This change does not select .stacked pages when determining previous page.

Uses the same selector used e.g. in https://github.com/framework7io/framework7/blob/master/src/core/modules/router/back.js#L343

[nolimits4web]

Merged, thanks!

[blikblum]

Hi, this PR uncovers a different bug: when trying to preload, a new page element is created/added instead of using the stacked one.

This is the code path:

In the second call to back, with preload: true
calls loadBack, that creates a new page
calls backward with new created page
a new page is inserted in dom tree
the dom keeps the with the two pages, the stacked pre existing, and the new one added in preload

I think the better is to revert this change while a proper fix (reuse the stacked page) is done.

[blikblum]

Is the preload code path necessary at all when using stackPages: true?

A possible fix is to skip preload when stackPages: true

[nolimits4web]

I have reverted and pushed another fix, can you check if it works for you now?

[blikblum]

Thanks. This fixes the original issue and also prevents the component being recreated when using stackPages.

I noticed the stacked class is kept in previous page when navigating backward giving a different structure when navigating forward in the same page.

In the example when going to the "Fact" page, starting from home, i get the following dom structure:

<div class="view view-main ios-edges">
      <div class="page page-previous stacked" data-name="home" aria-hidden="true"></div>
        
      <div class="page page-previous" data-name="person" aria-hidden="true"></div>
     
      <div class="page page-current" data-name="fact"></div>           
</div>

When going to "about" page and going back to "fact", i get the following structure (the previous page keeps the stacked class)

<div class="view view-main ios-edges">
      <div class="page page-previous stacked" data-name="home" aria-hidden="true"></div>
        
      <div class="page page-previous stacked" data-name="person" aria-hidden="true"></div>
     
      <div class="page page-current" data-name="fact"></div>           
</div>

This seems to prevent swipeBack feature.

Should i open a knew issue?

[blikblum]

Just found a issue when using stackPages: false with duplicated dom page elements but seems not related to this change because i reverted back and and still persists. Will investigate further and report

[nolimits4web]

Thanks. This fixes the original issue and also prevents the component being recreated when using stackPages.

I noticed the stacked class is kept in previous page when navigating backward giving a different structure when navigating forward in the same page.

In the example when going to the "Fact" page, starting from home, i get the following dom structure:

<div class="view view-main ios-edges">
      <div class="page page-previous stacked" data-name="home" aria-hidden="true"></div>
        
      <div class="page page-previous" data-name="person" aria-hidden="true"></div>
     
      <div class="page page-current" data-name="fact"></div>           
</div>

When going to "about" page and going back to "fact", i get the following structure (the previous page keeps the stacked class)

<div class="view view-main ios-edges">
      <div class="page page-previous stacked" data-name="home" aria-hidden="true"></div>
        
      <div class="page page-previous stacked" data-name="person" aria-hidden="true"></div>
     
      <div class="page page-current" data-name="fact"></div>           
</div>

This seems to prevent swipeBack feature.

Should i open a knew issue?

Fixed now