Merge pull request #2684 from Adyen/fix/v5_fixing_false_positives_in_…

…unit_tests v5 Fixing unit tests that were giving false positives
Adyen · May 15, 2024 · 46bfa65 · 46bfa65
2 parents 33729af + 63057f7
commit 46bfa65
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 26 deletions.
diff --git a/packages/lib/src/components/Redirect/Redirect.test.tsx b/packages/lib/src/components/Redirect/Redirect.test.tsx
@@ -19,7 +19,7 @@ describe('Redirect', () => {
     });
 
     describe('Redirect Status', () => {
-        test('Accepts a POST redirect status', () => {
+        test('Accepts a POST redirect status', done => {
             window.HTMLFormElement.prototype.submit = jest.fn();
 
             // @ts-ignore ignore
@@ -28,18 +28,25 @@ describe('Redirect', () => {
             expect(wrapper.find('form')).toHaveLength(1);
             expect(wrapper.find('form').prop('action')).toBe('http://www.adyen.com');
             expect(wrapper.find('form').prop('target')).toBe(undefined);
-            setTimeout(() => expect(window.HTMLFormElement.prototype.submit).toHaveBeenCalled(), 0);
+
+            setTimeout(() => {
+                expect(window.HTMLFormElement.prototype.submit).toHaveBeenCalled();
+                done();
+            }, 0);
         });
 
-        test('Accepts a POST redirect status, setting target to _top, when the config prop tells it to', () => {
+        test('Accepts a POST redirect status, setting target to _top, when the config prop tells it to', done => {
             window.HTMLFormElement.prototype.submit = jest.fn();
 
             // @ts-ignore ignore
             const wrapper = mount(<RedirectShopper url="http://www.adyen.com" method="POST" data={{}} redirectFromTopWhenInIframe={true} />);
 
             expect(wrapper.find('form')).toHaveLength(1);
             expect(wrapper.find('form').prop('target')).toBe('_top');
-            setTimeout(() => expect(window.HTMLFormElement.prototype.submit).toHaveBeenCalled(), 0);
+            setTimeout(() => {
+                expect(window.HTMLFormElement.prototype.submit).toHaveBeenCalled();
+                done();
+            }, 0);
         });
     });
 

diff --git a/packages/lib/src/components/internal/IbanInput/IbanInput.test.tsx b/packages/lib/src/components/internal/IbanInput/IbanInput.test.tsx
@@ -1,10 +1,12 @@
 import { mount } from 'enzyme';
 import { h } from 'preact';
+import { render, screen } from '@testing-library/preact';
 import IbanInput from './IbanInput';
 import { GenericError } from '../../../core/Errors/types';
 
 const i18n = { get: key => key };
 
+// @ts-ignore is valid tsx
 const createWrapper = (props = {}) => mount(<IbanInput i18n={i18n} {...props} />);
 
 const ibanErrorObj: GenericError = {
@@ -78,33 +80,41 @@ describe('IbanInput', () => {
     });
 
     describe('Send values from outside', () => {
-        test('Set ibanNumber', () => {
-            const wrapper = createWrapper({ data: { ibanNumber: 'NL13TEST0123456789' } });
-            setTimeout(() => {
-                expect(wrapper.find('input[name="ibanNumber"]').text()).toBe('NL13 TEST 0123 4567 89');
-            });
-        });
+        const createElement = (props = {}) => {
+            return (
+                // @ts-ignore is valid tsx
+                <IbanInput data={{}} {...props} />
+            );
+        };
+
+        test('Set ibanNumber', async () => {
+            const el = createElement({ data: { ibanNumber: 'NL13TEST0123456789' } });
+            render(el);
 
-        test('Set ibanNumber formatted', () => {
-            const wrapper = createWrapper({ data: { ibanNumber: 'NL13 TEST 0123 4567 89' } });
-            setTimeout(() => {
-                expect(wrapper.find('input[name="ibanNumber"]').text()).toBe('NL13 TEST 0123 4567 89');
-            });
+            const inputEl = await screen.findByLabelText('Account Number (IBAN)');
+
+            // @ts-ignore method does exist
+            expect(inputEl).toHaveValue('NL13 TEST 0123 4567 89');
         });
 
-        test('Set ownerName', () => {
-            const wrapper = createWrapper({ data: { ownerName: 'Hello World' } });
-            setTimeout(() => {
-                expect(wrapper.find('input[name="ownerName"]').text()).toBe('Hello World');
-            });
+        test('Set ibanNumber formatted', async () => {
+            const el = createElement({ data: { ibanNumber: 'NL13 TEST 0123 4567 89' } });
+            render(el);
+
+            const inputEl = await screen.findByLabelText('Account Number (IBAN)');
+
+            // @ts-ignore method does exist
+            expect(inputEl).toHaveValue('NL13 TEST 0123 4567 89');
         });
 
-        test('Set ibanNumber and ownerName', () => {
-            const wrapper = createWrapper({ data: { ibanNumber: 'NL13TEST0123456789', ownerName: 'Hello World' } });
-            setTimeout(() => {
-                expect(wrapper.find('input[name="ibanNumber"]').text()).toBe('NL13 TEST 0123 4567 89');
-                expect(wrapper.find('input[name="ownerName"]').text()).toBe('Hello World');
-            });
+        test('Set ownerName', async () => {
+            const el = createElement({ data: { ownerName: 'Hello World' } });
+            render(el);
+
+            const inputEl = await screen.findByLabelText('Holder Name');
+
+            // @ts-ignore method does exist
+            expect(inputEl).toHaveValue('Hello World');
         });
     });
 });