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/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');
+ },
+};
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;