feat: Implement user profile and parent profile button tests

- Added tests for user profile editing, including name changes, image uploads, and password changes.
- Implemented tests for changing the parent PIN with verification code handling.
- Created tests for account deletion with confirmation dialog and email validation.
- Introduced parent profile button tests for both temporary and permanent modes, verifying badge visibility and menu options.
- Updated Playwright configuration to include new test buckets for user profile and parent profile button scenarios.
- Added e2e plans documentation for user profile and parent profile button tests.

frontend/vue-app/e2e/plans/user-profile.plan.md

@@ -0,0 +1,169 @@
+# User Profile
+
+## Application Overview
+
+The User Profile page at `/parent/profile` allows changing a profile image, first name, and last name. It also provides links to: Change Parent PIN, Change Password, and Delete Account. Save and Cancel buttons control form submission.
+
+**Email resolution for e2e PIN/password tests:** A test-only backend endpoint (`GET /user/e2e-get-pin-code`) returns the verification code directly. This endpoint is gated to non-production environments. Password reset tests simply verify the email-sent modal appears without inspecting the actual email.
+
+---
+
+## Implementation
+
+Tests are split into three isolated Playwright project buckets, all under `e2e/mode_parent/user-profile/`.
+
+## Playwright Projects
+
+| Project                        | File                      | Notes                                       |
+| ------------------------------ | ------------------------- | ------------------------------------------- |
+| `chromium-user-profile`        | `profile-editing.spec.ts` | Restores profile via API in `afterEach`     |
+| `chromium-user-profile-pin`    | `change-pin.spec.ts`      | Restores original PIN via API in `afterAll` |
+| `chromium-user-profile-delete` | `delete-account.spec.ts`  | Re-seeds entire DB in `afterAll`; run last  |
+
+**Config:** `playwright.config.ts` — all three depend on `setup` only.
+
+---
+
+## Test Scenarios
+
+### 1. Profile Editing ✅ IMPLEMENTED
+
+**File:** `e2e/mode_parent/user-profile/profile-editing.spec.ts`
+
+**Seed:** Snapshots profile via API in `beforeEach`; restores it in `afterEach`.
+
+#### 1.1. Page loads with correct data ✅
+
+- Profile heading is visible; First Name, Last Name, and Email fields show the seeded e2e values
+
+#### 1.2. Cancel navigates back ✅
+
+- Clicking Cancel returns to the previous page without saving
+
+#### 1.3. Save disabled when form is clean ✅
+
+- Save button is disabled when no fields have been changed
+
+#### 1.4. Save disabled when First Name is empty ✅
+
+- Clearing the First Name field disables the Save button
+
+#### 1.5. Save disabled when Last Name is empty ✅
+
+- Clearing the Last Name field disables the Save button
+
+#### 1.6. Save disabled when both name fields are empty ✅
+
+- Clearing both fields keeps Save disabled
+
+#### 1.7. Save enables when a name is changed ✅
+
+- Editing any name field enables the Save button
+
+#### 1.8. Save persists name changes ✅
+
+- After saving, re-opening the profile shows the new values; a "Profile Updated" confirmation modal appears on save
+
+#### 1.9. Cancel discards unsaved changes ✅
+
+- Changes made before Cancel are not reflected when the profile is re-opened
+
+#### 1.10. Email field is read-only ✅
+
+- The email input is disabled and shows the account email
+
+#### 1.11. Change profile image (built-in) ✅
+
+- Selecting an unselected built-in image and saving shows the confirmation modal; image persists on reload
+
+#### 1.12. Upload a custom profile image ✅
+
+- Using "Add from device" to upload a local file selects it as the profile image; saving shows the confirmation modal
+
+#### 1.13. Change Password shows email-sent modal ✅
+
+- Clicking Change Password shows a loading modal that transitions to a "Password Change Email Sent" confirmation; OK dismisses it and returns to the profile page
+
+---
+
+### 2. Change Parent PIN ✅ IMPLEMENTED
+
+**File:** `e2e/mode_parent/user-profile/change-pin.spec.ts`
+
+**Seed:** Restores the original e2e PIN via the test API helper in `afterAll`.
+
+#### 2.1. Change Parent PIN link navigates to PIN setup page ✅
+
+- Clicking the link navigates to `/parent/pin-setup` and shows the "Set up your Parent PIN" step
+
+#### 2.2. Back from PIN setup returns to profile ✅
+
+- Browser back from the PIN setup page returns to `/parent/profile`
+
+#### 2.3. Send Verification Code advances to step 2 ✅
+
+- Clicking the button shows the "Enter Verification Code" step with a code input; Verify Code is disabled while the input is empty
+
+#### 2.4. Resend Code button appears after delay ✅
+
+- A "Resend Code" button appears within ~10 seconds of reaching step 2
+
+#### 2.5. Invalid code shows error ✅
+
+- Submitting a wrong code shows an "invalid code" error message
+
+#### 2.6. Valid code advances to step 3 (Create PIN) ✅
+
+- Entering the code from the test endpoint and clicking Verify Code shows the "Create Parent PIN" step with New PIN and Confirm PIN fields; Set PIN is initially disabled
+
+#### 2.7. Set PIN disabled when PINs do not match ✅
+
+- Entering different values in both fields keeps Set PIN disabled
+
+#### 2.8. Set PIN disabled for fewer than 4 digits ✅
+
+- Entering a 2-digit value in both fields keeps Set PIN disabled
+
+#### 2.9. Set PIN succeeds with matching 4-digit PIN ✅
+
+- Entering matching 4-digit values and clicking Set PIN shows the "Parent PIN Set!" success step with a Back button
+
+#### 2.10. Back from success step exits parent mode ✅
+
+- Clicking Back on the success step navigates to the child selector (`/child`) and exits parent mode
+
+---
+
+### 3. Delete Account ✅ IMPLEMENTED
+
+**File:** `e2e/mode_parent/user-profile/delete-account.spec.ts`
+
+**Seed:** Re-seeds the entire e2e database via `POST /auth/e2e-seed` in `afterAll` to restore the test user.
+
+#### 3.1. Delete My Account opens confirmation dialog ✅
+
+- Clicking the button shows a "Delete Your Account?" modal with an email confirmation input; Delete is disabled and Cancel is visible
+
+#### 3.2. Delete button stays disabled for incomplete email ✅
+
+- Entering a partial email keeps the Delete button disabled
+
+#### 3.3. Delete button enables when matching email is entered ✅
+
+- Entering the exact account email enables the Delete button
+
+#### 3.4. Cancel closes the dialog without deleting ✅
+
+- Clicking Cancel dismisses the modal and stays on the profile page with no account changes
+
+#### 3.5. Backdrop click does NOT close the dialog ✅
+
+- Clicking the modal backdrop leaves the dialog open (no backdrop-dismiss behavior)
+
+#### 3.6. Successful deletion redirects to landing page ✅
+
+- After entering the email and clicking Delete, an "Account Deleted" confirmation modal appears; clicking OK redirects to the landing page (`/`)
+
+#### 3.7. Login after deletion is blocked ✅
+
+- Attempting to sign in with the deleted account's credentials shows a "marked for deletion" error and stays on the login page