Skip to content

Commit bf11908

Browse files
puntopepuntope
committed
Add tests
1 parent 7ca9343 commit bf11908

File tree

6 files changed

+218
-10
lines changed

6 files changed

+218
-10
lines changed

‎modules/ppcp-settings/resources/js/Components/Screens/Onboarding/hooks/usePaymentConfig.js‎

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@ const COUNTRY_CONFIGS = {
7575
{ name: 'Crypto', Component: Crypto },
7676
],
7777
extendedMethods: [
78-
DEFAULT_CONFIG.extendedMethods,
78+
...DEFAULT_CONFIG.extendedMethods,
7979
{
8080
name: 'Fastlane',
8181
Component: Fastlane,
@@ -257,14 +257,6 @@ export const usePaymentConfig = (
257257
ownBrandOnly
258258
) => {
259259
return useMemo( () => {
260-
// eslint-disable-next-line no-console
261-
console.log( '[Payment Config]', {
262-
country,
263-
canUseCardPayments,
264-
hasFastlane,
265-
ownBrandOnly,
266-
} );
267-
268260
// Merge country-specific config with default.
269261
const countryConfig = COUNTRY_CONFIGS[ country ] || {};
270262
const config = { ...DEFAULT_CONFIG, ...countryConfig };

‎modules/ppcp-settings/resources/js/Components/Screens/Onboarding/hooks/usePaymentConfig.test.js‎

Lines changed: 203 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,203 @@
1+
/* global describe, test, expect, jest */
2+
import { renderHook } from '@testing-library/react';
3+
import { usePaymentConfig } from './usePaymentConfig';
4+
import {
5+
CardFields,
6+
CreditDebitCards,
7+
DigitalWallets,
8+
} from '../Components/PaymentOptions';
9+
10+
jest.mock( '../../../../data/onboarding', () => ( {
11+
hooks: {},
12+
selectors: {},
13+
STORE_NAME: 'test/store',
14+
initStore: jest.fn().mockReturnValue( true ),
15+
} ) );
16+
17+
jest.mock( '../../../../data', () => ( {
18+
initStores: jest.fn(),
19+
} ) );
20+
21+
jest.mock( '@wordpress/i18n', () => ( {
22+
__: ( text ) => text,
23+
} ) );
24+
25+
jest.mock( '@wordpress/element', () => ( {
26+
useMemo: ( callback ) => callback(),
27+
useEffect: ( callback ) => callback(),
28+
useState: ( initialState ) => [ initialState, jest.fn() ],
29+
createContext: () => ( {
30+
Provider: ( { children } ) => children,
31+
Consumer: ( { children } ) => children,
32+
} ),
33+
forwardRef: ( Component ) => Component,
34+
Fragment: ( { children } ) => children,
35+
} ) );
36+
37+
jest.mock( '@wordpress/data', () => ( {
38+
useDispatch: () => ( {} ),
39+
useSelect: () => ( {} ),
40+
createReduxStore: () => ( {} ),
41+
register: () => {},
42+
select: () => ( {} ),
43+
} ) );
44+
45+
jest.mock( '@wordpress/compose', () => ( {
46+
createHigherOrderComponent: () => ( Component ) => Component,
47+
withInstanceId: ( Component ) => Component,
48+
} ) );
49+
50+
jest.mock( '@wordpress/components', () => ( {
51+
Button: ( { children, ...props } ) => (
52+
<button { ...props }>{ children }</button>
53+
),
54+
} ) );
55+
56+
jest.mock( '@wordpress/primitives', () => ( {
57+
SVG: ( { children, ...props } ) => <svg { ...props }>{ children }</svg>,
58+
Path: ( props ) => <path { ...props } />,
59+
} ) );
60+
61+
jest.mock( '../../../../utils/countryInfoLinks', () => ( {
62+
learnMoreLinks: {
63+
US: { PayWithPayPal: 'https://example.com' },
64+
GB: { PayWithPayPal: 'https://example.com' },
65+
AU: { PayWithPayPal: 'https://example.com' },
66+
MX: { PayWithPayPal: 'https://example.com' },
67+
},
68+
} ) );
69+
70+
const EXPECTED_PAYMENT_METHODS = [
71+
[
72+
'US',
73+
[ 'PayWithPayPal', 'PayLater', 'Venmo', 'Crypto' ],
74+
[ 'CardFields', 'DigitalWallets', 'APMs', 'Fastlane' ],
75+
],
76+
[
77+
'GB',
78+
[ 'PayWithPayPal', 'PayInThree' ],
79+
[ 'CardFields', 'DigitalWallets', 'APMs', 'Fastlane' ],
80+
],
81+
[
82+
'AU',
83+
[ 'PayWithPayPal', 'PayLater' ],
84+
[ 'CardFields', 'DigitalWallets', 'APMs', 'Fastlane' ],
85+
],
86+
[ 'MX', [ 'PayWithPayPal', 'PayLater' ], [ 'CreditDebitCards', 'APMs' ] ],
87+
];
88+
89+
describe( 'usePaymentConfig hook', () => {
90+
describe( 'Payment Methods for countries', () => {
91+
test.each( EXPECTED_PAYMENT_METHODS )(
92+
'Country %s should have valid methods',
93+
( country, includedMethods, optionalMethods ) => {
94+
const { result } = renderHook( () =>
95+
usePaymentConfig( country, true, true, false )
96+
);
97+
98+
expect( result.current.includedMethods ).toHaveLength(
99+
includedMethods.length
100+
);
101+
expect(
102+
result.current.includedMethods.map(
103+
( method ) => method.name
104+
)
105+
).toEqual( includedMethods );
106+
107+
expect(
108+
result.current.optionalMethods.map(
109+
( method ) => method.name
110+
)
111+
).toEqual( optionalMethods );
112+
}
113+
);
114+
test.each( [ 'US', 'GB', 'AU' ] )(
115+
'Country %s should contain Fastlane method if hasFastlane is true',
116+
( country ) => {
117+
const { result } = renderHook( () =>
118+
usePaymentConfig( country, true, true, false )
119+
);
120+
const methodNames = result.current.optionalMethods.map(
121+
( method ) => method.name
122+
);
123+
expect( methodNames ).toContain( 'Fastlane' );
124+
}
125+
);
126+
127+
test.each( [ 'US', 'GB', 'AU' ] )(
128+
'Country %s should NOT contain Fastlane method if hasFastlane is false',
129+
( country ) => {
130+
const { result } = renderHook( () =>
131+
usePaymentConfig( country, true, false, false )
132+
);
133+
const methodNames = result.current.optionalMethods.map(
134+
( method ) => method.name
135+
);
136+
expect( methodNames ).not.toContain( 'Fastlane' );
137+
}
138+
);
139+
140+
test.each( [ 'US', 'GB', 'AU' ] )(
141+
'Country %s should contain only ACDC methods when canUseCardPayments is false',
142+
( country ) => {
143+
const { result } = renderHook( () =>
144+
usePaymentConfig( country, false, false, false )
145+
);
146+
const methodNames = result.current.optionalMethods.map(
147+
( method ) => method.name
148+
);
149+
expect( methodNames ).toContain( 'CreditDebitCards' );
150+
}
151+
);
152+
153+
test.each( [ 'US', 'GB', 'AU' ] )(
154+
'Country %s should NOT contain ACDC methods when canUseCardPayments is true',
155+
( country ) => {
156+
const { result } = renderHook( () =>
157+
usePaymentConfig( country, true, false, false )
158+
);
159+
const methodNames = result.current.optionalMethods.map(
160+
( method ) => method.name
161+
);
162+
expect( methodNames ).not.toContain( 'CreditDebitCards' );
163+
}
164+
);
165+
166+
test.each( [ 'US', 'GB', 'AU' ] )(
167+
'Country %s should contain only OwnBrand methods when ownBrandOnly is true',
168+
( country ) => {
169+
const { result } = renderHook( () =>
170+
usePaymentConfig( country, true, true, true )
171+
);
172+
173+
expect(
174+
result.current.optionalMethods.map(
175+
( method ) => method.name
176+
)
177+
).toEqual( [ 'APMs' ] );
178+
}
179+
);
180+
181+
test( 'Country MX should contain non ACDC methods when canUseCardPayments is true', () => {
182+
const { result } = renderHook( () =>
183+
usePaymentConfig( 'MX', true, false, false )
184+
);
185+
const methodNames = result.current.optionalMethods.map(
186+
( method ) => method.name
187+
);
188+
expect( methodNames ).toContain( 'CreditDebitCards' );
189+
expect( methodNames ).toContain( 'APMs' );
190+
} );
191+
192+
test( 'Country MX should contain non ACDC methods when canUseCardPayments is false', () => {
193+
const { result } = renderHook( () =>
194+
usePaymentConfig( 'MX', false, false, false )
195+
);
196+
const methodNames = result.current.optionalMethods.map(
197+
( method ) => method.name
198+
);
199+
expect( methodNames ).toContain( 'CreditDebitCards' );
200+
expect( methodNames ).toContain( 'APMs' );
201+
} );
202+
} );
203+
} );

‎tests/js/__mocks__/@wordpress/components.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// Mock for @wordpress/components
2+
export const Button = ( { children, ...props } ) => {
3+
return <button { ...props }>{ children }</button>;
4+
};

‎tests/js/__mocks__/@wordpress/element.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
// Mock for @wordpress/element
2+
export const useMemo = ( callback ) => callback();

‎tests/js/__mocks__/@wordpress/i18n.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// Mock for @wordpress/i18n
2+
export const __ = ( text ) => {
3+
return text;
4+
};

‎tests/js/jest.config.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,10 @@
44
"moduleDirectories": [ "node_modules" ],
55
"moduleNameMapper": {
66
"^react$": "<rootDir>/node_modules/react",
7-
"^react-dom$": "<rootDir>/node_modules/react-dom"
7+
"^react-dom$": "<rootDir>/node_modules/react-dom",
8+
"^@wordpress/components$": "<rootDir>/tests/__mocks__/wordpress-components.js",
9+
"^@wordpress/element$": "<rootDir>/tests/__mocks__/wordpress-element.js",
10+
"^@wordpress/i18n$": "<rootDir>/tests/__mocks__/wordpress-i18n.js"
811
},
912
"testPathIgnorePatterns": [
1013
"<rootDir>/tests/",

0 commit comments

Comments
 (0)