Return Promise.all

This is probably going to sound stupid to most people, but can I ask what the difference between

return Promise.all 

and

Promise.all

is?

I don’t know whether I’m doing this wrong, but I have quite large userflows which I can’t really separate that much. For example, I need to go to a login page > login > navigate to another page within the app > fill out a form > submit > save > make a cup of tea > etc.

From what I understand, if I navigate to another page, or click an element with xk6, I need to properly script the promise that is returned? However, if I navigate to lots of different pages and click several elements, I therefore need to use several ‘return Promise.all’ but everything after my first return is unreachable code?

How does one correctly script multiple ‘return Promise.all’ without unreachable code?

Thanks for what I am sure is me just being an idiot. :smiley:

Hi Lewys,

I’m not sure I follow you right :slight_smile:

You return promise.all to continue using .then, .catch, and so on.

Promise.all returns a promise. So you can use the returned promise to continue adding other promises to the chain. So you can wait for the promises in the chain and then do some other action.

You can see how it works here.

Let me know if you need more help.

Thanks.

Yeeeaah, the more I read it, the less sense it makes to me too. :grin:

Hopefully this example will help: Browser Module Documentation

And I guess the question is, why use return Promise.all instead of Promise.all
(The example uses return Promise.all)

:grin: No worries!

Ah, there, we return from promise.All since we want to chain it to the finally block below. So we can close the page and browser when one of the promises in promise.All gets rejected or all are fulfilled. Otherwise, we would outrun the promises and close the page and browser earlier.

I hope this helps :crossed_fingers:

OK. So I think this is part of my confusion. When I’m logged in, I want to visit other pages within my web app. But it all goes wrong, and the browser closes immediately after the first screenshot is taken.

I just can’t see where I’m going wrong. But I’m guessing it’s relating to the return Promise.all and the finally block. But how then do you test going to multiple pages? Mimicking a user flow a bit more realistically.

import { chromium } from 'k6/x/browser';
import { check, sleep } from 'k6';

export default function () {
    const browser = chromium.launch({ 
        headless: false,
        ignoreHTTPSErrors: true,
        timeout: "300s",
/*         slowMo: "1500ms", */
        debug: false,
    });

    const page = browser.newPage({
        ignoreHTTPSErrors: true,
        viewport: {
            width: 1920,
            height: 1080,
        },
    });

    page
    .goto(`https://${__ENV.HOSTNAME}/Account/Login`, { waitUntil: 'networkidle' })
    .then(() => {
        page.waitForNavigation(),
        page.locator('input[name="Username"]').type(`${__ENV.USERNAME}`);
        page.locator('input[name="Password"]').type(`${__ENV.PASSWORD}`);
        page.screenshot({ path: `screenshot-${__VU}-${__ITER}-${Date.now()}.png` });
        return Promise.all([
            page.waitForNavigation(),
            page.locator('input[id="logInButton"]').click(),
        ]).then(() => {
            check(page, {
                'Logged in as user1': page.locator('#logoutForm > a').textContent() == 'Logged in as user1',
                'Log off': page.locator('#logoutForm > a').textContent() == 'Log off',
            })
        })

    .goto(`https://${__ENV.HOSTNAME}/Home/App`, { waitUntil: 'networkidle' })
    .then (() => {
        page.waitForNavigation(),
        page.screenshot({ path: `screenshot-${__VU}-${__ITER}-${Date.now()}.png` });
        return Promise.all([
            page.waitForNavigation(),
        ]).then(() => {
            check(page, {
                'Recent Activity': page.locator('div.container-recent > a').textContent() == 'Activity',
            })
        })
    })
    }).finally(() => {
        page.close();
        browser.close();
    })
}

What about this one?

2 Likes