From b426d07d00c94b3b9ae5c94c57e63b5ce36f2691 Mon Sep 17 00:00:00 2001
From: Hinton <hinton@users.noreply.github.com>
Date: Thu, 9 Oct 2025 18:26:36 -0700
Subject: [PATCH] Use ids

---
 .../src/app/auth/login/example.play.spec.ts   | 19 +++++++----------
 .../src/angular/login/login.component.html    | 21 ++++++++++++++++---
 2 files changed, 26 insertions(+), 14 deletions(-)

diff --git a/apps/web/src/app/auth/login/example.play.spec.ts b/apps/web/src/app/auth/login/example.play.spec.ts
index 00d4b0639c8..69e79f6cac1 100644
--- a/apps/web/src/app/auth/login/example.play.spec.ts
+++ b/apps/web/src/app/auth/login/example.play.spec.ts
@@ -5,17 +5,14 @@ import { Play, SingleUserRecipe } from "@bitwarden/playwright-scenes";
 test("login with password", async ({ page }) => {
   using scene = await Play.scene(new SingleUserRecipe({ email: "test@example.com" }));
 
-  await page.goto("https://localhost:8080/#/login");
-  await page.getByRole("textbox", { name: "Email address (required)" }).click();
-  await page
-    .getByRole("textbox", { name: "Email address (required)" })
-    .fill(scene.mangle("test@example.com"));
-  await page.getByRole("textbox", { name: "Email address (required)" }).press("Enter");
-  await page.getByRole("textbox", { name: "Master password (required)" }).click();
-  await page
-    .getByRole("textbox", { name: "Master password (required)" })
-    .fill(scene.mangle("asdfasdfasdf"));
-  await page.getByRole("button", { name: "Log in with master password" }).click();
+  await page.goto("/#/login");
+
+  await page.locator("#login_input_email").fill(scene.mangle("test@example.com"));
+  await page.locator("#login_button_continue").click();
+
+  await page.locator("#login_input_password").fill("asdfasdfasdf");
+  await page.locator("#login_button_submit").click();
+
   await expect(page.getByRole("button", { name: "Add it later" })).toBeVisible();
   await page.getByRole("button", { name: "Add it later" }).click();
   await expect(page.locator("bit-simple-dialog")).toContainText(
diff --git a/libs/auth/src/angular/login/login.component.html b/libs/auth/src/angular/login/login.component.html
index 26e19f11147..ca436fb034f 100644
--- a/libs/auth/src/angular/login/login.component.html
+++ b/libs/auth/src/angular/login/login.component.html
@@ -1,4 +1,4 @@
-<!-- 
+<!--
   # Table of Contents
 
     This file contains a single consolidated template for all visual clients.
@@ -16,6 +16,7 @@
     <bit-form-field>
       <bit-label>{{ "emailAddress" | i18n }}</bit-label>
       <input
+        id="login_input_email"
         type="email"
         formControlName="email"
         bitInput
@@ -39,6 +40,7 @@
     <div class="tw-grid tw-gap-3">
       <!-- Continue button -->
       <button
+        id="login_button_continue"
         type="button"
         bitButton
         block
@@ -78,7 +80,13 @@
     <!-- Master Password input -->
     <bit-form-field class="!tw-mb-1">
       <bit-label>{{ "masterPass" | i18n }}</bit-label>
-      <input type="password" formControlName="masterPassword" bitInput #masterPasswordInputRef />
+      <input
+        id="login_input_password"
+        type="password"
+        formControlName="masterPassword"
+        bitInput
+        #masterPasswordInputRef
+      />
       <button type="button" bitIconButton bitSuffix bitPasswordInputToggle></button>
     </bit-form-field>
 
@@ -89,7 +97,14 @@
 
     <div class="tw-grid tw-gap-3">
       <!-- Submit button to Login with Master Password -->
-      <button type="submit" bitButton bitFormButton block buttonType="primary">
+      <button
+        id="login_button_submit"
+        type="submit"
+        bitButton
+        bitFormButton
+        block
+        buttonType="primary"
+      >
         {{ "loginWithMasterPassword" | i18n }}
       </button>