(test) Tweaks to the login e2e test

README.md

@@ -173,8 +173,6 @@ dev server, you will need to link the tooling as well.
 In packages/shell/esm-app-shell, run `yarn build:development --watch` to ensure that the built app shell is updated with your changes and available to the patient chart.
 Then run your patient chart dev server as usual, with `yarn start`.
 
-If you're not able to get this working, try the 
-
 #### Method 2: Using import map overrides
 
 Read the [dev documentation](https://o3-dev.docs.openmrs.org/#/getting_started/setup?id=import-map-overrides)

e2e/specs/login.spec.ts

@@ -2,37 +2,46 @@ import { test } from '../core';
 import { expect } from '@playwright/test';
 import { LoginPage } from '../pages';
 
-test('Should login as Admin', async ({ page }) => {
+test("Login as Admin user", async ({ page }) => {
   const loginPage = new LoginPage(page);
 
-  await test.step('When I goto the login page', async () => {
+  await test.step("When I navigate to the login page", async () => {
     await loginPage.goto();
   });
 
-  await test.step('And I enter the username', async () => {
-    await page.locator('#username').fill(`${process.env.E2E_USER_ADMIN_USERNAME}`);
-    await page.getByText('Continue').click();
+  await test.step("And I enter my username", async () => {
+    await page
+      .getByLabel(/username/i)
+      .fill(`${process.env.E2E_USER_ADMIN_USERNAME}`);
+    await page.getByText(/continue/i).click();
   });
 
-  await test.step('And I enter the password', async () => {
-    await page.locator('#password').fill(`${process.env.E2E_USER_ADMIN_PASSWORD}`);
+  await test.step("And I enter my password", async () => {
+    await page
+      .getByLabel(/password/i)
+      .fill(`${process.env.E2E_USER_ADMIN_PASSWORD}`);
   });
 
-  await test.step('And I click login buttion', async () => {
-    await page.getByText('Log in').click();
+  await test.step("And I click the `Log in` button", async () => {
+    await page.getByRole("button", { name: /log in/i }).click();
   });
 
-  await test.step('And I choose the location', async () => {
-    await page.getByText('Outpatient clinic').click();
-    await page.getByText('Confirm').click();
+  await test.step("And I choose a login location", async () => {
+    await expect(page).toHaveURL(
+      `${process.env.E2E_BASE_URL}/spa/login/location`
+    );
+    await page.getByText(/outpatient clinic/i).click();
+    await page.getByRole("button", { name: /confirm/i }).click();
   });
 
-  await test.step('Then I should be logged in', async () => {
+  await test.step("Then I should get navigated to the home page", async () => {
     await expect(page).toHaveURL(`${process.env.E2E_BASE_URL}/spa/home`);
   });
 
-  await test.step('Then I logged out', async () => {
-    await page.getByRole('button', { name: 'Users' }).click();
-    await page.getByText('Logout').click();
+  await test.step("And I should be able to see various elements on the page", async () => {
+    await page.getByRole("button", { name: "Users" }).click();
+    await expect(page.getByText(/super user/i)).toBeVisible();
+    await expect(page.getByText(/outpatient clinic/i)).toBeVisible();
+    await expect(page.getByRole("button", { name: /logout/i })).toBeVisible();
   });
 });