Documentation Grafana k6 Using k6 browser Recommended practices Prevent cookie banners from blocking interactions

Prevent cookie banners from blocking interactions

Cookie banners often appear shortly after a page loads or remain hidden until you interact with the page. Leaving a banner open can block page elements and cause interaction failures. For example, a button might not be clickable because the banner overlaps it. If you find yourself using force click frequently, the element is likely hidden or overlapped by a cookie banner.

To avoid these failures, trigger and dismiss the cookie banner early in the test flow.

• Trigger the banner: simulate a small user action, such as clicking or scrolling, immediately after navigation to reveal banners that appear only after interaction.
• Dismiss the banner: once the banner is visible, close or accept it before continuing with the rest of the test.

Example

The example below navigates to a page and clicks a button. Replace the placeholder steps with a click to an element on your website, or scrolling a page, that reveals and dismisses your site’s cookie banner.

JavaScript Copy

import { browser } from 'k6/browser';
import { expect } from 'https://jslib.k6.io/k6-testing/0.6.1/index.js';

export const options = {
  scenarios: {
    ui: {
      executor: 'shared-iterations',
      options: {
        browser: {
          type: 'chromium',
        },
      },
    },
  },
  thresholds: {
    checks: ['rate==1.0'],
  },
};

export default async function () {
  const page = await browser.newPage();

  try {
    await page.goto('https://quickpizza.grafana.com/');

    // Click an element to trigger a cookie banner.
    // Clicking an element also scrolls the page if the
    // element is outside the frame.
    const button = page.locator('button[name="pizza-please"]')
    await expect(button).toBeEnabled();
    await button.click();

    // Dismiss the cookie banner
    const cookieBannerButton = page.locator('button[name="dismiss-cookie"]')
    await expect(button).toBeEnabled();
    await button.click();
  } finally {
    await page.close();
  }
}