Feat: Improving tests by using text assertion

- Renamed assertModificationStatus to assertTextValue and replaced instances of the former.
- Reviewed all usages of "getByText()" in /lxd-ui/tests/ and replaced with assertTextValue where appropriate.
- Rewrote the function to conditionally account for getByText instances where an Exact match was required.

Signed-off-by: Nkeiruka <nkeiruka.whenu@canonical.com>

tests/devices.spec.ts

@@ -16,6 +16,7 @@ import {
 } from "./helpers/instances";
 import { attachVolume, detachVolume } from "./helpers/devices";
 import { deleteVolume, randomVolumeName } from "./helpers/storageVolume";
+import { assertTextVisible } from "./helpers/permissions";
 
 test("instance attach custom volumes and detach inherited volumes", async ({
   page,
@@ -41,7 +42,7 @@ test("instance attach custom volumes and detach inherited volumes", async ({
   await saveInstance(page, instance);
 
   await page.getByRole("gridcell", { name: "Detached" }).click();
-  await page.getByText("/baz").click();
+  await assertTextVisible(page, "/baz");
 
   await deleteInstance(page, instance);
   await deleteVolume(page, instanceVolume);

tests/helpers/permissions.ts

@@ -8,12 +8,13 @@ export const skipIfNotSupported = (lxdVersion: LxdVersions) =>
     "Fine grained authorisation is not available for lxd 5.0",
   );
 
-export const assertModificationStatus = async (
+export const assertTextVisible = async (
   page: Page,
-  statusText: string,
+  textValue: string,
+  exact = false,
 ) => {
-  const status = page.getByText(statusText);
-  await expect(status).toBeVisible();
+  const textLocator = page.getByText(textValue, { exact: exact });
+  await expect(textLocator).toBeVisible();
 };
 
 export const undoChange = async (page: Page) => {

tests/instances.spec.ts

@@ -25,6 +25,7 @@ import {
   deleteProfile,
   randomProfileName,
 } from "./helpers/profile";
+import { assertTextVisible } from "./helpers/permissions";
 
 let instance = randomInstanceName();
 let vmInstance = randomInstanceName();
@@ -55,7 +56,7 @@ test("instance terminal operations", async ({ page }) => {
   await page.getByRole("button", { name: "Reconnect" }).click();
   await page.getByLabel("Command").fill("sh");
   await page.getByLabel("submit reconnect").click();
-  await expect(page.getByText("~ #")).toBeVisible();
+  await assertTextVisible(page, "~ #");
   await page.waitForTimeout(1000); // ensure the terminal is ready
   await page.keyboard.type("cat /etc/issue");
   await page.keyboard.press("Enter");
@@ -85,7 +86,7 @@ test("instance edit basic details", async ({ page }) => {
 
   await saveInstance(page, instance);
 
-  await page.getByText("DescriptionA-new-description").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
   await expect(page.locator("#profile-0")).toHaveValue(profile);
   await expect(page.locator("#profile-1")).toHaveValue("default");
 });
@@ -213,17 +214,13 @@ test("instance yaml edit", async ({ page }) => {
   test.skip(Boolean(process.env.CI), "github runners lack vm support");
   await editInstance(page, vmInstance);
   await page.getByText("YAML configuration").click();
-
   await page.locator(".view-lines").click();
-  await page.keyboard.press("PageDown");
-  await page.keyboard.press("PageDown");
-  await page.keyboard.press("PageDown");
   await page.getByText("description: ''").click();
   await page.keyboard.press("End");
   await page.keyboard.press("ArrowLeft");
   await page.keyboard.type("A-new-description");
   await saveInstance(page, vmInstance);
 
   await page.getByText("Main configuration").click();
-  await page.getByText("DescriptionA-new-description").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
 });

tests/iso-volumes.spec.ts

@@ -1,6 +1,7 @@
 import { test, expect } from "./fixtures/lxd-test";
 import { randomNameSuffix } from "./helpers/name";
 import { deleteInstance, randomInstanceName } from "./helpers/instances";
+import { assertTextVisible } from "./helpers/permissions";
 
 const ISO_FILE = "./tests/fixtures/foo.iso";
 
@@ -23,24 +24,24 @@ test("upload and delete custom iso", async ({ page, lxdVersion }) => {
   await page.getByLabel("Alias").fill(isoName);
 
   await page.getByRole("button", { name: "Upload", exact: true }).click();
-  await page.getByText(`Image ${isoName} uploaded successfully`).click();
+  await assertTextVisible(page, `Image ${isoName} uploaded successfully`);
 
   await page.getByPlaceholder("Search for custom ISOs").fill(isoName);
   await page.getByRole("button", { name: "Create instance" }).click();
 
   await page.getByText("YAML configuration").click();
-  await page.getByText("devices:", { exact: true }).click();
-  await page.getByText("iso-volume:", { exact: true }).click();
-  await page.getByText("boot.priority: '10'", { exact: true }).click();
-  await page.getByText(`source: ${isoName}`, { exact: true }).click();
-  await page.getByText("type: disk", { exact: true }).click();
+  await assertTextVisible(page, "devices:", true);
+  await assertTextVisible(page, "iso-volume:", true);
+  await assertTextVisible(page, "boot.priority: '10'", true);
+  await assertTextVisible(page, `source: ${isoName}`, true);
+  await assertTextVisible(page, "type: disk", true);
   await page.getByRole("button", { name: "Cancel", exact: true }).click();
 
   await page.getByPlaceholder("Search for custom ISOs").fill(isoName);
-  await page.getByText("3 B").click();
+  await assertTextVisible(page, "3 B");
   await page.getByRole("button", { name: "Delete" }).click();
   await page.getByText("Delete", { exact: true }).click();
-  await page.getByText(`Custom iso ${isoName} deleted.`).click();
+  await assertTextVisible(page, `Custom iso ${isoName} deleted.`);
 });
 
 test("use custom iso for instance launch", async ({ page, lxdVersion }) => {
@@ -78,7 +79,7 @@ test("use custom iso for instance launch", async ({ page, lxdVersion }) => {
   await page.getByPlaceholder("Search for custom ISOs").fill(isoName);
   await page.getByRole("button", { name: "Delete" }).click();
   await page.getByText("Delete", { exact: true }).click();
-  await page.getByText(`Custom iso ${isoName} deleted.`).click();
+  await assertTextVisible(page, `Custom iso ${isoName} deleted.`);
 });
 
 test("not allowed to upload custom iso for lxd v5.0/edge", async ({

tests/permission-groups.spec.ts

@@ -15,7 +15,7 @@ import {
 } from "./helpers/permission-groups";
 import { identityBar, identityFoo } from "./helpers/permission-identities";
 import {
-  assertModificationStatus,
+  assertTextVisible,
   confirmIdentitiesModifiedForGroup,
   redoChange,
   undoChange,
@@ -51,7 +51,7 @@ test("add new permissions to group", async ({ page, lxdVersion }) => {
   await undoChange(page);
   await expect(page.getByText("1 permission will be modified")).toBeHidden();
   await redoChange(page);
-  await assertModificationStatus(page, "1 permission will be modified");
+  await assertTextVisible(page, "1 permission will be modified");
   await page.getByRole("button", { name: "Save changes" }).click();
   await page.waitForSelector(`text=Permissions for group ${group} updated.`);
   await assertGroupPermissionsCount(page, group, 1);
@@ -64,14 +64,14 @@ test("edit existing permission for group", async ({ page, lxdVersion }) => {
   await createGroup(page, group, group);
   await selectGroupAction(page, group, "Manage permissions");
   await addPermission(page, "server", "server", "admin");
-  await assertModificationStatus(page, "1 permission will be modified");
+  await assertTextVisible(page, "1 permission will be modified");
   await page.getByRole("button", { name: "Save changes" }).click();
   await page.waitForSelector(`text=Permissions for group ${group} updated.`);
   await assertGroupPermissionsCount(page, group, 1);
   await selectGroupAction(page, group, "Manage permissions");
   await removePermission(page, "server", "server", "admin");
   await addPermission(page, "project", "default", "can_view");
-  await assertModificationStatus(page, "2 permissions will be modified");
+  await assertTextVisible(page, "2 permissions will be modified");
   await page.getByRole("button", { name: "Save changes" }).click();
   await page.waitForSelector(`text=Permissions for group ${group} updated.`);
   await assertGroupPermissionsCount(page, group, 1);
@@ -84,14 +84,14 @@ test("manage identities for single group", async ({ page, lxdVersion }) => {
   await createGroup(page, group, group);
   await selectGroupAction(page, group, "Manage identities");
   await toggleIdentitiesForGroups(page, [identityFoo, identityBar]);
-  await assertModificationStatus(page, "2 identities will be modified");
+  await assertTextVisible(page, "2 identities will be modified");
   await page.getByRole("button", { name: "Apply 2 identity changes" }).click();
   await confirmIdentitiesModifiedForGroup(page, group, ["foo", "bar"], "added");
   await page.getByRole("button", { name: "Confirm changes" }).click();
   await page.waitForSelector(`text=Updated identities for ${group}`);
   await selectGroupAction(page, group, "Manage identities");
   await toggleIdentitiesForGroups(page, [identityFoo, identityBar]);
-  await assertModificationStatus(page, "2 identities will be modified");
+  await assertTextVisible(page, "2 identities will be modified");
   await page.getByRole("button", { name: "Apply 2 identity changes" }).click();
   await confirmIdentitiesModifiedForGroup(
     page,
@@ -113,7 +113,7 @@ test("manage identities for many groups", async ({ page, lxdVersion }) => {
   await selectGroupsToModify(page, [groupOne, groupTwo]);
   await page.getByRole("button", { name: "Manage identities" }).click();
   await toggleIdentitiesForGroups(page, [identityFoo, identityBar]);
-  await assertModificationStatus(page, "2 identities will be modified");
+  await assertTextVisible(page, "2 identities will be modified");
   await page.getByRole("button", { name: "Apply 2 identity changes" }).click();
   await confirmIdentitiesModifiedForGroup(
     page,
@@ -131,7 +131,7 @@ test("manage identities for many groups", async ({ page, lxdVersion }) => {
   await page.waitForSelector(`text=Updated identities for 2 groups`);
   await page.getByRole("button", { name: "Manage identities" }).click();
   await toggleIdentitiesForGroups(page, [identityFoo, identityBar]);
-  await assertModificationStatus(page, "2 identities will be modified");
+  await assertTextVisible(page, "2 identities will be modified");
   await page.getByRole("button", { name: "Apply 2 identity changes" }).click();
   await confirmIdentitiesModifiedForGroup(
     page,

tests/permission-identities.spec.ts

@@ -12,7 +12,7 @@ import {
   visitIdentitiesPage,
 } from "./helpers/permission-identities";
 import {
-  assertModificationStatus,
+  assertTextVisible,
   confirmGroupsModifiedForIdentity,
   redoChange,
   undoChange,
@@ -33,11 +33,11 @@ test("manage groups for single identity", async ({ page, lxdVersion }) => {
     .getByLabel("Manage groups")
     .click();
   await toggleGroupsForIdentities(page, [groupOne, groupTwo]);
-  await assertModificationStatus(page, "2 groups will be modified");
+  await assertTextVisible(page, "2 groups will be modified");
   await undoChange(page);
-  await assertModificationStatus(page, "1 group will be modified");
+  await assertTextVisible(page, "1 group will be modified");
   await redoChange(page);
-  await assertModificationStatus(page, "2 groups will be modified");
+  await assertTextVisible(page, "2 groups will be modified");
   await page.getByRole("button", { name: "Apply 2 group changes" }).click();
   await confirmGroupsModifiedForIdentity(
     page,
@@ -52,7 +52,7 @@ test("manage groups for single identity", async ({ page, lxdVersion }) => {
     .getByLabel("Manage groups")
     .click();
   await toggleGroupsForIdentities(page, [groupOne, groupTwo]);
-  await assertModificationStatus(page, "2 groups will be modified");
+  await assertTextVisible(page, "2 groups will be modified");
   await page.getByRole("button", { name: "Apply 2 group changes" }).click();
   await confirmGroupsModifiedForIdentity(
     page,
@@ -76,7 +76,7 @@ test("manage groups for many identities", async ({ page, lxdVersion }) => {
   await selectIdentitiesToModify(page, [identityFoo, identityBar]);
   await page.getByLabel("Modify groups").click();
   await toggleGroupsForIdentities(page, [groupOne, groupTwo]);
-  await assertModificationStatus(page, "2 groups will be modified");
+  await assertTextVisible(page, "2 groups will be modified");
   await page.getByRole("button", { name: "Apply 2 group changes" }).click();
   await confirmGroupsModifiedForIdentity(
     page,
@@ -94,7 +94,7 @@ test("manage groups for many identities", async ({ page, lxdVersion }) => {
   await page.waitForSelector(`text=Updated groups for 2 identities`);
   await page.getByLabel("Modify groups").click();
   await toggleGroupsForIdentities(page, [groupOne, groupTwo]);
-  await assertModificationStatus(page, "2 groups will be modified");
+  await assertTextVisible(page, "2 groups will be modified");
   await page.getByRole("button", { name: "Apply 2 group changes" }).click();
   await confirmGroupsModifiedForIdentity(
     page,

tests/profiles.spec.ts

@@ -9,6 +9,7 @@ import {
   setOption,
   setSchedule,
 } from "./helpers/configuration";
+import { assertTextVisible } from "./helpers/permissions";
 import {
   createProfile,
   deleteProfile,
@@ -47,7 +48,7 @@ test("profile edit basic details", async ({ page }) => {
 
   await saveProfile(page, profile);
 
-  await page.getByText("DescriptionA-new-description").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
 });
 
 test("profile cpu and memory", async ({ page }) => {
@@ -166,5 +167,5 @@ name: ${profile}`);
   await saveProfile(page, profile);
 
   await page.getByText("Main configuration").click();
-  await page.getByText("DescriptionA-new-description").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
 });

tests/projects.spec.ts

@@ -5,6 +5,7 @@ import {
   setOption,
   setTextarea,
 } from "./helpers/configuration";
+import { assertTextVisible } from "./helpers/permissions";
 import {
   createProject,
   deleteProject,
@@ -46,8 +47,8 @@ test("project edit configuration", async ({ page, lxdVersion }) => {
   } else {
     await page.locator("label").filter({ hasText: "Network zones" }).click();
   }
-  await page.getByText("Allow custom restrictions on a project level").click();
 
+  await page.getByText("Allow custom restrictions on a project level").click();
   await page.getByText("Resource limits").click();
   await setInput(page, "Max number of instances", "Enter number", "1");
   await setInput(page, "Max number of containers", "Enter number", "2");
@@ -106,7 +107,7 @@ test("project edit configuration", async ({ page, lxdVersion }) => {
 
   await page.getByText("Project details").click();
 
-  await page.getByText("DescriptionA-new-description").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
   await expect(page.locator("input#features_networks")).toHaveValue("on");
   if (lxdVersion !== "5.0-edge") {
     await expect(page.locator("input#features_networks_zones")).toHaveValue(

tests/storage.spec.ts

@@ -16,6 +16,7 @@ import {
 } from "./helpers/storageVolume";
 import { activateOverride, setInput } from "./helpers/configuration";
 import { randomSnapshotName } from "./helpers/snapshots";
+import { assertTextVisible } from "./helpers/permissions";
 
 let volume = randomVolumeName();
 
@@ -41,8 +42,8 @@ test("storage pool create, edit and remove", async ({ page }) => {
   await savePool(page, pool);
 
   await page.getByTestId("tab-link-Overview").click();
-  await page.getByText("DescriptionA-new-description").click();
-  await page.getByText("StatusCreated").click();
+  await assertTextVisible(page, "DescriptionA-new-description");
+  await assertTextVisible(page, "StatusCreated");
 
   await deletePool(page, pool);
 });
@@ -53,7 +54,7 @@ test("storage volume create, edit and remove", async ({ page }) => {
   await saveVolume(page, volume);
 
   await page.getByTestId("tab-link-Overview").click();
-  await page.getByText("size2GiB").click();
+  await assertTextVisible(page, "size2GiB");
 });
 
 test("storage volume edit snapshot configuration", async ({

tests/warnings.spec.ts

@@ -1,7 +1,8 @@
 import { test } from "./fixtures/lxd-test";
+import { assertTextVisible } from "./helpers/permissions";
 
 test("view warnings page", async ({ page }) => {
   await page.goto("/ui/");
   await page.getByTitle("Warnings").click();
-  await page.getByText("Last message").click();
+  await assertTextVisible(page, "Last message");
 });