3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-01 00:56:20 +02:00
Code Issues Projects Releases Packages Wiki Activity

♻ Pass elements directly

Browse source
This commit is contained in:
Florian Schroedl 2024-11-26 09:21:01 +01:00
parent 18bb717699
commit b5110c2222
1 changed files with 19 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
frontend/playwright/ui/specs/tokens.spec.js
View file

@ -18,14 +18,19 @@ const setupFileWithTokens = async (page) => {
const tokensTabButton = page.getByRole("tab", { name: "Tokens" }); const tokensTabButton = page.getByRole("tab", { name: "Tokens" });
await tokensTabButton.click(); await tokensTabButton.click();
return { workspacePage }; return {
workspacePage,
tokensUpdateCreateModal: workspacePage.tokensUpdateCreateModal,
tokenThemesSetsSidebar: workspacePage.tokenThemesSetsSidebar,
};
}; };
test.describe("Tokens: Tab", () => { test.describe("Tokens: Tokens Tab", () => {
test("Clicking tokens tab button opens tokens sidebar tab", async ({ test("Clicking tokens tab button opens tokens sidebar tab", async ({
page, page,
}) => { }) => {
const { workspacePage } = await setupFileWithTokens(page); const { workspacePage, tokensUpdateCreateModal, tokenThemesSetsSidebar } =
await setupFileWithTokens(page);
const tokensTabPanel = page.getByRole("tabpanel", { name: "tokens" }); const tokensTabPanel = page.getByRole("tabpanel", { name: "tokens" });
@ -36,18 +41,18 @@ test.describe("Tokens: Tab", () => {
test("User creates color token and auto created set show up in the sidebar", async ({ test("User creates color token and auto created set show up in the sidebar", async ({
page, page,
}) => { }) => {
const { workspacePage } = await setupFileWithTokens(page); const { workspacePage, tokensUpdateCreateModal, tokenThemesSetsSidebar } =
await setupFileWithTokens(page);
const tokensTabPanel = page.getByRole("tabpanel", { name: "tokens" }); const tokensTabPanel = page.getByRole("tabpanel", { name: "tokens" });
await tokensTabPanel.getByTitle("Add token: Color").click(); await tokensTabPanel.getByTitle("Add token: Color").click();
// Create color token with mouse // Create color token with mouse
await expect(workspacePage.tokensUpdateCreateModal).toBeVisible(); await expect(tokensUpdateCreateModal).toBeVisible();
const nameField = workspacePage.tokensUpdateCreateModal.getByLabel("Name"); const nameField = tokensUpdateCreateModal.getByLabel("Name");
const valueField = const valueField = tokensUpdateCreateModal.getByLabel("Value");
workspacePage.tokensUpdateCreateModal.getByLabel("Value");
await nameField.click(); await nameField.click();
await nameField.fill("color.primary"); await nameField.fill("color.primary");
@ -55,12 +60,9 @@ test.describe("Tokens: Tab", () => {
await valueField.click(); await valueField.click();
await valueField.fill("red"); await valueField.fill("red");
const submitButton = workspacePage.tokensUpdateCreateModal.getByRole( const submitButton = tokensUpdateCreateModal.getByRole("button", {
"button", name: "Save",
{ });
name: "Save",
},
);
await expect(submitButton).toBeEnabled(); await expect(submitButton).toBeEnabled();
await submitButton.click(); await submitButton.click();
@ -69,7 +71,7 @@ test.describe("Tokens: Tab", () => {
// Create token referencing the previous one with keyboard // Create token referencing the previous one with keyboard
await tokensTabPanel.getByTitle("Add token: Color").click(); await tokensTabPanel.getByTitle("Add token: Color").click();
await expect(workspacePage.tokensUpdateCreateModal).toBeVisible(); await expect(tokensUpdateCreateModal).toBeVisible();
await nameField.click(); await nameField.click();
await nameField.fill("color.secondary"); await nameField.fill("color.secondary");
@ -89,12 +91,12 @@ test.describe("Tokens: Tab", () => {
// Global set has been auto created and is active // Global set has been auto created and is active
await expect( await expect(
workspacePage.tokenThemesSetsSidebar.getByRole("button", { tokenThemesSetsSidebar.getByRole("button", {
name: "Global", name: "Global",
}), }),
).toHaveCount(1); ).toHaveCount(1);
await expect( await expect(
workspacePage.tokenThemesSetsSidebar.getByRole("button", { tokenThemesSetsSidebar.getByRole("button", {
name: "Global", name: "Global",
}), }),
).toHaveAttribute("aria-checked", "true"); ).toHaveAttribute("aria-checked", "true");