feat(tests) :Mfa setup tests (M2-10270) #2188
Closed
Conversation
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
- Add comprehensive MFA translation keys to app-en.json - Add French translations for all MFA features to app-fr.json - Includes translations for: - MFA setup (QR code and manual setup flows) - Recovery codes management - Authenticator app configuration - Identity confirmation dialogs - MFA removal flow - All button labels and loading states
- Replace hardcoded strings with translation keys: - Account Settings title (mfa.accountSettings) - Profile section (mfa.profile) - Email label (mfa.email) - Two-factor authentication title and description - Authenticator app title and description - Enabled badge (mfa.enabled) - Add/Remove buttons (mfa.buttons.add/remove) - Recovery options header (mfa.recoveryOptions) - Recovery codes title and description - View button (mfa.buttons.view) - Success message for MFA removal (mfa.remove.successMessage)
- Import useTranslation hook from react-i18next - Replace hardcoded strings: - Modal title (mfa.recoveryCodes.saveTitle) - Description paragraphs (saveDescription1, saveDescription2) - Button labels (mfa.buttons.savedCodes, downloadCodes)
- Replace hardcoded strings: - Modal title (mfa.setup.scanTitle) - Description (mfa.setup.scanDescription) - Continue button (mfa.buttons.continue) - Can't scan link (mfa.setup.cantScanQR)
- Replace hardcoded strings: - Modal title (mfa.setup.manualTitle) - Description (mfa.setup.manualDescription) - Instructions (mfa.setup.manualInstructions)
…lation keys VerificationForm: - Replace button labels with translation keys (mfa.buttons.continue, back) SecretKeyDisplay: - Replace copy/copied tooltips with translation keys (mfa.secretKey.copy, copied)
ViewRecoveryCodes: - Replace title and description with translation keys RemoveMFA: - Replace title and description with translation keys RemoveMFAConfirmation: - Replace all text (title, message, buttons) ConfirmIdentityVerificationCode: - Replace placeholder, button labels, and link text ConfirmIdentityRecoveryCode: - Replace all text (title, description, placeholder, buttons)
- Added Noto Sans as variables.font.family.input - Replaced all hardcoded Moderat with appropriate font.family properties - Replaced all hardcoded Noto Sans with font.family.input - Fixed incorrect variables.font.family object references - Follows repo pattern Files modified: - AccountSettings.styles.ts - AccountTab.styles.ts - MFAManualSetup.styles.ts - MFARecoveryCodes.styles.ts - MFASetup.styles.ts - RemoveMFAConfirmation.styles.ts - MFADialog.styles.ts - font.ts
- Follows repo pattern of using centralized SVG sprite - Ensures consistency across the application Files modified: - MFARecoveryCodes.tsx - MFASetup.tsx - MFAManualSetup.tsx - ConfirmIdentityRecoveryCode.tsx - SecretKeyDisplay.tsx Files deleted: - CloseIcon.tsx - CheckIcon.tsx
- Replace #ba1a1a with variables.palette.error40 - Replace rgba(186, 26, 26, 0.08) with error40 + hex alpha (14 = 8% opacity) - Replace rgba(186, 26, 26, 0.3) with error40 + hex alpha (4D = 30% opacity) - Replace rgba(255, 255, 255, 0.9) with white_alpha50 - Replace rgba(0, 0, 0, 0.5) with black + hex alpha (80 = 50% opacity) - Replace hardcoded Toast colors with palette variables - Fix incorrect variables.font.family object reference in MFADialog Files modified: - MFADialog.styles.ts - RemoveMFAConfirmation.styles.ts - AccountTab.styles.ts - MFASetup.styles.ts - Toast.tsx
- Create Toast.styles.ts following repo pattern - Replace inline style object with StyledToast component - Convert fontSize from px to rem (14px → 1.4rem) - Use variables.font.weight.regular instead of hardcoded 400 - Improve box-shadow formatting for better readability
- Fix bug where MFA was disabled immediately after code verification - Now MFA is only disabled after user confirms on final confirmation modal - Store verification code temporarily and only call API on final confirm - Ensures cancel button on confirmation modal actually prevents MFA removal
- Create centralized mock data file for MFA tests - Include mock provisioning URIs, verification codes, and recovery codes - Add mock API responses for success and error scenarios - Include mock tokens for download and verification flows - Provide mock error responses matching backend formats
- Create reusable helper functions for MFA test setup - Add API mock helpers (success and error scenarios) - Include utilities for mocking MFA setup, verification, and removal flows - Add helpers for recovery codes viewing and downloading - Provide common callback mock creators - Add API call verification utilities These helpers reduce duplication and improve test readability.
Add comprehensive test suite for MFA input handler hook: - Test digit filtering (remove letters, special chars, spaces) - Test length limiting (reject >6 digits, accept <=6) - Test error clearing behavior - Test combined operations (filtering + error clearing) - Test progressive typing and blocking after 6 digits Coverage: 12 tests Focus: Input sanitization, validation, and user interaction flows
- 22 comprehensive tests covering all error scenarios - Validates proper error message translation for users
- Add comprehensive tests for MFA disable hook - Cover initiate disable flow with success and error cases - Test verify and disable with all error scenarios - Test state management and loading states - Test edge cases (empty code, rapid calls, missing token)
- Add tests for useViewRecoveryCodes hook - Test TOTP and recovery code verification flows - Cover error handling (400, 403, 404, 429, network errors) - Add helper functions: mockMFAViewCodesInitiate and mockMFAViewCodesVerify - All tests passing (16/16)
|
This pull request is automatically being deployed by Amplify Hosting (learn more). |
sricharan-varanasi
changed the title
Contributor
|
The commits from this PR are included in #2189. |
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.
fixorfeaturebranches intodeveloporreleasebranches viaSquash and Merge(to keep clean history)📝 Description
🔗 Jira Ticket M2-10270
This PR adds comprehensive test coverage for the MFA (Multi-Factor Authentication) feature in the Account Settings module. The test suite includes 127 tests covering all MFA workflows: setup, removal, viewing recovery codes, input handling, and error scenarios.
Changes include:
Unit Tests (115 tests) - Comprehensive testing of MFA hooks and utilities:
useMFASetup.test.ts(37 tests) - MFA setup flow, QR code generation, verificationuseRemoveMFA.test.ts(28 tests) - MFA removal flow with TOTP/recovery code verificationuseViewRecoveryCodes.test.ts(16 tests) - View recovery codes with multiple verification methodsuseMFAInputHandler.test.ts(12 tests) - Input sanitization, validation, and error clearingRemoveMFA.utils.test.ts(22 tests) - Error message mapping for 22 backend scenariosIntegration Tests (12 tests) - Full component testing:
MFASection.test.tsx(12 tests) - UI rendering, modal interactions, Redux integration🪤 Peer Testing
To verify the tests:
Check out the branch and run
yarn installif neededRun the test suite:
yarn test src/modules/Dashboard/features/AccountSettingsExpected outcome: All 127 tests pass in approximately 20 seconds
Review test structure in the following files: