2.2 Actions：點擊、輸入與操作#

// 開啟頁面
await page.goto("https://my-site.com");

// 點擊
await page.getByRole("button", { name: "送出" }).click();

// 輸入文字（會先清空再輸入）
await page.getByLabel("電子郵件").fill("user@test.com");

// 鍵盤操作
await page.getByLabel("搜尋").press("Enter");

// 下拉選單：選擇選項
await page.getByLabel("城市").selectOption("台北市");
await page.getByLabel("城市").selectOption({ label: "台北市" });

// 勾選 / 取消勾選
await page.getByLabel("記住我").check();
await page.getByLabel("記住我").uncheck();

// 滑鼠懸停（hover）
await page.getByRole("menuitem", { name: "商品分類" }).hover();

// 雙擊 / 右鍵
await page.getByText("檔案").dblclick();
await page.getByText("檔案").click({ button: "right" });

// 上傳檔案
await page.setInputFiles('input[type="file"]', "photo.png");

// 點擊前先等元素穩定；指定超時
await page.getByRole("button", { name: "送出" }).click({
  timeout: 5000,
});

// 強制點擊（跳過可操作性檢查，能不用就不用）
await page.getByRole("button").click({ force: true });

// 取得所有符合的元素
const items = page.getByRole("listitem");
const count = await items.count();

// 逐一處理
for (let i = 0; i < count; i++) {
  console.log(await items.nth(i).textContent());
}

// 也可以直接在 filter 之後全部一起斷言（見 2.3）

test("使用者應該能登入", async ({ page }) => {
  await page.goto("https://my-site.com/login");

  await page.getByLabel("電子郵件").fill("user@test.com");
  await page.getByLabel("密碼").fill("password123");
  await page.getByRole("button", { name: "登入" }).click();

  await expect(page).toHaveURL(/dashboard/);   // 驗證跳轉成功
});