Add dashboard unit, component, and UI test pipelines#1284
Merged
Conversation
Contributor
WalkthroughAdds dashboard frontend test infrastructure: GitHub Actions workflow, Vitest shared and per-layer configs, Playwright config and UI fixtures, package test scripts/devDependencies, test setup, and initial unit/component/UI tests covering deployments helpers, UserFormDialog, and auth UI flows. ChangesDashboard Test Infrastructure
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
Greptile SummaryThis PR introduces a complete three-layer test infrastructure for
Confidence Score: 5/5Safe to merge — all changes are confined to test infrastructure and documentation; no production code is modified. All changed files are test configs, CI workflow, test specs, skill docs, and gitignore additions. The Vitest and Playwright configs are correctly wired, the API fixture resolves all routes immediately with no dangling requests, and the CI workflow uses current action versions. The only gap is the UserFormDialog component test covering only the success path, which leaves the error branch unguarded but does not introduce a regression in production behavior. No files require special attention — all changes are confined to test infrastructure. Important Files Changed
Flowchart%%{init: {'theme': 'neutral'}}%%
flowchart TD
PR[Pull Request to main/master/develop] --> CI[frontend-tests.yml triggered]
CI --> J1[dashboard-unit-tests]
CI --> J2[dashboard-component-tests]
CI --> J3[dashboard-ui-tests]
J1 --> U2["vitest run --config vitest.unit.config.ts"]
U2 --> U3["src/**/*.test.ts"]
J2 --> C2["vitest run --config vitest.component.config.ts"]
C2 --> C3["src/**/*.test.tsx (jsdom + Testing Library)"]
J3 --> P2[npx playwright install chromium]
P2 --> P3["playwright test -c playwright.config.ts"]
P3 --> P4["starts frontend/ dev server on :7131"]
P4 --> P5["tests/ui/*.spec.ts (Chromium)"]
P5 -->|failure| ART[Upload playwright-report and test-results artifacts]
subgraph Vitest Config Hierarchy
SH[vitest.shared.config.ts] --> UC[vitest.unit.config.ts]
SH --> CC[vitest.component.config.ts]
SH --> AC[vitest.config.ts]
end
Reviews (4): Last reviewed commit: "address comment" | Re-trigger Greptile |
| @@ -0,0 +1,32 @@ | |||
| import { describe, expect, it } from 'vitest'; | |||
There was a problem hiding this comment.
This PR deletes aggregateMetricSeries.test.ts (41 lines, covering avg/max/latest/NaN handling) and utils.test.ts (85 lines, covering cn, isEmptyValue, compareVersions, formatTime, formatDate) and replaces them with a single 32-line file for normalizeEnvVarDrafts/parseDotEnvInput. Those previously-covered utility functions still exist in the codebase but now have zero unit tests — the net change is a reduction of ~94 test lines with no stated reason for the deletions.
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/dashboard/vitest.config.ts`:
- Line 4: Replace usages of the Node-specific __dirname in the ESM Vitest config
by deriving the directory from import.meta.url; specifically change how
dashboardSrcPath is computed and any other occurrences (the symbols referencing
dashboardSrcPath and the other path computations on lines 18/19) to use a
fileURL-to-path approach (convert import.meta.url to a directory path and then
resolve 'src' or other targets) so the config works under "type": "module"
without ReferenceError.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 8700fd15-49a9-42f7-bd92-edeb7b71c8ed
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (10)
.github/workflows/frontend-tests.yml.gitignorepackages/dashboard/package.jsonpackages/dashboard/playwright.config.tspackages/dashboard/src/features/dashboard/utils/__tests__/aggregateMetricSeries.test.tspackages/dashboard/src/features/deployments/__tests__/helpers.test.tspackages/dashboard/src/lib/utils/__tests__/utils.test.tspackages/dashboard/tests/ui/auth-flow.spec.tspackages/dashboard/tests/ui/fixtures/api.tspackages/dashboard/vitest.config.ts
💤 Files with no reviewable changes (2)
- packages/dashboard/src/lib/utils/tests/utils.test.ts
- packages/dashboard/src/features/dashboard/utils/tests/aggregateMetricSeries.test.ts
Contributor
There was a problem hiding this comment.
1 issue found across 11 files
Confidence score: 5/5
- This PR looks low risk to merge: the only noted issue is a maintainability concern in
packages/dashboard/vitest.config.ts, not a concrete runtime regression. - The duplicated alias map between
packages/dashboard/vitest.config.tsandvite.config.tscould drift over time and cause test/build module resolution to diverge, but severity is low (3/10) and impact is likely gradual rather than immediate. - Pay close attention to
packages/dashboard/vitest.config.tsandvite.config.ts- keep alias definitions synchronized to avoid future inconsistency.
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="packages/dashboard/vitest.config.ts">
<violation number="1" location="packages/dashboard/vitest.config.ts:9">
P3: The alias map is duplicated from `vite.config.ts`, which can drift and make test/build module resolution inconsistent.</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
Re-trigger cubic
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (1)
.github/workflows/frontend-tests.yml (1)
66-67: ⚖️ Poor tradeoffConsider caching Playwright browsers.
Installing Playwright browsers on every CI run can be time-consuming. Caching the browser binaries would speed up the UI tests job.
⚡ Proposed caching setup
Add a cache step before installing Playwright:
- name: Cache Playwright browsers uses: actions/cache@v4 id: playwright-cache with: path: ~/.cache/ms-playwright key: playwright-${{ runner.os }}-${{ hashFiles('packages/dashboard/package-lock.json') }} - name: Install Playwright Chromium if: steps.playwright-cache.outputs.cache-hit != 'true' run: npx playwright install --with-deps chromiumNote: You may still need to install system dependencies even when browsers are cached.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In @.github/workflows/frontend-tests.yml around lines 66 - 67, Add a cache step for Playwright before the existing "Install Playwright Chromium" step to avoid re-downloading browser binaries each run: add an actions/cache@v4 step (id playwright-cache) caching path ~/.cache/ms-playwright with a key like playwright-${{ runner.os }}-${{ hashFiles('packages/dashboard/package-lock.json') }}, then change the "Install Playwright Chromium" step to run only when the cache miss occurs (if: steps.playwright-cache.outputs.cache-hit != 'true') so Playwright only downloads on cache misses; keep any required system dependency installs separate since caching only covers browser binaries.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.github/workflows/frontend-tests.yml:
- Around line 49-70: The dashboard-ui-tests job lacks an artifact upload step to
collect Playwright outputs on failure; add a new step after the "Run dashboard
UI tests" step in the dashboard-ui-tests job that uses
actions/upload-artifact@v4 with if: failure(), a descriptive name like
"playwright-results", and paths pointing to the Playwright report and
test-results (e.g., packages/dashboard/playwright-report/ and
packages/dashboard/test-results/) and set retention-days (e.g., 7) so traces,
videos, and HTML reports are preserved for debugging.
In `@packages/dashboard/package.json`:
- Line 98: Update the vitest dependency in package.json from "^3.2.4" to a newer
compatible version (e.g., "^4.1.6" or at least "^4.0.0") to pick up the latest
stable fixes; modify the "vitest" entry in the dependencies/devDependencies
section of package.json accordingly, run your package manager's install
(npm/yarn/pnpm) and run the test suite to confirm there are no breaking changes
or required config updates for the new major version.
In
`@packages/dashboard/src/features/auth/components/__tests__/UserFormDialog.test.tsx`:
- Around line 53-55: The three assertions for hookMocks.refetch, onOpenChange,
and hookMocks.showToast are executed too early and should wait for async effects
to settle; replace the immediate expects with an awaited waitFor (or equivalent
async helper) that checks hookMocks.refetch was called, onOpenChange was called
with false, and hookMocks.showToast was called with ('User created
successfully','success'), e.g. wrap those three expect(...) calls inside await
waitFor(() => { ... }) so the test waits for the side-effects triggered by
register to complete.
---
Nitpick comments:
In @.github/workflows/frontend-tests.yml:
- Around line 66-67: Add a cache step for Playwright before the existing
"Install Playwright Chromium" step to avoid re-downloading browser binaries each
run: add an actions/cache@v4 step (id playwright-cache) caching path
~/.cache/ms-playwright with a key like playwright-${{ runner.os }}-${{
hashFiles('packages/dashboard/package-lock.json') }}, then change the "Install
Playwright Chromium" step to run only when the cache miss occurs (if:
steps.playwright-cache.outputs.cache-hit != 'true') so Playwright only downloads
on cache misses; keep any required system dependency installs separate since
caching only covers browser binaries.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: a659388e-448e-4d45-b226-23d00ead724c
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (14)
.agents/skills/insforge-dev/SKILL.md.agents/skills/insforge-dev/dashboard/SKILL.md.codex/skills/insforge-dev/SKILL.md.codex/skills/insforge-dev/dashboard/SKILL.md.github/workflows/frontend-tests.ymlpackages/dashboard/package.jsonpackages/dashboard/src/features/auth/components/__tests__/UserFormDialog.test.tsxpackages/dashboard/src/test/setup.tspackages/dashboard/tests/ui/auth-flow.spec.tspackages/dashboard/tests/ui/fixtures/api.tspackages/dashboard/vitest.component.config.tspackages/dashboard/vitest.config.tspackages/dashboard/vitest.shared.config.tspackages/dashboard/vitest.unit.config.ts
✅ Files skipped from review due to trivial changes (4)
- packages/dashboard/vitest.unit.config.ts
- packages/dashboard/src/test/setup.ts
- .codex/skills/insforge-dev/SKILL.md
- .agents/skills/insforge-dev/SKILL.md
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/dashboard/tests/ui/auth-flow.spec.ts
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
.github/workflows/frontend-tests.yml (1)
3-8: ⚡ Quick winAdd explicit least-privilege workflow permissions.
This workflow relies on default
GITHUB_TOKENpermissions. Add a top-levelpermissionsblock (for example,contents: read) to reduce blast radius if any step is compromised.Suggested minimal hardening diff
name: Frontend Tests on: pull_request: branches: [main, master, develop] workflow_dispatch: +permissions: + contents: read + jobs:🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In @.github/workflows/frontend-tests.yml around lines 3 - 8, Add an explicit top-level permissions block to the workflow to avoid using broad default GITHUB_TOKEN permissions: add a permissions entry (for example, permissions: contents: read) at the top level of the workflow (alongside the existing on: and workflow_dispatch keys) so the workflow only grants minimal privileges to GITHUB_TOKEN instead of the full default set.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In @.github/workflows/frontend-tests.yml:
- Around line 3-8: Add an explicit top-level permissions block to the workflow
to avoid using broad default GITHUB_TOKEN permissions: add a permissions entry
(for example, permissions: contents: read) at the top level of the workflow
(alongside the existing on: and workflow_dispatch keys) so the workflow only
grants minimal privileges to GITHUB_TOKEN instead of the full default set.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 6a6ebfed-110c-4a2f-b7ab-f50fd7ca3ba5
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (3)
.github/workflows/frontend-tests.ymlpackages/dashboard/package.jsonpackages/dashboard/src/features/auth/components/__tests__/UserFormDialog.test.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/dashboard/package.json
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.github/workflows/frontend-tests.yml:
- Around line 18-21: Replace mutable action tags with pinned commit SHAs: update
usages of actions/checkout@v6 and actions/setup-node@v6 (and the other
occurrences of actions referenced at lines noted in the review) to their full
40-character commit SHA equivalents; keep an inline comment with the
human-readable tag (e.g., // v6) if desired for readability and add the SHA
after the `@` (e.g., actions/checkout@<40-char-sha>). Ensure you update every
occurrence mentioned in the review (all uses of actions/checkout,
actions/setup-node, and the other action references at the noted locations) so
no mutable tags remain, and verify the SHAs correspond to the intended release
before committing.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 34603bd2-1c50-465a-b162-53c8bb141a8f
📒 Files selected for processing (1)
.github/workflows/frontend-tests.yml
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
2 participants
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.
Summary
Add basic test pipelines to frontend
Summary by cubic
Adds unit, component, and UI test pipelines for
@insforge/dashboardusingvitest@4,@testing-library/react, and@playwright/test, and runs them in CI for PRs. Includes focused specs and API mocks for auth, env parsing, andUserFormDialog.@insforge/dashboardtests into unit, component, and UI jobs; uploads Playwright artifacts on failures.vitest@4shared/unit/component configs withjsdom, Testing Library setup, and scripts:test,test:unit,test:component,test:ui.frontenddev server on a fixed port, retains traces on failure, and uses reusable API route fixtures.UserFormDialog, and unit tests for env helper parsing/normalization..gitignore, and updated dashboard testing guidance in skills docs.Written for commit 1422877. Summary will update on new commits. Review in cubic
Note
Add unit, component, and Playwright UI test pipelines for the dashboard
.test.tsand.test.tsxfiles respectively, sharing a base jsdom environment and path-alias setup.tests/ui, with trace retention on failure.UserFormDialogcomponent test,parseDotEnvInput/normalizeEnvVarDraftsunit tests, and two auth-flow UI smoke tests with mocked API fixtures.Macroscope summarized 1422877.
Summary by CodeRabbit