Menu

Important: This documentation is about an older version. It's relevant only to the release noted, many of the features and functions have been updated or replaced. Please view the current version.

DocumentationGrafana k6JavaScript APIk6/experimentalbrowserElementHandle
Open source

ElementHandle

Caution

This API is a work in progress. Some of the following functionalities might behave unexpectedly.

Supported APIs

MethodPlaywright Relevant Distinctions
elementHandle.$(selector)-
elementHandle.$$(selector)-
elementHandle.boundingBox()-
elementHandle.check([options])-
elementHandle.click([options])-
elementHandle.contentFrame()-
elementHandle.dblclick([options])-
elementHandle.dispatchEvent(type[, eventInit])-
elementHandle.fill(value[, options])-
elementHandle.focus()-
elementHandle.getAttribute()-
elementHandle.hover([options])-
elementHandle.innerHTML()-
elementHandle.innerText()-
elementHandle.inputValue([options])-
elementHandle.isChecked()-
elementHandle.isDisabled()-
elementHandle.isEditable()-
elementHandle.isEnabled()-
elementHandle.isHidden()-
elementHandle.isVisible()-
elementHandle.ownerFrame()-
elementHandle.press(key[, options])-
elementHandle.screenshot([options])-
elementHandle.scrollIntoViewIfNeeded([options])-
elementHandle.selectOptions(values[, options])-
elementHandle.selectText([options])-
elementHandle.setChecked(checked[, options])-
elementHandle.tap([options])-
elementHandle.textContent()-
elementHandle.type(text[, options])-
elementHandle.uncheck([options])-
elementHandle.waitForElementState(state[, options])-
elementHandle.waitForSelector(selector[, options])-

Examples

JavaScript 
import { check } from 'k6';
import { browser } from 'k6/experimental/browser';

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

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

  // Goto front page, find login link and click it
  try {
    await page.goto('https://test.k6.io/');
    const messagesLink = page.locator('a[href="/my_messages.php"]');

    await Promise.all([page.waitForNavigation(), messagesLink.click()]);
    // Enter login credentials and login
    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!',
    });
  } finally {
    page.close();
  }
}
JavaScript 
import { browser } from 'k6/experimental/browser';
import { check } from 'k6';

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

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

  // Inject page content
  page.setContent(`
        <div class="visible">Hello world</div>
        <div style="display:none" class="hidden"></div>
        <div class="editable" editable>Edit me</div>
        <input type="checkbox" enabled class="enabled">
        <input type="checkbox" disabled class="disabled">
        <input type="checkbox" checked class="checked">
        <input type="checkbox" class="unchecked">
    `);

  // Check state
  check(page, {
    visible: (p) => p.$('.visible').isVisible(),
    hidden: (p) => p.$('.hidden').isHidden(),
    editable: (p) => p.$('.editable').isEditable(),
    enabled: (p) => p.$('.enabled').isEnabled(),
    disabled: (p) => p.$('.disabled').isDisabled(),
    checked: (p) => p.$('.checked').isChecked(),
    unchecked: (p) => p.$('.unchecked').isChecked() === false,
  });

  page.close();
}