chajia/e2e/flock-hold-ui.test.ts

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

test.describe("Flock hold UI（fixture，不依赖官网 RPA）", () => {
  test.beforeEach(async ({ page }) => {
    await page.goto("/e2e-fixtures/flock-hold");
    await expect(page.getByTestId("flock-hold-fixture")).toBeVisible({
      timeout: 30_000,
    });
  });

  test("60s 确认窗文案：下单语义 + 倒计时", async ({ page }) => {
    const dialog = page.getByRole("dialog").filter({
      has: page.getByRole("heading", { name: "更新二级信息以完成下单" }),
    });
    await expect(
      dialog.getByRole("heading", { name: "更新二级信息以完成下单" }),
    ).toBeVisible();
    await expect(dialog.getByText(/请在/)).toBeVisible();
    await expect(dialog.getByText(/总时限剩余/)).toBeVisible();
    await expect(
      dialog.getByRole("button", { name: "不继续填写", exact: true }),
    ).toBeVisible();
    await expect(
      dialog.getByRole("button", { name: "继续填写", exact: true }),
    ).toBeVisible();
  });

  test("不继续填写 → 关闭弹窗且未解锁结账", async ({ page }) => {
    await page
      .getByRole("dialog")
      .filter({
        has: page.getByRole("heading", { name: "更新二级信息以完成下单" }),
      })
      .getByRole("button", { name: "不继续填写", exact: true })
      .click();
    await expect(page.getByTestId("last-action")).toHaveText(
      "lastAction=hold-decline",
    );
    await expect(page.getByTestId("hold-accepted")).toHaveText(
      "holdAccepted=false",
    );
    await expect(
      page.getByRole("dialog").filter({
        has: page.getByRole("heading", { name: "更新二级信息以完成下单" }),
      }),
    ).toHaveCount(0);
    await expect(page.getByText(/请先确认「继续填写」/)).toBeVisible();
    await expect(page.getByRole("button", { name: /前往结账/ })).toBeDisabled();
  });

  test("继续填写 → 查看报价选项弹窗 → 选灵活价 → 可结账", async ({
    page,
  }) => {
    await page
      .getByRole("dialog")
      .filter({
        has: page.getByRole("heading", { name: "更新二级信息以完成下单" }),
      })
      .getByRole("button", { name: "继续填写", exact: true })
      .click();
    await expect(page.getByTestId("last-action")).toHaveText(
      "lastAction=hold-continue",
    );
    await expect(page.getByTestId("hold-accepted")).toHaveText(
      "holdAccepted=true",
    );

    await page.getByTestId("flock-see-pricing-flock_direct").click();
    const modal = page.getByTestId("flock-pricing-options-modal");
    await expect(modal).toBeVisible();
    await expect(modal.getByText("提货日期是否灵活？")).toBeVisible();
    await expect(modal.getByText("2 天灵活性")).toBeVisible();
    await expect(modal.getByText("1 天灵活性")).toBeVisible();
    await expect(modal.getByText("无灵活性")).toBeVisible();

    await modal.getByTestId("flock-flex-option-2_day").click();
    await expect(page.getByTestId("last-action")).toHaveText(
      "lastAction=select-flex:2_day",
    );
    await expect(modal).toHaveCount(0);

    const checkout = page.getByRole("button", { name: /前往结账/ });
    await expect(checkout).toBeEnabled();
    await checkout.click();
    await expect(page.getByTestId("last-action")).toHaveText(
      "lastAction=checkout-ok",
    );
  });

  test("未选灵活价时结账按钮禁用（预防跳步）", async ({ page }) => {
    await page
      .getByRole("dialog")
      .filter({
        has: page.getByRole("heading", { name: "更新二级信息以完成下单" }),
      })
      .getByRole("button", { name: "继续填写", exact: true })
      .click();
    await page.getByTestId("flock-see-pricing-flock_direct").click();
    await expect(page.getByTestId("flock-pricing-options-modal")).toBeVisible();
    await expect(page.getByRole("button", { name: /前往结账/ })).toBeDisabled();
    await expect(page.getByTestId("last-action")).toHaveText(
      /select-tier:flock_direct/,
    );
  });

  test("官网同款：双卡起价 + 查看报价选项可见", async ({ page }) => {
    await expect(page.getByTestId("flock-tier-card-flock_direct")).toBeVisible();
    await expect(page.getByTestId("flock-tier-card-standard")).toBeVisible();
    await expect(page.getByText("起价").first()).toBeVisible();
    await expect(page.getByText("$1,221").first()).toBeVisible();
    await expect(page.getByText("$1,011").first()).toBeVisible();
    await expect(page.getByText(/JKR-RH3X/)).toBeVisible();
    await expect(
      page.getByTestId("flock-see-pricing-flock_direct"),
    ).toBeVisible();
    await expect(page.getByTestId("flock-see-pricing-standard")).toBeVisible();
  });
});