@wise/dynamic-flow-client-internal 5.28.2 → 5.28.3

package/build/tests/DynamicFlow.test.js

@@ -1,177 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import { vi } from 'vitest';
-import { DynamicFlow } from '../dynamicFlow/DynamicFlow';
-import { DynamicFlowWithRef } from '../dynamicFlow/DynamicFlowWithRef';
-import { renderWithProviders, wait } from '../test-utils';
-import { DynamicFlowModal } from '../dynamicFlow/DynamicFlowModal';
-const user = userEvent.setup({ advanceTimers: vi.advanceTimersByTime });
-const cases = [
-    { name: 'DynamicFlow', DFComponent: DynamicFlow },
-    { name: 'DynamicFlowWithRef', DFComponent: DynamicFlowWithRef },
-    { name: 'DynamicFlowModal', DFComponent: DynamicFlowModal },
-];
-describe.each(cases)('Wise-Specific Headers', ({ name, DFComponent }) => {
-    it(`${name} - makes an initial request with additional RequestInit parameters, as specified in the wise-specific fetcher`, async () => {
-        const props = {
-            flowId: 'test',
-            initialAction: { url: '/initial' },
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        const customFetch = vi.fn();
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props, { customFetch: customFetch })));
-        await waitFor(() => {
-            expect(customFetch).toHaveBeenCalledWith('/initial', expect.anything());
-        });
-        const requestInit = customFetch.mock.calls[0][1];
-        const credentials = requestInit === null || requestInit === void 0 ? void 0 : requestInit.credentials;
-        expect(credentials).toBe('include');
-        const headers = Array.from(new Headers(requestInit === null || requestInit === void 0 ? void 0 : requestInit.headers).entries());
-        expect(headers).toContainEqual(['accept-language', 'en-GB']);
-        expect(headers).toContainEqual(['content-type', 'application/json']);
-    });
-});
-describe.each(cases)('Usage of customFetch function', ({ name, DFComponent }) => {
-    it(`${name} - uses provided customFetch for image-fetching`, async () => {
-        const props = {
-            flowId: 'test',
-            initialStep: {
-                id: 'step-id',
-                title: 'Image Step',
-                layout: [
-                    {
-                        type: 'image',
-                        url: '/image',
-                    },
-                ],
-                schemas: [],
-            },
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        const customFetch = vi.fn();
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props, { customFetch: customFetch })));
-        await waitFor(() => {
-            expect(customFetch).toHaveBeenCalledWith('/image', expect.anything());
-        });
-    });
-});
-describe.each(cases)('onEvent is triggered', ({ name, DFComponent }) => {
-    it(`${name} - triggers provided onEvent when an event is emitted`, async () => {
-        const props = {
-            flowId: 'test',
-            initialAction: { url: '/initial' },
-            customFetch: vi.fn(),
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        const onEvent = vi.fn();
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props, { onEvent: onEvent })));
-        await waitFor(() => {
-            expect(onEvent).toHaveBeenCalledWith('Dynamic Flow - Initiated', expect.objectContaining({ flowId: 'test', integrationId: 'test' }));
-        });
-    });
-});
-describe.each(cases)('Renderer Context', ({ name, DFComponent }) => {
-    it(`${name} - sets buttons to loading while submitting, and then re-enables them `, async () => {
-        const initialStep = {
-            id: 'initial-step',
-            title: 'Initial step',
-            layout: [{ type: 'button', title: 'Submit', action: { id: 'action-id', url: '/submit' } }],
-            schemas: [],
-            model: { name: 'Name', number: '12345' },
-        };
-        const customFetch = vi.fn().mockImplementation(async () => {
-            await wait(100);
-            return new Response(JSON.stringify({
-                id: 'next-step',
-                title: 'Next step',
-                layout: [
-                    { type: 'button', title: 'Finish', action: { id: 'action-id', url: '/submit' } },
-                ],
-                schemas: [],
-            }));
-        });
-        const props = {
-            flowId: 'test',
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any
-            initialStep: initialStep,
-            customFetch,
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props)));
-        const submitButton = screen.getByRole('button', { name: 'Submit' });
-        await user.click(submitButton);
-        expect(submitButton).toHaveAttribute('aria-disabled', 'true');
-        await waitFor(() => {
-            const submitButton2 = screen.getByRole('button', { name: 'Finish' });
-            expect(submitButton2).toBeEnabled();
-        });
-    });
-    it(`${name} - re-enables button if validation fails`, async () => {
-        const initialStep = {
-            id: 'initial-step',
-            title: 'Initial step',
-            layout: [
-                { type: 'form', schemaId: '#schema' },
-                { type: 'button', title: 'Submit', action: { id: 'action-id', url: '/submit' } },
-            ],
-            schemas: [{ type: 'string', $id: '#schema', title: 'Name' }],
-        };
-        const customFetch = vi.fn();
-        const props = {
-            flowId: 'test',
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any
-            initialStep: initialStep,
-            customFetch,
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props)));
-        const submitButton = screen.getByText('Submit');
-        await user.click(submitButton);
-        await waitFor(() => {
-            expect(submitButton).toBeEnabled();
-            expect(submitButton).not.toHaveAttribute('aria-busy', 'true');
-        });
-    });
-    it(`${name} - only shows loader on the button that was clicked`, async () => {
-        const initialStep = {
-            id: 'initial-step',
-            title: 'Initial step',
-            layout: [
-                { type: 'button', title: 'Submit', action: { id: 'action-id', url: '/submit' } },
-                { type: 'button', title: 'Continue', action: { id: 'action-id', url: '/submit' } },
-            ],
-            schemas: [],
-            model: { name: 'Name', number: '12345' },
-        };
-        const customFetch = vi.fn().mockImplementation(async () => {
-            return new Response(JSON.stringify({
-                id: 'next-step',
-                title: 'Next step',
-                layout: [
-                    { type: 'button', title: 'Finish', action: { id: 'action-id', url: '/submit' } },
-                ],
-                schemas: [],
-            }));
-        });
-        const props = {
-            flowId: 'test',
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any
-            initialStep: initialStep,
-            customFetch,
-            onCompletion: vi.fn(),
-            onError: vi.fn(),
-        };
-        renderWithProviders(_jsx(DFComponent, Object.assign({}, props)));
-        const submitButton = screen.getByRole('button', { name: 'Submit' });
-        const continueButton = screen.getByRole('button', { name: 'Continue' });
-        await user.click(submitButton);
-        expect(submitButton).toHaveAttribute('aria-disabled', 'true');
-        expect(continueButton).not.toHaveAttribute('aria-disabled', 'true');
-    });
-});

package/build/tests/HideStepTitle.test.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { screen } from '@testing-library/react';
-import { vi } from 'vitest';
-import { DynamicFlow } from '../dynamicFlow/DynamicFlow';
-import { renderWithProviders } from '../test-utils/rtl-utils';
-const props = {
-    flowId: 'test',
-    initialStep: {
-        id: 'step-id',
-        title: 'Step Title',
-        description: 'Step description.',
-        schemas: [],
-        layout: [],
-    },
-    onCompletion: vi.fn(),
-    onError: vi.fn(),
-    customFetch: vi.fn(),
-};
-describe('When the "displayStepTitle" flag is set to "false"', () => {
-    it('hides the step title in the StepRenderer', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { displayStepTitle: false })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).not.toBeInTheDocument();
-    });
-});
-describe('When the "displayStepTitle" flag is set to "true"', () => {
-    it('shows the step title in the StepRenderer', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { displayStepTitle: true })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).toBeInTheDocument();
-    });
-});
-describe('When the "hideStepTitle" feature is provided', () => {
-    it('hides the step title in the StepRenderer', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { features: { hideStepTitle: true } })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).not.toBeInTheDocument();
-    });
-});
-describe('When the "hideStepTitle" feature is provided as "false"', () => {
-    it('shows the step title in the StepRenderer', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { features: { hideStepTitle: false } })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).toBeInTheDocument();
-    });
-});
-describe('When both "displayStepTitle" flag and "hideStepTitle" feature are provided', () => {
-    it('gives precedence to the "hideStepTitle" feature to hide the step title', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { displayStepTitle: true, features: { hideStepTitle: true } })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).not.toBeInTheDocument();
-    });
-    it('gives precedence to the "hideStepTitle" feature (even when false) to show the step title', () => {
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props, { displayStepTitle: true, features: { hideStepTitle: false } })));
-        expect(screen.queryByText('Step description.')).toBeInTheDocument();
-        expect(screen.queryByText('Step Title')).toBeInTheDocument();
-    });
-});

package/build/tests/RequestCache.test.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { screen, waitFor } from '@testing-library/react';
-import { DynamicFlow } from '../dynamicFlow/DynamicFlow';
-import { renderWithProviders, respondWith } from '../test-utils';
-describe('Initialising DF with a request cache', () => {
-    const defaultProps = {
-        flowId: 'test',
-        initialAction: { url: '/initial-request', method: 'GET' },
-        onCompletion: vi.fn(),
-        onError: vi.fn(),
-    };
-    const initialStep = {
-        id: 'step-id',
-        title: 'Cached step',
-        layout: [],
-        schemas: [],
-    };
-    it('uses the cache value instead of making a network request', async () => {
-        const mockHttpClient = vi.fn().mockImplementation((input, init) => {
-            return respondWith(Object.assign(Object.assign({}, initialStep), { title: 'Fetched step' }));
-        });
-        const cache = [
-            [
-                ['/initial-request', { method: 'GET', headers: [['content-type', 'application/json']] }],
-                Promise.resolve(respondWith(initialStep)),
-            ],
-        ];
-        renderWithProviders(_jsx(DynamicFlow, Object.assign({}, defaultProps, { requestCache: cache, customFetch: mockHttpClient })));
-        await waitFor(() => {
-            expect(screen.getByText('Cached step')).toBeInTheDocument();
-        });
-        expect(mockHttpClient).not.toHaveBeenCalled();
-    });
-});

package/build/tests/SCARejectionHandling.test.js

@@ -1,71 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { act, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
-import { DynamicFlow } from '../dynamicFlow/DynamicFlow';
-import { wait } from '../test-utils';
-import { renderWithProviders } from '../test-utils/rtl-utils';
-const user = userEvent.setup({ advanceTimers: vi.advanceTimersByTime });
-describe('SCA rejection handling', () => {
-    const initialStep = {
-        id: 'step-id',
-        title: 'SCA Integration',
-        schemas: [],
-        layout: [
-            {
-                type: 'button',
-                title: 'Submit',
-                behavior: {
-                    type: 'action',
-                    action: { url: '/sca-request' },
-                },
-            },
-        ],
-    };
-    describe('when SCA modal is closed (the SCA request rejects with `new Error("SCA_MODAL_CLOSED")`)', () => {
-        it('should show NOT show an error message', async () => {
-            const props = {
-                flowId: 'test',
-                initialStep,
-                customFetch: async () => {
-                    await wait(1);
-                    throw new Error('SCA_MODAL_CLOSED');
-                },
-                onCompletion: vi.fn(),
-                onError: vi.fn(),
-            };
-            renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props)));
-            // renderWithProviders results in one <div role="alert" class="snackbar"> which is empty
-            expect(screen.getAllByRole('alert')).toHaveLength(1);
-            // click submit button
-            await user.click(screen.getByRole('button', { name: /submit/i }));
-            // wait for the SCA modal to be closed (simulated)
-            await act(async () => vi.advanceTimersByTimeAsync(200));
-            // we should not see any other alerts in this screen
-            expect(screen.getAllByRole('alert')).toHaveLength(1); // same as before submission
-        });
-    });
-    describe('when SCA request rejects with a different error', () => {
-        it('should show an error message', async () => {
-            const props = {
-                flowId: 'test',
-                initialStep,
-                customFetch: async () => {
-                    await wait(1);
-                    throw new Error('SCA_REQUEST_REJECTED');
-                },
-                onCompletion: vi.fn(),
-                onError: vi.fn(),
-            };
-            renderWithProviders(_jsx(DynamicFlow, Object.assign({}, props)));
-            // renderWithProviders results in one <div role="alert" class="snackbar"> which is empty
-            expect(screen.getAllByRole('alert')).toHaveLength(1);
-            // click submit button
-            await user.click(screen.getByRole('button', { name: /submit/i }));
-            // wait for the SCA modal to be closed (simulated)
-            await waitFor(() => {
-                expect(screen.getByText(/something went wrong/i)).toBeInTheDocument();
-            });
-        });
-    });
-});