Role doesn't work when page navigation doesn't trigger page reloading

[LavrovArtem]

Are you requesting a feature or reporting a bug?

bug

What is the current behavior?

Role doesn't work after first-time initialization. Cookie, localStorage and sessionStorage should be restored when a preserved page is loaded but the page changes only the hash and it isn't reloaded after navigating.

What is the expected behavior?

Page must be reloaded after the useRole function call.

How would you reproduce the current behavior (if this is a bug)?

Node server:

const http = require('http');

http
    .createServer((req, res) => {
        if (req.url === '/') {
            res.writeHead(200, { 'content-type': 'text/html' });
            res.end(`
                <h1 id="header"></h1>
                <a id="anchor" href="#login">log in</a>
                <input id="button" type="button" value="log in">

                <script>
                    var onHashChange = function () {
                        var newHash = location.hash;

                        if (newHash === '') {
                            if (localStorage.getItem('isLoggedIn')) {
                                header.textContent = 'Authorized';
                                header.style.display = 'block';
                                anchor.style.display = 'none';
                                button.style.display = 'none';
                            }
                            else {
                                header.textContent = 'Unauthorized';
                                anchor.style.display = 'block';
                                button.style.display = 'none';
                            }
                        } 
                        else if (newHash === '#login') {
                            if (localStorage.getItem('isLoggedIn'))
                                return location.hash = '';

                            header.style.display = 'none';
                            anchor.style.display = 'none';
                            button.style.display = 'block';

                            button.addEventListener('click', function() {
                                localStorage.setItem('isLoggedIn', 'true');
                                location.hash = '';
                            });
                        }
                    };

                    onHashChange();

                    window.addEventListener('hashchange', onHashChange);
                </script>
            `);
        }
        else
            res.end();
    })
    .listen(4100);

Provide the test code and the tested page URL (if applicable)

Test code

import { Role, ClientFunction, Selector } from 'testcafe';

fixture `Test authentication`
    .page `http://localhost:4100/`;

const role = Role(`http://localhost:4100/#login`, async t => await t.click('input'), { preserveUrl: true });

test('first login', async t => {
    await t
        .wait(3000)
        .useRole(role)
        .expect(Selector('h1').innerText).eql('Authorized');
});

test('second login', async t => {
    await t
        .wait(3000)
        .useRole(role)
        .expect(Selector('h1').innerText).eql('Authorized');
});

Workaround

import { Role, ClientFunction, Selector } from 'testcafe';

fixture `Test authentication`
    .page `http://localhost:4100/`;

const role = Role(`http://localhost:4100/#login`, async t => await t.click('input'), { preserveUrl: true });
const reloadPage = new ClientFunction(() => location.reload(true));
const fixedUseRole = async (t, role) => {
	await t.useRole(role);
	await reloadPage();
};

test('first login', async t => {
    await t.wait(3000)
    await fixedUseRole(t, role);
    await t.expect(Selector('h1').innerText).eql('Authorized');
});

test('second login', async t => {
    await t.wait(3000)
    await fixedUseRole(t, role);
    await t.expect(Selector('h1').innerText).eql('Authorized');
});

Specify your

• testcafe version: 0.19.0

[lennytakahashi]

Thanks a lot for the workaround. That really helps to ease the pain. (testcafe version: 0.20.4)

[uvizhe]

I'm using hash based navigation and my workaround is:

await t
  .useRole(role)
  .navigateTo('/')
  .wait(500)
  ...

testcafe 0.20.5

[lock]

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests. We recommend you ask TestCafe API, usage and configuration inquiries on StackOverflow.