@rebilly/framepay-react 13.123.0 → 13.125.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/CHANGELOG.md +2 -2
  2. package/README.md +148 -104
  3. package/build/lib/components/injector.js +1 -1
  4. package/package.json +1 -1
  5. package/src/lib/components/injector.tsx +12 -12
  6. package/tests/e2e/fixtures/apple-pay.html +10 -12
  7. package/tests/e2e/fixtures/bank-separate.html +10 -10
  8. package/tests/e2e/fixtures/card-separate-brands.html +10 -10
  9. package/tests/e2e/fixtures/card-separate-rebilly-fields.html +10 -12
  10. package/tests/e2e/fixtures/card-separate.html +10 -10
  11. package/tests/e2e/fixtures/checkout-combined.html +10 -10
  12. package/tests/e2e/fixtures/google-pay.html +10 -12
  13. package/tests/e2e/fixtures/iban.html +10 -10
  14. package/tests/e2e/fixtures/inject-metadata.html +10 -12
  15. package/tests/e2e/fixtures/multiple-methods.html +10 -10
  16. package/tests/e2e/fixtures/paypal.html +10 -12
  17. package/tests/e2e/fixtures/samsung-pay.html +10 -12
  18. package/tests/e2e/fixtures/style.css +1 -1
  19. package/tests/e2e/local-server.mjs +1 -1
  20. package/tests/e2e/server.mjs +2 -2
  21. package/tests/e2e/specs/bank-separate.plw.ts +18 -6
  22. package/tests/e2e/specs/card-separate-brands.plw.ts +34 -12
  23. package/tests/e2e/specs/card-separate.plw.ts +9 -3
  24. package/tests/e2e/specs/checkout-combined.plw.ts +3 -1
  25. package/tests/e2e/specs/google-pay.plw.ts +4 -2
  26. package/tests/e2e/specs/inject-riskMetadata.plw.ts +6 -2
  27. package/tests/e2e/specs/multiple-methods.plw.ts +96 -32
  28. package/tests/e2e/specs/paypal.plw.ts +3 -1
  29. package/tests/e2e/specs/react-version.plw.ts +5 -2
  30. package/tests/e2e/switch-react-version.js +5 -5
@@ -13,11 +13,19 @@ test.describe('multiple-methods', () => {
13
13
  await expect(page.locator('#events-card-onReady-true')).toBeAttached();
14
14
  });
15
15
 
16
- test('should init with payment-card method by default', async ({ page }) => {
16
+ test('should init with payment-card method by default', async ({
17
+ page,
18
+ }) => {
17
19
  await expect(page.locator('#events-card-onReady-true')).toBeAttached();
18
- await expect(page.locator('#events-bankAccountType-onReady-false')).toBeAttached();
19
- await expect(page.locator('#events-bankAccountNumber-onReady-false')).toBeAttached();
20
- await expect(page.locator('#events-bankRoutingNumber-onReady-false')).toBeAttached();
20
+ await expect(
21
+ page.locator('#events-bankAccountType-onReady-false'),
22
+ ).toBeAttached();
23
+ await expect(
24
+ page.locator('#events-bankAccountNumber-onReady-false'),
25
+ ).toBeAttached();
26
+ await expect(
27
+ page.locator('#events-bankRoutingNumber-onReady-false'),
28
+ ).toBeAttached();
21
29
  await expect(page.locator('#events-iban-onReady-false')).toBeAttached();
22
30
  });
23
31
 
@@ -31,18 +39,30 @@ test.describe('multiple-methods', () => {
31
39
  await expect(page.locator('#events-iban-onReady-false')).toBeAttached();
32
40
 
33
41
  // check bank is loaded
34
- await expect(page.locator('#events-bankAccountNumber-onReady-true')).toBeAttached();
35
- await expect(page.locator('#events-bankAccountType-onReady-true')).toBeAttached();
36
- await expect(page.locator('#events-bankRoutingNumber-onReady-true')).toBeAttached();
42
+ await expect(
43
+ page.locator('#events-bankAccountNumber-onReady-true'),
44
+ ).toBeAttached();
45
+ await expect(
46
+ page.locator('#events-bankAccountType-onReady-true'),
47
+ ).toBeAttached();
48
+ await expect(
49
+ page.locator('#events-bankRoutingNumber-onReady-true'),
50
+ ).toBeAttached();
37
51
 
38
52
  // load IBAN
39
53
  await page.locator('#set-active-element-iban').click();
40
54
 
41
55
  // check other methods are disabled
42
56
  await expect(page.locator('#events-card-onReady-false')).toBeAttached();
43
- await expect(page.locator('#events-bankAccountType-onReady-false')).toBeAttached();
44
- await expect(page.locator('#events-bankAccountNumber-onReady-false')).toBeAttached();
45
- await expect(page.locator('#events-bankRoutingNumber-onReady-false')).toBeAttached();
57
+ await expect(
58
+ page.locator('#events-bankAccountType-onReady-false'),
59
+ ).toBeAttached();
60
+ await expect(
61
+ page.locator('#events-bankAccountNumber-onReady-false'),
62
+ ).toBeAttached();
63
+ await expect(
64
+ page.locator('#events-bankRoutingNumber-onReady-false'),
65
+ ).toBeAttached();
46
66
 
47
67
  // check IBAN is loaded
48
68
  await expect(page.locator('#events-iban-onReady-true')).toBeAttached();
@@ -52,9 +72,15 @@ test.describe('multiple-methods', () => {
52
72
 
53
73
  // check other methods are disabled
54
74
  await expect(page.locator('#events-card-onReady-false')).toBeAttached();
55
- await expect(page.locator('#events-bankAccountType-onReady-false')).toBeAttached();
56
- await expect(page.locator('#events-bankAccountNumber-onReady-false')).toBeAttached();
57
- await expect(page.locator('#events-bankRoutingNumber-onReady-false')).toBeAttached();
75
+ await expect(
76
+ page.locator('#events-bankAccountType-onReady-false'),
77
+ ).toBeAttached();
78
+ await expect(
79
+ page.locator('#events-bankAccountNumber-onReady-false'),
80
+ ).toBeAttached();
81
+ await expect(
82
+ page.locator('#events-bankRoutingNumber-onReady-false'),
83
+ ).toBeAttached();
58
84
  await expect(page.locator('#events-iban-onReady-false')).toBeAttached();
59
85
 
60
86
  // check Google Pay is loaded
@@ -76,38 +102,73 @@ test.describe('multiple-methods', () => {
76
102
 
77
103
  await page.locator('#submit').click();
78
104
 
79
- await expect(page.locator('#events-card-onChange-valid-true')).toBeAttached();
80
- await expect(page.locator('#events-card-onChange-source-card')).toBeAttached();
105
+ await expect(
106
+ page.locator('#events-card-onChange-valid-true'),
107
+ ).toBeAttached();
108
+ await expect(
109
+ page.locator('#events-card-onChange-source-card'),
110
+ ).toBeAttached();
81
111
  await expect(page.locator('#token-error-false')).toBeAttached();
82
- await expect(page.locator('#token-data-method-payment-card')).toBeAttached();
83
- await expect(page.locator('#token-data-paymentInstrument-brand-Visa')).toBeAttached();
112
+ await expect(
113
+ page.locator('#token-data-method-payment-card'),
114
+ ).toBeAttached();
115
+ await expect(
116
+ page.locator('#token-data-paymentInstrument-brand-Visa'),
117
+ ).toBeAttached();
84
118
  });
85
119
 
86
120
  test('should generate the bank token', async ({ page }) => {
87
121
  await page.locator('#set-active-element-bank').click();
88
122
 
89
- await expect(page.locator('#events-bankAccountType-onReady-true')).toBeAttached();
90
- await expect(page.locator('#events-bankAccountNumber-onReady-true')).toBeAttached();
91
- await expect(page.locator('#events-bankRoutingNumber-onReady-true')).toBeAttached();
92
-
93
- await page.frameLocator('iframe#bbanAccountType')
123
+ await expect(
124
+ page.locator('#events-bankAccountType-onReady-true'),
125
+ ).toBeAttached();
126
+ await expect(
127
+ page.locator('#events-bankAccountNumber-onReady-true'),
128
+ ).toBeAttached();
129
+ await expect(
130
+ page.locator('#events-bankRoutingNumber-onReady-true'),
131
+ ).toBeAttached();
132
+
133
+ await page
134
+ .frameLocator('iframe#bbanAccountType')
94
135
  .getByTestId('savings')
95
136
  .click();
96
- await page.frameLocator('iframe#bbanAccountNumber')
137
+ await page
138
+ .frameLocator('iframe#bbanAccountNumber')
97
139
  .getByTestId('bbanAccountNumber')
98
140
  .fill('22222222');
99
- await page.frameLocator('iframe#bbanRoutingNumber')
141
+ await page
142
+ .frameLocator('iframe#bbanRoutingNumber')
100
143
  .getByTestId('bbanRoutingNumber')
101
144
  .fill('11111111');
102
145
 
103
146
  await page.locator('#submit').click();
104
147
 
105
- await expect(page.locator('#events-bankAccountNumber-onChange-valid-true')).toBeAttached();
106
- await expect(page.locator('#events-bankAccountNumber-onChange-source-bankAccountNumber')).toBeAttached();
107
- await expect(page.locator('#events-bankRoutingNumber-onChange-valid-true')).toBeAttached();
108
- await expect(page.locator('#events-bankRoutingNumber-onChange-source-bankRoutingNumber')).toBeAttached();
109
- await expect(page.locator('#events-bankAccountType-onChange-valid-true')).toBeAttached();
110
- await expect(page.locator('#events-bankAccountType-onChange-source-bankAccountType')).toBeAttached();
148
+ await expect(
149
+ page.locator('#events-bankAccountNumber-onChange-valid-true'),
150
+ ).toBeAttached();
151
+ await expect(
152
+ page.locator(
153
+ '#events-bankAccountNumber-onChange-source-bankAccountNumber',
154
+ ),
155
+ ).toBeAttached();
156
+ await expect(
157
+ page.locator('#events-bankRoutingNumber-onChange-valid-true'),
158
+ ).toBeAttached();
159
+ await expect(
160
+ page.locator(
161
+ '#events-bankRoutingNumber-onChange-source-bankRoutingNumber',
162
+ ),
163
+ ).toBeAttached();
164
+ await expect(
165
+ page.locator('#events-bankAccountType-onChange-valid-true'),
166
+ ).toBeAttached();
167
+ await expect(
168
+ page.locator(
169
+ '#events-bankAccountType-onChange-source-bankAccountType',
170
+ ),
171
+ ).toBeAttached();
111
172
  await expect(page.locator('#token-error-false')).toBeAttached();
112
173
  await expect(page.locator('#token-data-method-ach')).toBeAttached();
113
174
  });
@@ -117,13 +178,16 @@ test.describe('multiple-methods', () => {
117
178
 
118
179
  await expect(page.locator('#events-iban-onReady-true')).toBeAttached();
119
180
 
120
- await page.frameLocator('iframe#iban')
181
+ await page
182
+ .frameLocator('iframe#iban')
121
183
  .getByTestId('iban')
122
184
  .fill('DE89 3704 0044 0532 0130 00');
123
185
 
124
186
  await page.locator('#submit').click();
125
187
 
126
- await expect(page.locator('#events-iban-onChange-valid-true')).toBeAttached();
188
+ await expect(
189
+ page.locator('#events-iban-onChange-valid-true'),
190
+ ).toBeAttached();
127
191
  await expect(page.locator('#token-error-false')).toBeAttached();
128
192
  await expect(page.locator('#token-data-method-ach')).toBeAttached();
129
193
  });
@@ -10,6 +10,8 @@ test.describe('paypal', () => {
10
10
  });
11
11
 
12
12
  test('should inject the PayPal iframe into the page', async ({ page }) => {
13
- await expect(page.locator('iframe[title="PayPal-paypal"]:not(.invisible)')).toBeVisible();
13
+ await expect(
14
+ page.locator('iframe[title="PayPal-paypal"]:not(.invisible)'),
15
+ ).toBeVisible();
14
16
  });
15
17
  });
@@ -1,9 +1,12 @@
1
1
  import { test, expect } from '@playwright/test';
2
2
  // eslint-disable-next-line @typescript-eslint/no-require-imports
3
3
  const pkg = require('../../../package.json');
4
- const expectedVersion = process.env.REACT_VERSION ?? pkg.devDependencies.react.slice(1);
4
+ const expectedVersion =
5
+ process.env.REACT_VERSION ?? pkg.devDependencies.react.slice(1);
5
6
 
6
- test(`should render with correct react version (${expectedVersion})`, async ({ page }) => {
7
+ test(`should render with correct react version (${expectedVersion})`, async ({
8
+ page,
9
+ }) => {
7
10
  await page.goto('/');
8
11
  const versionRegex = new RegExp(`^${expectedVersion}`);
9
12
  await expect(page.locator('#react-version')).toHaveText(versionRegex);
@@ -30,16 +30,16 @@ const versionMap = {
30
30
  'react-dom': '15.0.0',
31
31
  jsxRuntime: 'classic',
32
32
  },
33
- '16': {
33
+ 16: {
34
34
  react: '^16',
35
35
  'react-dom': '^16',
36
36
  jsxRuntime: 'classic',
37
37
  },
38
- '17': {
38
+ 17: {
39
39
  react: '^17',
40
40
  'react-dom': '^17',
41
41
  },
42
- '18': {
42
+ 18: {
43
43
  react: '^18',
44
44
  'react-dom': '^18',
45
45
  },
@@ -87,8 +87,8 @@ if (clean) {
87
87
  if (!config) {
88
88
  console.error(
89
89
  `>>> Unknown REACT_VERSION "${version}". Supported: ${Object.keys(
90
- versionMap
91
- ).join(', ')} <<<`
90
+ versionMap,
91
+ ).join(', ')} <<<`,
92
92
  );
93
93
  process.exit(1);
94
94
  }