gradio/js/app/test/tabs.spec.ts
aliabid94 ba3ec1300e
Tab select fix (#7470)
* changes

* add changeset

* changes

* changes

* changes

* Update js/tabs/shared/Tabs.svelte

Co-authored-by: Aarni Koskela <akx@iki.fi>

* changes

* changes

* changes

---------

Co-authored-by: Ali Abid <aliabid94@gmail.com>
Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: Aarni Koskela <akx@iki.fi>
2024-02-21 17:27:58 -06:00

64 lines
2.5 KiB
TypeScript

import { test, expect } from "@gradio/tootils";
test("clicking through tabs shows correct content", async ({ page }) => {
await page.getByRole("tab", { name: "Tab 2" }).click();
await expect(page.getByText("Text 1!")).toBeHidden();
await expect(page.getByText("Text 2!")).toBeVisible();
await page.getByRole("tab", { name: "Tab 4" }).click();
await expect(page.getByText("Text 2!")).toBeHidden();
await expect(page.getByText("Text 4!")).toBeVisible();
await page.getByRole("tab", { name: "Set 2" }).click();
await page.getByRole("tab", { name: "Tab 12" }).click();
await expect(page.getByText("Text 2!")).toBeHidden();
await expect(page.getByText("Text 12!")).toBeVisible();
});
test("correct selected tab shown", async ({ page }) => {
await page.getByRole("tab", { name: "Tab 2" }).click();
await expect(page.getByLabel("Selected Tab")).toHaveValue("Tab 2");
await page.getByRole("tab", { name: "Tab 5" }).click();
await expect(page.getByLabel("Selected Tab")).toHaveValue("Tab 5");
await page
.getByRole("button", { name: "Make Even Tabs Uninteractive" })
.click();
await page.waitForTimeout(1000);
await expect(page.getByRole("tab", { name: "Tab 2" })).toBeDisabled();
await page.getByRole("button", { name: "Make All Tabs Interactive" }).click();
await page.waitForTimeout(1000);
await page.getByRole("tab", { name: "Tab 2" }).click();
await expect(page.getByLabel("Selected Tab")).toHaveValue("Tab 2");
await page.getByRole("button", { name: "Hide Odd Tabs" }).click();
await page.waitForTimeout(1000);
await page.getByRole("tab", { name: "Tab 4" }).click();
await page.getByRole("button", { name: "Show All Tabs" }).click();
await page.waitForTimeout(1000);
await page.getByRole("tab", { name: "Tab 9" }).click();
await expect(page.getByLabel("Selected Tab")).toHaveValue("Tab 9");
});
test("output from one tab to another works", async ({ page }) => {
await page.getByRole("tab", { name: "Tab 4" }).click();
await page.getByLabel("Input 4").fill("hi");
await page.getByLabel("Input 4").press("Enter");
await page.getByRole("tab", { name: "Set 2" }).click();
await page.getByRole("tab", { name: "Tab 13" }).click();
await expect(page.getByLabel("Input 13")).toHaveValue("");
await expect(page.getByLabel("Input 13")).toBeVisible();
await expect(page.getByLabel("Input 14")).toBeHidden();
await page.getByRole("tab", { name: "Tab 14" }).click();
await expect(page.getByLabel("Input 14")).toBeVisible();
await expect(page.getByLabel("Input 14")).toHaveValue("hi");
});