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

Problem with back / forward buttons #472

Closed
pburdylo opened this issue Nov 20, 2019 · 3 comments
Closed

Problem with back / forward buttons #472

pburdylo opened this issue Nov 20, 2019 · 3 comments

Comments

@pburdylo
Copy link

pburdylo commented Nov 20, 2019

I have issues with back & forward buttons in the browser.

To recreate I have created very simple example. Two html files: test1 & test2, each with a simple link to the other file. Both with barba wrappers / containers.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body data-barba="wrapper">
    <div data-barba="container">
        test 1
        <br>
        <a href="test2.php">next page</a>
    </div>
</body>
    <script src="test.js"></script>
</html>

Then a simple transitions initialization:

barba.init({
    transitions: [
        {
            name: 'generic',
            priority: 2,
            enter() {
                console.log('generic enter');
            },
        }, {
            name: 'back',
            priority: 1,
            custom: ({ trigger }) => {return trigger === 'back'},
            enter() {
                console.log('back enter')
            },
        }, {
            name: 'forward',
            priority: 1,
            custom: ({ trigger }) => {return trigger === 'forward'},
            enter() {
                console.log('forward enter')
            },
        },
    ]
    });

Now the test scenario is:

  1. go through a few links... This results in a bunch of "generic enter" logs. So far so good.
  2. now reload.
  3. go back (browser nav button). I see forward log.
  4. go forward (browser nav button). I see back log.
    I consider both a bug.
  5. go back twice (still the nav button). I see forward log followed with a back log. (further backs result in a back log which is fine).
  6. go further twice... I see forward log (ok) followed with a back log (bug).

I can attach a simple repo should you need it to recreate. Using barba 2.8.0.

@xavierfoucrier
Copy link
Member

Hi @pburdylo,

Thanks for the use case. Note that your script src is outside the body tag.
Will take the time to check all scenarios as soon as possible.

😉

@thierrymichel
Copy link
Member

Hi @pburdylo,

Thanks for pointing this out.
We need to check barba.history on popstate events.
I will work on it tomorrow and release a quick fix.
Alongside, we will probably consider some refactoring around this history management…

@thierrymichel
Copy link
Member

thierrymichel commented Dec 9, 2019

@pburdylo,

It should be fixed in 2.9.3.
And it would be very appreciated if you could check and validate… 😊

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants