refactor: update to angular 21 and adding tests [no ci]#3
Merged
Conversation
…onComponent, and TitleSectionComponent
…formance and readability
… and state management
…mponent, and UserManagementComponent to verify functionality and error handling
CyAScott
changed the title
There was a problem hiding this comment.
Pull request overview
This PR upgrades the Angular frontend tooling and refactors templates/tests to use modern Angular control-flow syntax and a new testing stack (Vitest for unit tests, Playwright for e2e), with CI updated to run frontend coverage.
Changes:
- Replace Karma/Jasmine testing with Vitest (config, tsconfig updates, and new component/unit specs).
- Update Angular templates to use
@forcontrol flow with explicit tracking. - Add Playwright e2e configuration and run frontend coverage in the PR workflow.
Reviewed changes
Copilot reviewed 34 out of 35 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/MediaBrowser.Frontend/vitest.config.ts | Adds Vitest configuration for Angular + coverage. |
| src/MediaBrowser.Frontend/tsconfig.spec.json | Updates spec TS config to use Vitest globals and disables declarations. |
| src/MediaBrowser.Frontend/src/test-setup.ts | Initializes Angular TestBed environment for Vitest runs. |
| src/MediaBrowser.Frontend/src/app/user-management/user-management.spec.ts | Adds Vitest unit tests for user management flows. |
| src/MediaBrowser.Frontend/src/app/user-management/user-management.html | Converts user list rendering from *ngFor to @for with tracking. |
| src/MediaBrowser.Frontend/src/app/user-management/change-password-modal/change-password-modal.spec.ts | Adds Vitest unit tests for change password modal behavior. |
| src/MediaBrowser.Frontend/src/app/user-management/add-user-modal/add-user-modal.spec.ts | Adds Vitest unit tests for add user modal behavior. |
| src/MediaBrowser.Frontend/src/app/search/search.spec.ts | Adds Vitest unit tests for search behavior, caching, paging, and UI handlers. |
| src/MediaBrowser.Frontend/src/app/search/search.html | Migrates sort option rendering to @for with tracking. |
| src/MediaBrowser.Frontend/src/app/search/search-content.spec.ts | Adds unit tests for search results content component. |
| src/MediaBrowser.Frontend/src/app/search/search-content.html | Migrates results rendering to @for using an explicit track expression. |
| src/MediaBrowser.Frontend/src/app/player/player.ts | Tightens timer-clear condition in hide-timer logic. |
| src/MediaBrowser.Frontend/src/app/player/player.spec.ts | Adds unit tests for player navigation/loading, timer behavior, and volume persistence. |
| src/MediaBrowser.Frontend/src/app/navigation-tabs/navigation-tabs.spec.ts | Adds unit tests for navigation tab routing/logout/dropdown behavior. |
| src/MediaBrowser.Frontend/src/app/meta/meta.spec.ts | Adds unit tests for metadata browsing behavior, scroll persistence, and cleanup. |
| src/MediaBrowser.Frontend/src/app/meta/meta.html | Migrates meta member card rendering to @for. |
| src/MediaBrowser.Frontend/src/app/media-editor/title-section/title-section.component.spec.ts | Adds unit tests for title section emit behavior. |
| src/MediaBrowser.Frontend/src/app/media-editor/thumbnail-section/thumbnail-section.component.spec.ts | Adds extensive unit tests for thumbnail selection/preview generation behaviors. |
| src/MediaBrowser.Frontend/src/app/media-editor/readonly-info-section/readonly-info-section.component.spec.ts | Adds unit tests for formatting helpers (duration, date, size). |
| src/MediaBrowser.Frontend/src/app/media-editor/rating-section/rating-section.html | Migrates star rendering to @for. |
| src/MediaBrowser.Frontend/src/app/media-editor/rating-section/rating-section.component.spec.ts | Adds unit tests for rating interaction/rendering. |
| src/MediaBrowser.Frontend/src/app/media-editor/people-section/typeahead-input.component.spec.ts | Adds unit tests for typeahead filtering, keyboard nav, blur timing, and listeners. |
| src/MediaBrowser.Frontend/src/app/media-editor/people-section/typeahead-input.component.html | Migrates dropdown rendering to @for with index tracking. |
| src/MediaBrowser.Frontend/src/app/media-editor/people-section/people-section.html | Migrates repeated people inputs to @for blocks. |
| src/MediaBrowser.Frontend/src/app/media-editor/people-section/people-section.component.spec.ts | Adds unit tests for people cache behavior and emit helpers. |
| src/MediaBrowser.Frontend/src/app/media-editor/media-editor.spec.ts | Adds comprehensive unit tests for editor init/import/edit/save/thumbnail flows. |
| src/MediaBrowser.Frontend/src/app/login/login.spec.ts | Adds unit tests for login validation, navigation, and error handling. |
| src/MediaBrowser.Frontend/src/app/import/import.spec.ts | Adds unit tests for import scanning and model conversion. |
| src/MediaBrowser.Frontend/src/app/import/import.html | Migrates file list rendering to @for. |
| src/MediaBrowser.Frontend/src/app/app.ts | Fixes component stylesheet metadata to styleUrls. |
| src/MediaBrowser.Frontend/src/app/app.spec.ts | Updates app spec assertions to match rendered layout and Vitest imports. |
| src/MediaBrowser.Frontend/playwright.config.ts | Adds Playwright configuration for e2e tests across browsers. |
| src/MediaBrowser.Frontend/package.json | Updates scripts and dependencies for Angular upgrade + Vitest/Playwright tooling. |
| .github/workflows/pull-requests.yml | Adds Node setup + frontend npm ci and coverage run to PR workflow. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.