[Test] playwright gckey login test

apps/playwright/.env.example

@@ -3,3 +3,5 @@
 #TEST_TIMEOUT=30000
 #EXPECT_TIMEOUT=5000
 #BASE_URL=http://localhost:8000
+#GCKEY_USERNAME=
+#GCKEY_PASSWORD=

apps/playwright/fixtures/SignInFixture.ts

@@ -0,0 +1,10 @@
+import { test as base } from "@playwright/test";
+
+import { SignInPage } from "./SignInPage";
+
+export const test = base.extend<{ signInPage: SignInPage }>({
+  signInPage: async ({ page }, use) => {
+    const signInPage = new SignInPage(page);
+    await use(signInPage);
+  },
+});

apps/playwright/fixtures/SignInPage.ts

@@ -0,0 +1,35 @@
+import { type Page, type Locator} from "@playwright/test";
+
+export class SignInPage {
+  readonly page: Page;
+  readonly url: string = "https://talent.canada.ca/en/";
+  readonly usernameInputLocator: Locator;
+  readonly passwordInputLocator: Locator;
+  readonly signInButtonLocator: Locator;
+  readonly continueButtonLocator: Locator;
+
+  public constructor(page: Page) {
+    this.page = page;
+    this.usernameInputLocator = page.getByPlaceholder("Username");
+    this.passwordInputLocator = page.getByPlaceholder("Password");
+    this.signInButtonLocator = page.getByRole("link", { name: "Sign in" });
+    this.continueButtonLocator = page.locator('button:has-text("Continue")');
+  }
+  async visit() {
+    await this.page.goto(this.url);
+  }
+  async login(email: string, password: string) {
+    await this.usernameInputLocator.fill(email);
+    await this.passwordInputLocator.fill(password);
+    await this.signInButtonLocator.click();
+  }
+
+  async isSignedIn() {
+    const welcomeLocator = this.page.locator('div:has-text("welcome")');
+    return await welcomeLocator.isVisible();
+  }
+
+  async clickContinue() {
+    await this.continueButtonLocator.click();
+  }
+}

apps/playwright/playwright.config.ts

@@ -9,7 +9,14 @@ import { defineConfig, devices } from "@playwright/test";
 /**
  * See https://playwright.dev/docs/test-configuration.
  */
-export default defineConfig({
+
+// Extend PlaywrightTestConfig to include custom properties
+interface CustomTestConfig extends PlaywrightTestConfig {
+  gckeyUsername?: string;
+  gckeyPassword?: string;
+}
+
+export default defineConfig<CustomTestConfig>({
   testDir: "./tests",
   /* Run tests in files in parallel */
   fullyParallel: true,
@@ -35,6 +42,9 @@ export default defineConfig({
 
     /* ignore HTTPS errors when sending network requests */
     ignoreHTTPSErrors: true,
+
+    gckeyUsername: process.env.GCKEY_USERNAME ?? "",
+    gckeyPassword: process.env.GCKEY_PASSWORD ?? "",
   },
 
   /* Configure projects for major browsers */

apps/playwright/tests/gcKey-login.spec.ts

@@ -0,0 +1,35 @@
+import { test as base, expect } from "@playwright/test";
+
+import { SignInPage } from "../fixtures/SignInPage";
+
+export const test = base.extend<{ signInPage: SignInPage }>({
+  signInPage: async ({ page }, use) => {
+    const signInPage = new SignInPage(page);
+    await use(signInPage);
+  },
+});
+
+test("user signs in, sees welcome message, and navigates to dashboard", async ({
+  page,
+}) => {
+  const signInPage = new SignInPage(page);
+
+  // Visit the login page
+  await signInPage.visit();
+
+  // Perform the login
+  await signInPage.login(
+    process.env.GCKEY_USERNAME,
+    process.env.GCKEY_USERNAME,
+  );
+
+  // Assert that the user is signed in by checking the welcome message
+  const isSignedIn = await signInPage.isSignedIn();
+  expect(isSignedIn).toBe(true);
+
+  await signInPage.clickContinue();
+
+  const applicantDashboardUrl = process.env.BASE_URL + "/applicant";
+  await page.waitForURL(applicantDashboardUrl);
+  expect(page.url()).toBe(applicantDashboardUrl);
+});

infrastructure/azure-pipelines-dev.yml

@@ -21,6 +21,9 @@ jobs:
   - job: run_playwright_tests
     displayName: Run Playwright tests
     timeoutInMinutes: 30
+    env:
+      GCKEY_USERNAME: $(GCKEY_USERNAME)
+      GCKEY_PASSWORD: $(GCKEY_PASSWORD)
     steps:
       - checkout: self
         clean: true