Testcafe Cookie handling?

Question

I have a question about TestCafe usage. I have a script (fixture) with two tests inside. If the first test runs the URL and if not logged in, the script will log into the site.

BUT: the second test always logs in too. It looks like Testcafe does not recognize the cookies done in a fixture. What is the string inside the fixture or runner, to keep the set cookies?

import { Selector } from 'testcafe';

fixture `Ordner erstellen`
   .page `xxxx`
   .before(async ctx  => {
      ctx.clLogin = `xxxx`;
      ctx.clPassword = `xxx`;
    });
test('Create and Delete Folder1', async t => {
const testfolder = Selector('.np-folder-name[title="19233456"]')
await t
   .typeText(Selector('#email'), t.fixtureCtx.clLogin, {
      caretPos: 0
   })
   .typeText(Selector('#password'), t.fixtureCtx.clPassword, {
      caretPos: 0
   })
   .click(Selector('span').withText('Login'))
   .click(Selector('.np-top-section-tab.folder'))
await t
   .wait(2000)
   .expect(testfolder.withText('19233456').exists).notOk()

test('Create and Delete Folder2', async t => {
const testfolder = Selector('.np-folder-name[title="19233456"]')
await t
   .typeText(Selector('#email'), t.fixtureCtx.clLogin, {
      caretPos: 0
   })
   .typeText(Selector('#password'), t.fixtureCtx.clPassword, {
      caretPos: 0
   })
   .click(Selector('span').withText('Login'))
   .click(Selector('.np-top-section-tab.folder'))
await t
   .wait(2000)
   .expect(testfolder.withText('19233456').exists).notOk()

I also tried with the role concept from testcafe. But this is also not working well.

import { Selector, Role } from 'testcafe';



const admin = Role('https://bc3-channel.cliplister.com/', async t => {
    await t
        .typeText(Selector('#email'), `xxx`, {
            caretPos: 0
        })
        .typeText(Selector('#password'), `xxx`, {
            caretPos: 0
        })
        .click(Selector('span').withText('Login'))
});

fixture `Ordner erstellen`
    .page `xxx`


test('Create and Delete Folder', async t => {
    const testfolder = Selector('.np-folder-name[title="19233456"]')
    await t
        .useRole(admin)
        .navigateTo('xxx')
        .click(Selector('.np-top-section-tab.folder'))

});


test('Create and Delete Folder2', async t => {
    const testfolder = Selector('.np-folder-name[title="19233456"]')
    await t
        .navigateTo('xxx')
        .click(Selector('.np-top-section-tab.folder'))
    await t
        .wait(2000)
        .expect(testfolder.withText('19233456').exists).notOk()

});

Refer the solution mentioned in https://stackoverflow.com/questions/56975267/testcafe-the-browser-always-starts-in-clean-slate-between-the-tests-how-to-ov/57106054#57106054 — Jn Neer, Jul 19 '19 at 12:37

score 4 · Answer 1 · answered Jul 04 '19 at 12:57

Each test in TestCafe starts with clean cookies and storages. You need to use the useRole call in each test if you wish to stay logged in. The useRole function restores cookies and storages in the second and subsequent calls that were saved on the first call. You can call the useRole function in the beforeEach hook instead of writing it manually in each test.

User Roles

Test Hooks

score 3 · Answer 2 · answered Jul 19 '19 at 12:41

This is how you can resolve using Role API.

Create a Login.js page object file with your login action

const adminLogin = Role('https://bc3-channel.cliplister.com/', async t => {
    await t
        .typeText(Selector('#email'), `xxx`, {
            caretPos: 0
        })
        .typeText(Selector('#password'), `xxx`, {
            caretPos: 0
        })
        .click(Selector('span').withText('Login'))
});

Then call this const adminLogin in your fixture file as shown below : fixture.js

import { adminLogin } from '../page-objects/login';
fixture `Ordner erstellen`.beforeEach(async t => {
  await t.useRole(adminLogin ).navigateTo('url of the page that you want to open');
});

Testcafe Cookie handling?

2 Answers2