tests: improve playwright test readability (#5149)

This commit is contained in:
artshllaku 2024-10-03 11:20:27 +02:00 committed by GitHub
parent 0071775525
commit a309cf0e2c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 40 additions and 46 deletions

View file

@ -1,8 +1,22 @@
import { expect, test } from "@playwright/test"; import { expect, test } from "@playwright/test";
import { login, restoreSqliteSnapshot, screenshot } from "../util-test"; import { login, restoreSqliteSnapshot, screenshot } from "../util-test";
test.describe("Monitor Form", () => { /**
* Selects the monitor type from the dropdown.
* @param {import('@playwright/test').Page} page - The Playwright page instance.
* @param {string} monitorType - The monitor type to select (default is "dns").
* @returns {Promise<void>} - A promise that resolves when the monitor type is selected.
*/
async function selectMonitorType(page, monitorType = "dns") {
const monitorTypeSelect = page.getByTestId("monitor-type-select");
await expect(monitorTypeSelect).toBeVisible();
await monitorTypeSelect.selectOption(monitorType);
const selectedValue = await monitorTypeSelect.evaluate((select) => select.value);
expect(selectedValue).toBe(monitorType);
}
test.describe("Monitor Form", () => {
test.beforeEach(async ({ page }) => { test.beforeEach(async ({ page }) => {
await restoreSqliteSnapshot(page); await restoreSqliteSnapshot(page);
}); });
@ -11,30 +25,20 @@ test.describe("Monitor Form", () => {
await page.goto("./add"); await page.goto("./add");
await login(page); await login(page);
await screenshot(testInfo, page); await screenshot(testInfo, page);
await selectMonitorType(page);
const monitorTypeSelect = page.getByTestId("monitor-type-select");
await expect(monitorTypeSelect).toBeVisible();
await monitorTypeSelect.selectOption("dns");
const selectedValue = await monitorTypeSelect.evaluate(select => select.value);
expect(selectedValue).toBe("dns");
// Add Conditions & verify:
await page.getByTestId("add-condition-button").click(); await page.getByTestId("add-condition-button").click();
expect(await page.getByTestId("condition").count()).toEqual(2); // 1 added by default + 1 explicitly added expect(await page.getByTestId("condition").count()).toEqual(2); // 1 added by default + 1 explicitly added
// Add a Condition Group & verify:
await page.getByTestId("add-group-button").click(); await page.getByTestId("add-group-button").click();
expect(await page.getByTestId("condition-group").count()).toEqual(1); expect(await page.getByTestId("condition-group").count()).toEqual(1);
expect(await page.getByTestId("condition").count()).toEqual(3); // 2 solo conditions + 1 condition in group expect(await page.getByTestId("condition").count()).toEqual(3); // 2 solo conditions + 1 condition in group
await screenshot(testInfo, page); await screenshot(testInfo, page);
// Remove a condition & verify:
await page.getByTestId("remove-condition").first().click(); await page.getByTestId("remove-condition").first().click();
expect(await page.getByTestId("condition").count()).toEqual(2); // 1 solo condition + 1 condition in group expect(await page.getByTestId("condition").count()).toEqual(2); // 1 solo condition + 1 condition in group
// Remove a condition group & verify:
await page.getByTestId("remove-condition-group").first().click(); await page.getByTestId("remove-condition-group").first().click();
expect(await page.getByTestId("condition-group").count()).toEqual(0); expect(await page.getByTestId("condition-group").count()).toEqual(0);
@ -45,33 +49,29 @@ test.describe("Monitor Form", () => {
await page.goto("./add"); await page.goto("./add");
await login(page); await login(page);
await screenshot(testInfo, page); await screenshot(testInfo, page);
await selectMonitorType(page);
const monitorTypeSelect = page.getByTestId("monitor-type-select");
await expect(monitorTypeSelect).toBeVisible();
await monitorTypeSelect.selectOption("dns");
const selectedValue = await monitorTypeSelect.evaluate(select => select.value);
expect(selectedValue).toBe("dns");
const friendlyName = "Example DNS NS"; const friendlyName = "Example DNS NS";
await page.getByTestId("friendly-name-input").fill(friendlyName); await page.getByTestId("friendly-name-input").fill(friendlyName);
await page.getByTestId("hostname-input").fill("example.com"); await page.getByTestId("hostname-input").fill("example.com");
// Vue-Multiselect component
const resolveTypeSelect = page.getByTestId("resolve-type-select"); const resolveTypeSelect = page.getByTestId("resolve-type-select");
await resolveTypeSelect.click(); await resolveTypeSelect.click();
await resolveTypeSelect.getByRole("option", { name: "NS" }).click(); await resolveTypeSelect.getByRole("option", { name: "NS" }).click();
await page.getByTestId("add-condition-button").click(); await page.getByTestId("add-condition-button").click();
expect(await page.getByTestId("condition").count()).toEqual(2); // 1 added by default + 1 explicitly added expect(await page.getByTestId("condition").count()).toEqual(2); // 1 added by default + 1 explicitly added
await page.getByTestId("condition-value").nth(0).fill("a.iana-servers.net"); await page.getByTestId("condition-value").nth(0).fill("a.iana-servers.net");
await page.getByTestId("condition-and-or").nth(0).selectOption("or"); await page.getByTestId("condition-and-or").nth(0).selectOption("or");
await page.getByTestId("condition-value").nth(1).fill("b.iana-servers.net"); await page.getByTestId("condition-value").nth(1).fill("b.iana-servers.net");
await screenshot(testInfo, page);
await screenshot(testInfo, page);
await page.getByTestId("save-button").click(); await page.getByTestId("save-button").click();
await page.waitForURL("/dashboard/*"); // wait for the monitor to be created await page.waitForURL("/dashboard/*");
await expect(page.getByTestId("monitor-status")).toHaveText("up", { ignoreCase: true });
expect(page.getByTestId("monitor-status")).toHaveText("up", { ignoreCase: true });
await screenshot(testInfo, page); await screenshot(testInfo, page);
}); });
@ -79,31 +79,26 @@ test.describe("Monitor Form", () => {
await page.goto("./add"); await page.goto("./add");
await login(page); await login(page);
await screenshot(testInfo, page); await screenshot(testInfo, page);
await selectMonitorType(page);
const monitorTypeSelect = page.getByTestId("monitor-type-select");
await expect(monitorTypeSelect).toBeVisible();
await monitorTypeSelect.selectOption("dns");
const selectedValue = await monitorTypeSelect.evaluate(select => select.value);
expect(selectedValue).toBe("dns");
const friendlyName = "Example DNS NS"; const friendlyName = "Example DNS NS";
await page.getByTestId("friendly-name-input").fill(friendlyName); await page.getByTestId("friendly-name-input").fill(friendlyName);
await page.getByTestId("hostname-input").fill("example.com"); await page.getByTestId("hostname-input").fill("example.com");
// Vue-Multiselect component
const resolveTypeSelect = page.getByTestId("resolve-type-select"); const resolveTypeSelect = page.getByTestId("resolve-type-select");
await resolveTypeSelect.click(); await resolveTypeSelect.click();
await resolveTypeSelect.getByRole("option", { name: "NS" }).click(); await resolveTypeSelect.getByRole("option", { name: "NS" }).click();
expect(await page.getByTestId("condition").count()).toEqual(1); // 1 added by default expect(await page.getByTestId("condition").count()).toEqual(1); // 1 added by default
await page.getByTestId("condition-value").nth(0).fill("definitely-not.net");
await screenshot(testInfo, page);
await page.getByTestId("condition-value").nth(0).fill("definitely-not.net");
await screenshot(testInfo, page);
await page.getByTestId("save-button").click(); await page.getByTestId("save-button").click();
await page.waitForURL("/dashboard/*"); // wait for the monitor to be created await page.waitForURL("/dashboard/*");
await expect(page.getByTestId("monitor-status")).toHaveText("down", { ignoreCase: true });
expect(page.getByTestId("monitor-status")).toHaveText("down", { ignoreCase: true });
await screenshot(testInfo, page); await screenshot(testInfo, page);
}); });
}); });

View file

@ -5,6 +5,10 @@ test.describe("Uptime Kuma Setup", () => {
test.skip(() => getSqliteDatabaseExists(), "Must only run once per session"); test.skip(() => getSqliteDatabaseExists(), "Must only run once per session");
test.afterEach(async ({ page }, testInfo) => {
await screenshot(testInfo, page);
});
/* /*
* Setup * Setup
*/ */
@ -15,10 +19,9 @@ test.describe("Uptime Kuma Setup", () => {
await page.getByRole("button", { name: "Next" }).click(); await page.getByRole("button", { name: "Next" }).click();
await screenshot(testInfo, page); await screenshot(testInfo, page);
await page.waitForURL("/setup"); // ensures the server is ready to continue to the next test await page.waitForURL("/setup"); // ensures the server is ready to continue to the next test
await screenshot(testInfo, page);
}); });
test("setup admin", async ({ page }, testInfo) => { test("setup admin", async ({ page }) => {
await page.goto("./"); await page.goto("./");
await page.getByPlaceholder("Username").click(); await page.getByPlaceholder("Username").click();
await page.getByPlaceholder("Username").fill("admin"); await page.getByPlaceholder("Username").fill("admin");
@ -27,30 +30,26 @@ test.describe("Uptime Kuma Setup", () => {
await page.getByPlaceholder("Password", { exact: true }).press("Tab"); await page.getByPlaceholder("Password", { exact: true }).press("Tab");
await page.getByPlaceholder("Repeat Password").fill("admin123"); await page.getByPlaceholder("Repeat Password").fill("admin123");
await page.getByRole("button", { name: "Create" }).click(); await page.getByRole("button", { name: "Create" }).click();
await screenshot(testInfo, page);
}); });
/* /*
* All other tests should be run after setup * All other tests should be run after setup
*/ */
test("login", async ({ page }, testInfo) => { test("login", async ({ page }) => {
await page.goto("./dashboard"); await page.goto("./dashboard");
await login(page); await login(page);
await screenshot(testInfo, page);
}); });
test("logout", async ({ page }, testInfo) => { test("logout", async ({ page }) => {
await page.goto("./dashboard"); await page.goto("./dashboard");
await login(page); await login(page);
await page.getByText("A", { exact: true }).click(); await page.getByText("A", { exact: true }).click();
await page.getByRole("button", { name: "Log out" }).click(); await page.getByRole("button", { name: "Log out" }).click();
await screenshot(testInfo, page);
}); });
test("take sqlite snapshot", async ({ page }, testInfo) => { test("take sqlite snapshot", async ({ page }) => {
await takeSqliteSnapshot(page); await takeSqliteSnapshot(page);
await screenshot(testInfo, page);
}); });
}); });

View file

@ -95,7 +95,7 @@ test.describe("Status Page", () => {
await expect(page.getByTestId("powered-by")).toHaveCount(0); await expect(page.getByTestId("powered-by")).toHaveCount(0);
await expect(page.getByTestId("update-countdown-text")).toContainText("00:"); await expect(page.getByTestId("update-countdown-text")).toContainText("00:");
const updateCountdown = Number((await page.getByTestId("update-countdown-text").textContent()).match(/(\d+):(\d+)/)[2]) ; const updateCountdown = Number((await page.getByTestId("update-countdown-text").textContent()).match(/(\d+):(\d+)/)[2]);
expect(updateCountdown).toBeGreaterThanOrEqual(refreshInterval); // cant be certain when the timer will start, so ensure it's within expected range expect(updateCountdown).toBeGreaterThanOrEqual(refreshInterval); // cant be certain when the timer will start, so ensure it's within expected range
expect(updateCountdown).toBeLessThanOrEqual(refreshInterval + 10); expect(updateCountdown).toBeLessThanOrEqual(refreshInterval + 10);