Ryan Kegel
db6e0a7ce8
All checks were successful
Chore App Build, Test, and Push Docker Images / build-and-push (push) Successful in 2m38s
- 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.
66 lines
3.6 KiB
Markdown
66 lines
3.6 KiB
Markdown
# Parent Profile Button
|
||
|
||
## Application Overview
|
||
|
||
In parent mode, the top right of the screen should display the parent's profile icon. When clicking this icon, a menu should appear giving options to select.
|
||
This is a parent mode only test, and probably should be in it's own bucket of tests
|
||
|
||
**Profile Button Badge:**
|
||
|
||
- There are 2 modes for the parent profile button in parent mode: Temporary access and Permanent access.
|
||
- In temporary mode, there is no badge overlaying the profile icon button. This mode will revert back to child mode after after 1 minute or a reload of the site (see feat-parent-mode-expire.md)
|
||
- In permanent mode, there should be a lock emoji badge over the icon button. This lets the user know that parent mode is active for 2 days. Reloading the page still keeps permanent mode. (see feat-parent-mode-expire.md)
|
||
|
||
**Profile Button Menu Options:**
|
||
When clicking the profile button, we should see the user's selected profile picture, name, and email. Verify those are present. Under this are options.
|
||
|
||
1. Profile
|
||
- This option should take the user to the Edit Profile page. We just need to verify that page is there, testing the page will be for another plan.
|
||
2. Child Mode
|
||
- Clicking this will take us out of parent mode and back to child mode. This can be verified by no longer having the view-selector navigation tab at the top-middle of the screen.
|
||
- In Child mode, clicking the profile button again should prompt us for the parent PIN.
|
||
- Entering the correct PIN will take us back into temporary parent mode. It will take us back into permanent parent mode if the checkbox is selected during PIN entry.
|
||
3. Sign Out
|
||
- This will take us back to the landing page.
|
||
|
||
---
|
||
|
||
## Implementation
|
||
|
||
### Constants
|
||
|
||
`E2E_FIRST_NAME` and `STORAGE_STATE_TEMP_PARENT` were added to `e2e/e2e-constants.ts`. `E2E_FIRST_NAME` holds the first name of the seeded test user and is used to verify the name appears in the profile menu.
|
||
|
||
### Auth Setup
|
||
|
||
`e2e/auth-temp-parent.setup.ts` was created to produce a temporary parent mode storage state (logs in and enters PIN without checking "Stay in parent mode"). It depends on `setup` so it runs after the database is seeded.
|
||
|
||
### Playwright Projects (`playwright.config.ts`)
|
||
|
||
Two new isolated projects were added:
|
||
|
||
- **`chromium-profile-button`** — uses the standard permanent parent mode storage state. Runs all spec files under `e2e/mode_parent/profile-button/`.
|
||
- **`chromium-profile-button-temp`** — uses the temporary parent mode storage state. Runs the temporary-mode badge spec only.
|
||
|
||
Both projects are excluded from the catch-all `chromium-tasks-rewards` project.
|
||
|
||
### Test Files
|
||
|
||
**`e2e/mode_parent/profile-button/profile-button.spec.ts`** ✅ IMPLEMENTED
|
||
|
||
Covers all permanent parent mode scenarios (7 tests):
|
||
|
||
1. **Badge – 🔒 visible in permanent mode** ✅
|
||
2. **Menu – shows user name and email** ✅
|
||
3. **Menu → Profile navigates to User Profile page** ✅
|
||
4. **Menu → Child Mode exits parent mode** ✅ (view-selector disappears, button label changes to "Parent login")
|
||
5. **Menu → Child Mode re-entry without checkbox enters temporary mode** ✅ (no 🔒 badge after re-entry)
|
||
6. **Menu → Child Mode re-entry with checkbox enters permanent mode** ✅ (🔒 badge visible after re-entry)
|
||
7. **Menu → Sign Out navigates to landing page** ✅ ("Sign In" nav button visible)
|
||
|
||
**`e2e/mode_parent/profile-button/profile-button-temporary.spec.ts`** ✅ IMPLEMENTED
|
||
|
||
Covers the temporary parent mode badge scenario (1 test):
|
||
|
||
1. **Badge – no 🔒 badge in temporary mode** ✅ (enters temp mode by exiting to child mode then re-entering PIN without "Stay" checkbox)
|