From 3e283af117a8fe53f31b9ae653e67948cbbcdcaf Mon Sep 17 00:00:00 2001 From: Steven Bal Date: Thu, 10 Oct 2024 12:34:33 +0200 Subject: [PATCH 1/2] :recycle: [open-formulieren/open-forms#4398] Pass initial data ref to backend via login URL previously it was attempted to grab this from the query params, but the parameter was not set anymore at the time it was actually needed (when sending the submission create request, after authentication) --- src/components/Form.js | 9 ++++++++- src/components/FormStart/index.js | 8 ++++++-- src/components/IntroductionPage/index.js | 6 ++++-- src/components/LoginOptions/index.js | 5 +++-- 4 files changed, 21 insertions(+), 7 deletions(-) diff --git a/src/components/Form.js b/src/components/Form.js index d43c0056d..0fbf47d97 100644 --- a/src/components/Form.js +++ b/src/components/Form.js @@ -350,6 +350,8 @@ const Form = () => { ) : null; if (state.startingError) throw state.startingError; + const extraStartUrlParams = {}; + if (initialDataReference) extraStartUrlParams.initial_data_reference = initialDataReference; // Route the correct page based on URL const router = ( @@ -359,7 +361,11 @@ const Form = () => { element={} /> - } /> + } + /> { submission={state.submission} onFormStart={onFormStart} onDestroySession={onDestroySession} + initialDataReference={initialDataReference} /> } diff --git a/src/components/FormStart/index.js b/src/components/FormStart/index.js index ae0fc9679..70acd9940 100644 --- a/src/components/FormStart/index.js +++ b/src/components/FormStart/index.js @@ -41,7 +41,7 @@ const FormStartMessage = ({form}) => { * This is shown when the form is initially loaded and provides the explicit user * action to start the form, or present the login button (DigiD, eHerkenning...) */ -const FormStart = ({form, submission, onFormStart, onDestroySession}) => { +const FormStart = ({form, submission, onFormStart, onDestroySession, initialDataReference}) => { const hasActiveSubmission = !!submission; const isAuthenticated = hasActiveSubmission && submission.isAuthenticated; const doStart = useStartSubmission(); @@ -121,7 +121,11 @@ const FormStart = ({form, submission, onFormStart, onDestroySession}) => { isAuthenticated={isAuthenticated} /> ) : ( - + )} diff --git a/src/components/IntroductionPage/index.js b/src/components/IntroductionPage/index.js index af64e0694..0b6cb6ee0 100644 --- a/src/components/IntroductionPage/index.js +++ b/src/components/IntroductionPage/index.js @@ -9,11 +9,13 @@ import Card from 'components/Card'; import FAIcon from 'components/FAIcon'; import Link from 'components/Link'; -const IntroductionPage = () => { +const IntroductionPage = ({extraParams = {}}) => { const {name, introductionPageContent = ''} = useContext(FormContext); if (!introductionPageContent) { return ; } + let startUrl = '/startpagina'; + if (extraParams) startUrl = `${startUrl}?${new URLSearchParams(extraParams).toString()}`; return ( { /> { +const LoginOptions = ({form, onFormStart, extraParams = {}}) => { const config = useContext(ConfigContext); const loginAsYourselfOptions = []; @@ -18,7 +18,7 @@ const LoginOptions = ({form, onFormStart}) => { form.loginOptions.forEach(option => { let readyOption = {...option}; - readyOption.url = getLoginUrl(option); + readyOption.url = getLoginUrl(option, extraParams); readyOption.label = ( { LoginOptions.propTypes = { form: Types.Form.isRequired, onFormStart: PropTypes.func.isRequired, + extraParams: PropTypes.object, }; export default LoginOptions; From 3a202c028133a7aeb35cdd4561efb0d08f4ef982 Mon Sep 17 00:00:00 2001 From: Steven Bal Date: Mon, 14 Oct 2024 12:33:48 +0200 Subject: [PATCH 2/2] :white_check_mark: [open-formulieren/open-forms#4398] Tests for initialDataReference --- src/components/FormStart/tests.spec.js | 25 ++++++++++++++++++- .../IntroductionPage.stories.js | 13 ++++++++++ 2 files changed, 37 insertions(+), 1 deletion(-) diff --git a/src/components/FormStart/tests.spec.js b/src/components/FormStart/tests.spec.js index b648ecbba..f837d88e3 100644 --- a/src/components/FormStart/tests.spec.js +++ b/src/components/FormStart/tests.spec.js @@ -10,7 +10,7 @@ import {buildSubmission} from 'api-mocks'; import useQuery from 'hooks/useQuery'; import FormStart from '.'; -import {testForm} from './fixtures'; +import {testForm, testLoginForm} from './fixtures'; jest.mock('hooks/useQuery'); let scrollIntoViewMock = jest.fn(); @@ -116,3 +116,26 @@ it('Form start page does not show login buttons if an active submission is prese expect(screen.queryByRole('button', {name: 'Continue existing submission'})).toBeInTheDocument(); expect(screen.queryByRole('button', {name: 'Abort submission'})).toBeInTheDocument(); }); + +it('Form start page with initial_data_reference', () => { + useQuery.mockReturnValue(new URLSearchParams()); + const onFormStart = jest.fn(); + const onDestroySession = jest.fn(); + + renderTest( + + + , + container + ); + const loginLink = screen.getByRole('link', {name: 'Login with DigiD'}); + expect(loginLink).toHaveAttribute( + 'href', + 'https://openforms.nl/auth/form-name/digid/start?initial_data_reference=1234&next=http%3A%2F%2Flocalhost%2F%3F_start%3D1' + ); +}); diff --git a/src/components/IntroductionPage/IntroductionPage.stories.js b/src/components/IntroductionPage/IntroductionPage.stories.js index 75426d914..1df91fcc2 100644 --- a/src/components/IntroductionPage/IntroductionPage.stories.js +++ b/src/components/IntroductionPage/IntroductionPage.stories.js @@ -1,3 +1,4 @@ +import {expect, userEvent, within} from '@storybook/test'; import {withRouter} from 'storybook-addon-remix-react-router'; import {buildForm} from 'api-mocks'; @@ -48,3 +49,15 @@ export default { export const Default = { name: 'IntroductionPage', }; + +export const IntroductionPageWithInitialDataReference = { + name: 'IntroductionPage with initial data reference', + args: { + extraParams: {initial_data_reference: '1234'}, + }, + play: async ({canvasElement}) => { + const canvas = within(canvasElement); + const continueLink = canvas.getByRole('link', {name: 'Continue'}); + await expect(continueLink).toHaveAttribute('href', '/startpagina?initial_data_reference=1234'); + }, +};