Unable to understand why my browser closes before the page is fully loaded even when using waitForNavigation

Grafana k6 k6-browser
1

This is the sample code picked up from the K6 docs itself. I have added few lines

import { browser } from ‘k6/experimental/browser’;
import { check } from ‘k6’;

export const options = {
scenarios: {
ui: {
executor: ‘shared-iterations’,
options: {
browser: {
type: ‘chromium’,
},
},
},
},
thresholds: {
checks: [“rate==1.0”]
}
}

export default async function () {
const page = browser.newPage();
try {
await page.goto(‘My messages’);
page.locator(‘input[name=“login”]’).type(‘admin’);
page.locator(‘input[name=“password”]’).type(‘123’);
const submitButton = page.locator(‘input[type=“submit”]’);
await Promise.all([page.waitForNavigation(), submitButton.click()]);
check(page, {
‘header’: p => p.locator(‘h2’).textContent() == ‘Welcome, admin!’,
});
await page.locator(submitButton).click()
check(page, {
‘header1’: p => p.locator(‘h2’).textContent() == ‘Unauthorized’,
});
await page.waitForTimeout(5000);

} finally {
page.close();
}
}

Now this only executes the first check but does not click on the logout button and executes 2nd check. Can someone explain why?

2

The parameter of page.locator() function should be a string, but submitButton is a Locator object from the previous page.locator() call.

1 Like
3

That is because both the page have same button. we can change the code to something like this but it will still not execute the lines after 1st check.

try {
await page.goto(‘My messages’);

page.locator('input[name="login"]').type('admin');
page.locator('input[name="password"]').type('123');

const submitButton = page.locator('input[type="submit"]');

await Promise.all([page.waitForNavigation(), submitButton.click()]);

check(page, {
  'header': p => p.locator('h2').textContent() == 'Welcome, admin!',
});

const logoutbuttonlocator = page.locator("//input[@value='Logout']");

await page.locator(logoutbuttonlocator).click()

check(page, {
    'header1': p => p.locator('h2').textContent() == 'Unauthorized',
  });

  await page.waitForTimeout(5000);

} finally {
page.close();
}

4

This is what i get on console

ERRO[0003] process with PID 79935 unexpectedly ended: signal: killed category=browser elapsed=“0 ms” source=browser
ERRO[0003] Uncaught (in promise) clicking on “[object Object]”: DOMException: Failed to execute ‘querySelectorAll’ on ‘Document’: ‘[object Object]’ is not a valid selector.
at CSSQueryEngine.queryAll (xk6_browser_evaluation_script:111:17)
at InjectedScript._queryEngineAll (xk6_browser_evaluation_script:158:42)
at InjectedScript._querySelectorRecursively (xk6_browser_evaluation_script:214:20)
at InjectedScript.querySelectorAll (xk6_browser_evaluation_script:627:25)
at predicate (xk6_browser_evaluation_script:897:29)
at predicate (xk6_browser_evaluation_script:735:14)
at onRaf (xk6_browser_evaluation_script:793:25)
at pollRaf (xk6_browser_evaluation_script:785:13)
at InjectedScript.waitForPredicateFunction (xk6_browser_evaluation_script:743:41)
at InjectedScript.waitForSelector (xk6_browser_evaluation_script:926:17) executor=shared-iterations scenario=ui

5

@akhilsr20
Because logoutbuttonlocator is a Locator object again and not a string, so

Please replace the line:

await page.locator(logoutbuttonlocator).click()

with:

await logoutbuttonlocator.click()
1 Like
6

Thank you for pointing that out.

1 Like
7

Browser closures during page loading could be due to various factors like network issues or Guide script errors. Double-check your waitForNavigation implementation and ensure it’s properly handling page transitions. Additionally, consider debugging tools to pinpoint the root cause for a smoother browsing experience.