-
Notifications
You must be signed in to change notification settings - Fork 467
feat(frontend): add Jest unit testing infrastructure #6432
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub. 3 Skipped Deployments
|
ef6d2cb to
0635372
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## revert-6468-revert-6429-revert-6428-revert-6361-refactor/migrate-critical-components-featurespagejs-2 #6432 +/- ##
========================================================================================================================================
Coverage ? 98.08%
========================================================================================================================================
Files ? 1293
Lines ? 46588
Branches ? 0
========================================================================================================================================
Hits ? 45696
Misses ? 892
Partials ? 0 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Docker builds report
|
Zaimwa9
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just adding a prop and to the deploy to production pipeline and should be good to go. Thanks for the initiative!
0876e33 to
0947abc
Compare
Prevent rapid toggling race condition and provide visual feedback when toggling a feature flag. The row now shows reduced opacity and blocks interactions while the toggle operation is in progress. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Apply the same row-level loading state (opacity + disabled) when
removing a feature. Add key={projectFlag.id} to ensure React properly
unmounts deleted rows instead of reusing them for adjacent items.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Replace useOptimisticToggle with useFeatureRowState that handles both toggle and remove loading states. This simplifies FeatureRow by moving all row-level state management into a single, well-documented hook. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add useViewMode hook that updates React state immediately for instant feedback 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The route context doesn't have organisationId since the FeaturesPage route doesn't include :organisationId param. Use project.organisation from RTK Query instead. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Forward onError callback in CompareEnvironments and CompareFeatures adapters - Call onError on early returns in useToggleFeatureWithToast and FeaturesPage - Add stopRemoving function to useFeatureRowState for removal failure handling 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The service.ts had refetchOnFocus: true configured, but without calling setupListeners() from RTK Query, the window focus event listener was never set up. This restores the refetch-on-focus behaviour that existed in the old FeaturesPage.js implementation. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
…29-revert-6428-revert-6361-refactor/migrate-critical-components-featurespagejs-2
The new RTK-based toggle hook was missing the `use_v2_feature_versioning` check that exists in the legacy Flux store. This caused errors when toggling features in versioned environments. - Add versioning check to useToggleFeatureWithToast hook - Use createAndSetFeatureVersion mutation for versioned environments - Use updateFeatureState mutation for non-versioned environments - Pass environment object from FeaturesPage to get versioning setting 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The getFeatureStateCrud function used `!v.feature_segment` to find the environment default state, but the caller filtered with `!v.feature_segment?.segment`. When the API returns feature_segment as an object with segment: null, these filters produced different results, causing "Feature contains no changes" error. Also improved error message extraction in useToggleFeatureWithToast. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The Django API's EnvironmentViewSet uses lookup_field="api_key", so the
/environments/{lookup}/featurestates/ endpoint expects the environment's
API key string, not the numeric ID.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
The versioned toggle was failing with 404 because getFeatureStates
expects ?environment={numeric_id} but was receiving the api_key string.
- Add environmentApiKey (optional) and environmentId (number) to request type
- Pass both IDs from useToggleFeatureWithToast (which has the full Environment object)
- Skip optimistic update for legacy store flow (doesn't pass environmentApiKey)
- Fix getVersionFeatureState type to expect number instead of string
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add Jest with ts-jest for TypeScript support - Add jest.config.js with path aliases matching tsconfig - Add npm scripts: test:unit, test:unit:watch, test:unit:coverage - Migrate format.js to format.ts for better Jest compatibility - Add unit tests for featureFilterParams utility Tests cover: - buildUrlParams: is_archived always explicitly set (never undefined) - buildApiFilterParams: is_archived always included in API params - getFiltersFromParams: URL param parsing - hasActiveFilters: filter state detection This prevents regression of the archived features bug where is_archived was undefined instead of explicitly 'false'. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Runs Jest unit tests on PRs that modify frontend/ files. Runs on all PRs including drafts (tests are fast and cheap). Lint and typecheck can be added later once those are cleaned up. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add 45 unit tests for Format utility pure functions - Remove unnecessary .toString() in countdown: parseInt(x.toString()) → Math.floor(x) - Remove unnecessary .toString() in shortenNumber: +parseFloat(x.toString()).toFixed(1) → +x.toFixed(1) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add explicit moment import to fix TypeScript UMD global error - Simplify money() to consistently return defaultValue for null/undefined/0 - Update tests to reflect new behavior 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add clearMocks: true to Jest config for automatic mock cleanup - Add unit tests job to frontend-deploy-production.yml workflow - Update package-lock.json after rebase Addresses review comments from @Zaimwa9 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Reset FeaturesPage.tsx and useToggleFeatureWithToast.ts to main since those changes belong to the FeaturesPage migration PR. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Address security warning from github-advanced-security bot by adding explicit permissions block with minimal `contents: read` scope. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
c6e25db to
f7f3e69
Compare
|
You have run out of free Bugbot PR reviews for this billing cycle. This will reset on February 10. To receive reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial. |
Summary
Add Jest unit testing infrastructure to the frontend codebase to enable fast, isolated unit tests alongside the existing TestCafe E2E tests.
Closes #6442
Changes
Jest Configuration
ts-jestpreset for TypeScript supportcommon/,components/,project/)common/andweb/directoriesCI/CD Integration
frontend-pull-request.yml)Initial Test Coverage
featureFilterParamsutilitybuildUrlParams,buildApiFilterParams,getFiltersFromParams,hasActiveFiltersDependencies Added
jest,ts-jest,@types/jestHow did you test this code?
cd frontend npm run test:unitAll 27 tests pass.
Checklist
docs/if required so people know about the feature!