Playwrightでチェックボックスのチェックがついているラベルを取りたい

version

"@playwright/test": "^1.22.2"

起こったこと

Playwrightでチェックボックスのチェックがついているラベルの値を取りたい。

以下の画像なら["チェックボックス1", "チェックボックス2"]といった値。

<form>
  <div>
      <input type="checkbox" id="checkbox1" checked>
      <label for="checkbox1">チェックボックス1</label>
  </div>
  <div>
      <input type="checkbox" id="checkbox2" checked>
      <label for="checkbox2">チェックボックス2</label>
  </div>
  <div>
      <input type="checkbox" id="checkbox3">
      <label for="checkbox3">チェックボックス3</label>
  </div>
</form>

CSSセレクタの拡張

selectorで"div:has(input:checked) > label"とする.

playwright.dev

import { test, expect } from "@playwright/test";

test("チェックされているラベルが２つである", async ({ page }) => {
  await page.goto("/input.html");
  const checkedLabels = await page
    .locator("div:has(input:checked) > label")
    .allInnerTexts();
  expect(checkedLabels).toEqual(["チェックボックス1", "チェックボックス2"]);
});