forked from deriv-com/deriv-app
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor: [UPM-1080]/evgeniy/refactor passkeys code, rename flow (der…
…iv-com#15237) * refactor: [UPM-1080]/evgeniy/refactor passkeys code * refactor: tests and code completion * refactor: do not fetch passkeys list, when no need to open the modal * refactor: tests fix, remove btn loader status, icons change * refactor: do not call for passkeys if local storage value is false * chore: added todo for tracking events * refactor: client store remove unnecessary checks, tests, icons * chore: skip changing the state for created status * refactor: removed unnecessary li tag in modal * chore: rename passkey (#44) * chore: rename passkey * chore: test fix * fix: styles for rtl * refactor: call success event only after success renaming * chore: hide disabled dropdown item * chore: review comments * fix: accidentally removed clsx import * chore: snackbar fix, loading while fething new name
- Loading branch information
1 parent
b7e377d
commit 132ea1f
Showing
46 changed files
with
1,314 additions
and
881 deletions.
There are no files selected for viewing
This file contains 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
25 changes: 25 additions & 0 deletions
25
packages/account/src/Sections/Security/Passkeys/components/__tests__/no-passkeys.spec.tsx
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| import React from 'react'; | ||
| import { render, screen } from '@testing-library/react'; | ||
| import userEvent from '@testing-library/user-event'; | ||
| import { NoPasskeys } from '../no-passkeys'; | ||
|
|
||
| describe('NoPasskeys', () => { | ||
| const mockOnPrimaryButtonClick = jest.fn(); | ||
| const mockOnSecondaryButtonClick = jest.fn(); | ||
|
|
||
| it('renders NoPasskeys component correctly', () => { | ||
| render( | ||
| <NoPasskeys | ||
| onPrimaryButtonClick={mockOnPrimaryButtonClick} | ||
| onSecondaryButtonClick={mockOnSecondaryButtonClick} | ||
| /> | ||
| ); | ||
|
|
||
| expect(screen.getByText('Enhanced security is just a tap away.')).toBeInTheDocument(); | ||
| expect(screen.getByText('Experience safer logins')).toBeInTheDocument(); | ||
| userEvent.click(screen.getByRole('button', { name: /create passkey/i })); | ||
| userEvent.click(screen.getByRole('button', { name: /learn more/i })); | ||
| expect(mockOnPrimaryButtonClick).toHaveBeenCalled(); | ||
| expect(mockOnSecondaryButtonClick).toHaveBeenCalled(); | ||
| }); | ||
| }); |
31 changes: 19 additions & 12 deletions
31
packages/account/src/Sections/Security/Passkeys/components/__tests__/passkey-card.spec.tsx
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,23 +1,30 @@ | ||
| import React from 'react'; | ||
| import { screen, render } from '@testing-library/react'; | ||
| import PasskeyCard from '../passkey-card'; | ||
| import userEvent from '@testing-library/user-event'; | ||
| import { PasskeyCard } from '../passkey-card'; | ||
| import { mock_passkeys_list } from '../../__tests__/passkeys.spec'; | ||
|
|
||
| jest.mock('@deriv/shared', () => ({ | ||
| ...jest.requireActual('@deriv/shared'), | ||
| getOSNameWithUAParser: () => 'test OS', | ||
| })); | ||
|
|
||
| describe('PasskeyCard', () => { | ||
| it('renders the passkey card correctly', () => { | ||
| const mock_card: React.ComponentProps<typeof PasskeyCard> = { | ||
| id: 1, | ||
| name: 'Test Passkey', | ||
| last_used: 1633024800, | ||
| created_at: 1633024800, | ||
| stored_on: 'Device', | ||
| icon: 'IcPasskey', | ||
| passkey_id: 'mock-id', | ||
| }; | ||
| const mockOnPasskeyMenuClick = jest.fn(); | ||
| const mock_card = mock_passkeys_list[0]; | ||
|
|
||
| render(<PasskeyCard {...mock_card} />); | ||
| it('renders the passkey card correctly and trigger menu with renaming', () => { | ||
| render(<PasskeyCard {...mock_card} onPasskeyMenuClick={mockOnPasskeyMenuClick} />); | ||
|
|
||
| expect(screen.getByText(/test passkey/i)).toBeInTheDocument(); | ||
| expect(screen.getByText(/stored on/i)).toBeInTheDocument(); | ||
| expect(screen.getByText(/last used/i)).toBeInTheDocument(); | ||
| expect(screen.queryByText('Rename')).not.toBeInTheDocument(); | ||
| const menu_button = screen.getByTestId('dt_dropdown_display'); | ||
| userEvent.click(menu_button); | ||
| const rename_option = screen.getByText('Rename'); | ||
| expect(rename_option).toBeInTheDocument(); | ||
| userEvent.click(rename_option); | ||
| expect(mockOnPasskeyMenuClick).toHaveBeenCalledTimes(1); | ||
| }); | ||
| }); |
26 changes: 26 additions & 0 deletions
26
...ages/account/src/Sections/Security/Passkeys/components/__tests__/passkey-created.spec.tsx
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| import React from 'react'; | ||
| import { render, screen } from '@testing-library/react'; | ||
| import userEvent from '@testing-library/user-event'; | ||
| import { PasskeyCreated } from '../passkey-created'; | ||
|
|
||
| describe('PasskeyCreated', () => { | ||
| const mockOnPrimaryButtonClick = jest.fn(); | ||
| const mockOnSecondaryButtonClick = jest.fn(); | ||
|
|
||
| it('renders PasskeyCreated component correctly', () => { | ||
| render( | ||
| <PasskeyCreated | ||
| onPrimaryButtonClick={mockOnPrimaryButtonClick} | ||
| onSecondaryButtonClick={mockOnSecondaryButtonClick} | ||
| /> | ||
| ); | ||
|
|
||
| expect(screen.getByText('Success!')).toBeInTheDocument(); | ||
| expect(screen.getByText(/Your account is now secured with a passkey/)).toBeInTheDocument(); | ||
| expect(screen.getByText(/Manage your passkey/)).toBeInTheDocument(); | ||
| userEvent.click(screen.getByRole('button', { name: /continue trading/i })); | ||
| userEvent.click(screen.getByRole('button', { name: /add more passkeys/i })); | ||
| expect(mockOnPrimaryButtonClick).toHaveBeenCalled(); | ||
| expect(mockOnSecondaryButtonClick).toHaveBeenCalled(); | ||
| }); | ||
| }); |
Oops, something went wrong.