From 59f925bbfd53dbfa2b4cd70c822d88b44b2c7aad Mon Sep 17 00:00:00 2001 From: Rohit <40559587+Rohit3523@users.noreply.github.com> Date: Fri, 10 Apr 2026 01:08:38 +0530 Subject: [PATCH 01/14] Remove justifyContent and alignItems from container... --- app/views/ChangePasscodeView.tsx | 4 +--- app/views/ScreenLockedView.tsx | 4 +--- 2 files changed, 2 insertions(+), 6 deletions(-) diff --git a/app/views/ChangePasscodeView.tsx b/app/views/ChangePasscodeView.tsx index a64081862b..cc235a1ca8 100644 --- a/app/views/ChangePasscodeView.tsx +++ b/app/views/ChangePasscodeView.tsx @@ -14,9 +14,7 @@ import Touch from '../containers/Touch'; const styles = StyleSheet.create({ container: { - flex: 1, - justifyContent: 'center', - alignItems: 'center' + flex: 1 }, modal: { margin: 0 diff --git a/app/views/ScreenLockedView.tsx b/app/views/ScreenLockedView.tsx index b3dbd45026..7f27a2dd19 100644 --- a/app/views/ScreenLockedView.tsx +++ b/app/views/ScreenLockedView.tsx @@ -21,9 +21,7 @@ interface IData { const styles = StyleSheet.create({ container: { - flex: 1, - justifyContent: 'center', - alignItems: 'center' + flex: 1 }, close: { position: 'absolute', From 913bf14e0cae6ab717dbb4e30c352143f65b9b51 Mon Sep 17 00:00:00 2001 From: Rohit <40559587+Rohit3523@users.noreply.github.com> Date: Fri, 10 Apr 2026 01:38:42 +0530 Subject: [PATCH 02/14] Add story and unit test --- app/containers/Passcode/Base/Base.stories.tsx | 69 + app/containers/Passcode/Base/Base.test.tsx | 61 + .../Base/__snapshots__/Base.test.tsx.snap | 8783 +++++++++++++++++ 3 files changed, 8913 insertions(+) create mode 100644 app/containers/Passcode/Base/Base.stories.tsx create mode 100644 app/containers/Passcode/Base/Base.test.tsx create mode 100644 app/containers/Passcode/Base/__snapshots__/Base.test.tsx.snap diff --git a/app/containers/Passcode/Base/Base.stories.tsx b/app/containers/Passcode/Base/Base.stories.tsx new file mode 100644 index 0000000000..f32495979b --- /dev/null +++ b/app/containers/Passcode/Base/Base.stories.tsx @@ -0,0 +1,69 @@ +import React, { useRef } from 'react'; +import { View } from 'react-native'; + +import Base, { type IBase } from '.'; +import { TYPE } from '../constants'; + +export default { + title: 'Passcode/Base' +}; + +const PasscodeBase = ({ ...props }) => { + const ref = useRef(null); + return ( + {}} + {...props} + /> + ); +}; + +export const ChooseType = () => ( + + + +); + +export const ConfirmType = () => ( + + {}} + /> + +); + +export const EnterType = () => ( + + + +); + +export const WithSubtitle = () => ( + + + +); + +export const WithBiometry = () => ( + + {}} /> + +); + +export const EnterWithSubtitleAndBiometry = () => ( + + {}} + /> + +); diff --git a/app/containers/Passcode/Base/Base.test.tsx b/app/containers/Passcode/Base/Base.test.tsx new file mode 100644 index 0000000000..a92966b486 --- /dev/null +++ b/app/containers/Passcode/Base/Base.test.tsx @@ -0,0 +1,61 @@ +import React, { createRef } from 'react'; +import { render } from '@testing-library/react-native'; + +import { generateSnapshots } from '../../../../.rnstorybook/generateSnapshots'; +import Base, { type IBase } from '.'; +import { TYPE } from '../constants'; +import * as stories from './Base.stories'; + +const onEndProcessMock = jest.fn(); + +const TestBase = ({ ...props }) => { + const ref = createRef(); + return ( + + ); +}; + +describe('Base Passcode Component', () => { + beforeEach(() => { + onEndProcessMock.mockClear(); + }); + + test('should render with title', () => { + const { getByText } = render(); + expect(getByText('Enter Passcode')).toBeTruthy(); + }); + + test('should render with subtitle when provided', () => { + const { getByText } = render(); + expect(getByText('Authentication required')).toBeTruthy(); + }); + + test('should not render subtitle when not provided', () => { + const { queryByText } = render(); + expect(queryByText('Authentication required')).toBeNull(); + }); + + test('should expose ref methods', () => { + const ref = createRef(); + render(); + expect(ref.current?.clearPasscode).toBeDefined(); + expect(ref.current?.wrongPasscode).toBeDefined(); + expect(ref.current?.animate).toBeDefined(); + }); + + test('should render biometry button when showBiometry is true', () => { + const { UNSAFE_getByType } = render( + {}} /> + ); + // The biometry button uses fingerprint icon + expect(UNSAFE_getByType).toBeDefined(); + }); +}); + +generateSnapshots(stories); diff --git a/app/containers/Passcode/Base/__snapshots__/Base.test.tsx.snap b/app/containers/Passcode/Base/__snapshots__/Base.test.tsx.snap new file mode 100644 index 0000000000..1b2351a1f7 --- /dev/null +++ b/app/containers/Passcode/Base/__snapshots__/Base.test.tsx.snap @@ -0,0 +1,8783 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Story Snapshots: ChooseType should match snapshot 1`] = ` + + + + + + +  + + + + + + + Create Passcode + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; + +exports[`Story Snapshots: ConfirmType should match snapshot 1`] = ` + + + + + + +  + + + + + + + Confirm Passcode + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; + +exports[`Story Snapshots: EnterType should match snapshot 1`] = ` + + + + + + +  + + + + + + + Enter Passcode + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; + +exports[`Story Snapshots: EnterWithSubtitleAndBiometry should match snapshot 1`] = ` + + + + + + +  + + + + + + + Unlock App + + + + + + + Authentication required + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + +  + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; + +exports[`Story Snapshots: WithBiometry should match snapshot 1`] = ` + + + + + + +  + + + + + + + Enter Passcode + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + +  + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; + +exports[`Story Snapshots: WithSubtitle should match snapshot 1`] = ` + + + + + + +  + + + + + + + Create Passcode + + + + + + + This passcode will protect your data + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + + + 2 + + + + + + + + + + 3 + + + + + + + + + + + + 4 + + + + + + + + + + 5 + + + + + + + + + + 6 + + + + + + + + + + + + 7 + + + + + + + + + + 8 + + + + + + + + + + 9 + + + + + + + + + + + + + 0 + + + + + + + + + +  + + + + + + + + +`; From 36dd0f5fba5f1bafc1b34debafac2d2aaf6df785 Mon Sep 17 00:00:00 2001 From: Rohit3523 Date: Thu, 9 Apr 2026 20:10:22 +0000 Subject: [PATCH 03/14] chore: format code and fix lint issues --- app/containers/Passcode/Base/Base.stories.tsx | 17 ++--------------- app/containers/Passcode/Base/Base.test.tsx | 10 +--------- 2 files changed, 3 insertions(+), 24 deletions(-) diff --git a/app/containers/Passcode/Base/Base.stories.tsx b/app/containers/Passcode/Base/Base.stories.tsx index f32495979b..5025ebd4dc 100644 --- a/app/containers/Passcode/Base/Base.stories.tsx +++ b/app/containers/Passcode/Base/Base.stories.tsx @@ -10,15 +10,7 @@ export default { const PasscodeBase = ({ ...props }) => { const ref = useRef(null); - return ( - {}} - {...props} - /> - ); + return {}} {...props} />; }; export const ChooseType = () => ( @@ -29,12 +21,7 @@ export const ChooseType = () => ( export const ConfirmType = () => ( - {}} - /> + {}} /> ); diff --git a/app/containers/Passcode/Base/Base.test.tsx b/app/containers/Passcode/Base/Base.test.tsx index a92966b486..1a2fc4d0c0 100644 --- a/app/containers/Passcode/Base/Base.test.tsx +++ b/app/containers/Passcode/Base/Base.test.tsx @@ -10,15 +10,7 @@ const onEndProcessMock = jest.fn(); const TestBase = ({ ...props }) => { const ref = createRef(); - return ( - - ); + return ; }; describe('Base Passcode Component', () => { From 8cec2f5ee992c287941ce7a173e1dec8399aaa79 Mon Sep 17 00:00:00 2001 From: Rohit <40559587+Rohit3523@users.noreply.github.com> Date: Fri, 10 Apr 2026 01:41:08 +0530 Subject: [PATCH 04/14] rerun ci --- app/containers/Passcode/Base/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/containers/Passcode/Base/index.tsx b/app/containers/Passcode/Base/index.tsx index 5a78b58aab..c95c9c762a 100644 --- a/app/containers/Passcode/Base/index.tsx +++ b/app/containers/Passcode/Base/index.tsx @@ -93,7 +93,7 @@ const Base = forwardRef( return ''; }); - useImperativeHandle(ref, () => ({ + useImperativeHandle(ref, () => ({ wrongPasscode, animate, clearPasscode From efd7f1e6e1e8a9a85b08d84344bfc042878382e1 Mon Sep 17 00:00:00 2001 From: Rohit3523 Date: Thu, 9 Apr 2026 20:13:03 +0000 Subject: [PATCH 05/14] chore: format code and fix lint issues --- app/containers/Passcode/Base/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/containers/Passcode/Base/index.tsx b/app/containers/Passcode/Base/index.tsx index c95c9c762a..5a78b58aab 100644 --- a/app/containers/Passcode/Base/index.tsx +++ b/app/containers/Passcode/Base/index.tsx @@ -93,7 +93,7 @@ const Base = forwardRef( return ''; }); - useImperativeHandle(ref, () => ({ + useImperativeHandle(ref, () => ({ wrongPasscode, animate, clearPasscode From 46530b4b5aaf010bab08ddb6f086472ca7936186 Mon Sep 17 00:00:00 2001 From: Rohit <40559587+Rohit3523@users.noreply.github.com> Date: Fri, 10 Apr 2026 01:43:11 +0530 Subject: [PATCH 06/14] revert --- app/containers/Passcode/Base/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/containers/Passcode/Base/index.tsx b/app/containers/Passcode/Base/index.tsx index c95c9c762a..5a78b58aab 100644 --- a/app/containers/Passcode/Base/index.tsx +++ b/app/containers/Passcode/Base/index.tsx @@ -93,7 +93,7 @@ const Base = forwardRef( return ''; }); - useImperativeHandle(ref, () => ({ + useImperativeHandle(ref, () => ({ wrongPasscode, animate, clearPasscode From 243123f34262a82bb4c49bdad9cb9f5ec9c008db Mon Sep 17 00:00:00 2001 From: Rohit <40559587+Rohit3523@users.noreply.github.com> Date: Fri, 10 Apr 2026 01:55:44 +0530 Subject: [PATCH 07/14] test update --- app/containers/Passcode/Base/Base.test.tsx | 16 ++++- app/containers/Passcode/Base/Button.tsx | 4 +- .../Base/__snapshots__/Base.test.tsx.snap | 68 +++++++++++++++++++ app/containers/Passcode/Base/index.tsx | 12 ++-- 4 files changed, 90 insertions(+), 10 deletions(-) diff --git a/app/containers/Passcode/Base/Base.test.tsx b/app/containers/Passcode/Base/Base.test.tsx index 1a2fc4d0c0..983722acb9 100644 --- a/app/containers/Passcode/Base/Base.test.tsx +++ b/app/containers/Passcode/Base/Base.test.tsx @@ -42,11 +42,21 @@ describe('Base Passcode Component', () => { }); test('should render biometry button when showBiometry is true', () => { - const { UNSAFE_getByType } = render( + const { getByTestId } = render( {}} /> ); - // The biometry button uses fingerprint icon - expect(UNSAFE_getByType).toBeDefined(); + expect(getByTestId('biometry-button')).toBeTruthy(); + }); + + test('should render all passcode buttons with testIDs', () => { + const { getByTestId } = render(); + // Number buttons 1-9 + for (let i = 1; i <= 9; i++) { + expect(getByTestId(`passcode-button-${i}`)).toBeTruthy(); + } + // Button 0 and backspace + expect(getByTestId('passcode-button-0')).toBeTruthy(); + expect(getByTestId('passcode-button-backspace')).toBeTruthy(); }); }); diff --git a/app/containers/Passcode/Base/Button.tsx b/app/containers/Passcode/Base/Button.tsx index ebce47d985..2a88761a38 100644 --- a/app/containers/Passcode/Base/Button.tsx +++ b/app/containers/Passcode/Base/Button.tsx @@ -12,15 +12,17 @@ interface IPasscodeButton { disabled?: boolean; onPress?: Function; style?: StyleProp; + testID?: string; } -const Button = React.memo(({ style, text, disabled, onPress, icon }: IPasscodeButton) => { +const Button = React.memo(({ style, text, disabled, onPress, icon, testID }: IPasscodeButton) => { const { colors } = useTheme(); const press = () => onPress && onPress(text); return ( ( {range(1, 4).map(i => ( -