Menu
Documentationbreadcrumb arrow Grafana k6breadcrumb arrow JavaScript APIbreadcrumb arrow k6/browserbreadcrumb arrow Locatorbreadcrumb arrow filter(options)
Open source

filter(options)

Returns a new Locator that matches only elements containing or excluding specified text.

ParameterTypeDefaultDescription
optionsobjectnullIf not provided, the method behaves like a no-op and returns a locator identical to the original one.
options.hasTextstring or RegExpnullMatches only elements that contain the specified text. String or regular expression. Optional.
options.hasNotTextstring or RegExpnullMatches only elements that do not contain the specified text. String or regular expression. Optional.

Returns

TypeDescription
LocatorA new filtered Locator that can be chained with other methods.

Example

JavaScript 
import { browser } from 'k6/browser';
import { check } from 'https://jslib.k6.io/k6-utils/1.5.0/index.js';

export const options = {
  scenarios: {
    ui: {
      executor: 'shared-iterations',
      options: {
        browser: {
          type: 'chromium',
        },
      },
    },
  },
};

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

  await page.setContent(`
    <ul>
      <li>
        <h3>Product 1</h3>
        <button>Add to cart 1</button>
      </li>
      <li>
        <h3>Product 2</h3>
        <button>Add to cart 2</button>
      </li>
    </ul>
  `);

  // Filter list items that contain "Product 2" text
  const product2Item = page
    .locator('li')
    .filter({ hasText: 'Product 2' })
    .first();

  const product2Text = await product2Item.textContent();
  console.log(product2Text); // Contains "Product 2" and "Add to cart 2"

  // Filter list items that do NOT contain "Product 2" using regex
  const product1Item = page
    .locator('li')
    .filter({ hasNotText: /Product 2/ })
    .first();

  const product1Text = await product1Item.textContent();
  console.log(product1Text); // Contains "Product 1" and "Add to cart 1"

  await page.close();
}