@planning-inspectorate/dynamic-forms 1.14.0 → 1.14.1

package/test/questions.test.js

@@ -0,0 +1,246 @@
+import { describe, it } from 'node:test';
+import assert from 'assert';
+import { createApp } from './utils/app.js';
+import { TestServer } from './utils/test-server.js';
+import { getQuestions, questionsInOrder } from './questions.js';
+import { buildGetJourney } from '../src/middleware/build-get-journey.js';
+import { createJourney, JOURNEY_ID } from './journey.js';
+import { buildGetJourneyResponseFromSession, saveDataToSession } from '../src/lib/session-answer-store.js';
+import validate from '../src/validator/validator.js';
+import { validationErrorHandler } from '../src/validator/validation-error-handler.js';
+import { buildSave, list, question } from '../src/controller.js';
+import path from 'path';
+import { COMPONENT_TYPES } from '../src/index.js';
+import { escapeForRegExp, snapshotsDir } from './utils/utils.js';
+import { BOOLEAN_OPTIONS } from '../src/components/boolean/question.js';
+
+/**
+ * @param {import('node:test').TestContext} ctx
+ * @returns {Promise<TestServer>}
+ */
+export async function createAppWithQuestions(ctx) {
+	const app = createApp();
+	const questions = getQuestions();
+	const getJourney = buildGetJourney((req, journeyResponse) => createJourney(questions, journeyResponse));
+	const getJourneyResponse = buildGetJourneyResponseFromSession(JOURNEY_ID);
+
+	// app.use((req, res, next) => {
+	//   console.log(req.method, req.url, req.session);
+	//   next();
+	// });
+
+	app.get('/:section/:question', getJourneyResponse, getJourney, question);
+
+	app.post(
+		'/:section/:question',
+		getJourneyResponse,
+		getJourney,
+		validate,
+		validationErrorHandler,
+		buildSave(saveDataToSession)
+	);
+
+	app.get('/check-your-answers', getJourneyResponse, getJourney, (req, res) => list(req, res, '', {}));
+
+	app.use((error, req, res, next) => {
+		if (error) {
+			console.error('Internal Server Error:', error);
+		}
+		next();
+	});
+
+	app.use((req, res) => {
+		res.status(404);
+	});
+
+	const server = new TestServer(app, { rememberCookies: true });
+	await server.start();
+	ctx.after(async () => await server.stop());
+	return server;
+}
+
+describe('question pages', () => {
+	it('should have a test for each question type', () => {
+		const questionsByType = new Map();
+		for (const q of questionsInOrder) {
+			if (!questionsByType.has(q.type)) {
+				questionsByType.set(q.type, []);
+			}
+			questionsByType.get(q.type).push(q);
+		}
+		for (const [k, v] of Object.entries(COMPONENT_TYPES)) {
+			const questions = questionsByType.get(v);
+			if (!questions || questions.length === 0) {
+				throw new Error(`no test questions for ${k}`);
+			}
+		}
+	});
+
+	for (let i = 0; i < questionsInOrder.length; i++) {
+		const q = questionsInOrder[i];
+
+		it(`should render question: ${q.url}`, async (ctx) => {
+			const testServer = await createAppWithQuestions(ctx);
+
+			const response = await testServer.get('/questions/' + q.url, {
+				redirect: 'manual'
+			});
+			assert.strictEqual(response.status, 200);
+			const text = await response.text();
+			// be sure to escape parentheses in the question text for the regex
+			assert.match(text, new RegExp(escapeForRegExp(q.question), 'i'));
+			assert.match(text, /<form action="" method="post"/i);
+			if (q.options) {
+				for (const option of q.options) {
+					if (q.type === COMPONENT_TYPES.SELECT) {
+						assert.match(
+							text,
+							new RegExp(`<option[^>]*value="${option.value}"[^>]*>\\s*${option.text}\\s*</option>`, 'i')
+						);
+					} else {
+						assert.match(text, new RegExp(`<input[^>]*value="${option.value}"[^>]*>`));
+						assert.match(text, new RegExp(`<label[^>]*>\\s*${option.text}\\s*</label>`, 'i'));
+					}
+				}
+			}
+			ctx.assert.fileSnapshot(text, path.join(snapshotsDir(), q.url + '.html'), {
+				serializers: [(v) => v]
+			});
+		});
+
+		it(`should POST valid data for question: ${q.url} and redirect to next`, async (ctx) => {
+			const testServer = await createAppWithQuestions(ctx);
+			const payload = mockAnswerBody(q);
+			const response = await testServer.post(`/questions/${q.url}`, payload, { redirect: 'manual' });
+			if (![302, 303].includes(response.status)) {
+				const text = await response.text();
+				console.log(`Response for ${q.url}:\n`, text);
+			}
+			// Should redirect (302 or 303)
+			assert.ok([302, 303].includes(response.status), `Expected redirect, got ${response.status}`);
+			// Should redirect to the next question (if there is one)
+			const location = response.headers.get('location');
+			const nextQ = questionsInOrder[i + 1];
+			if (nextQ) {
+				assert.strictEqual(location, `questions/${nextQ.url}`);
+			} else {
+				assert.strictEqual(location, 'check-your-answers');
+			}
+		});
+	}
+});
+
+/**
+ * Build a valid payload for a question.
+ * @param {import('../src/questions/question-props.js').QuestionProps} q
+ * @returns {Object}
+ */
+export function mockAnswerBody(q) {
+	switch (q.type) {
+		case COMPONENT_TYPES.BOOLEAN:
+			return { [q.fieldName]: BOOLEAN_OPTIONS.YES };
+		case COMPONENT_TYPES.CHECKBOX:
+			return { [q.fieldName]: [q.options[0].value] };
+		case COMPONENT_TYPES.RADIO:
+		case COMPONENT_TYPES.SELECT:
+			return { [q.fieldName]: q.options[0].value };
+		case COMPONENT_TYPES.NUMBER:
+			return { [q.fieldName]: 1 };
+		case COMPONENT_TYPES.DATE:
+			return {
+				[q.fieldName + '_day']: 1,
+				[q.fieldName + '_month']: 1,
+				[q.fieldName + '_year']: 2025
+			};
+		case COMPONENT_TYPES.DATE_PERIOD:
+			return {
+				[q.fieldName + '_start_day']: 1,
+				[q.fieldName + '_start_month']: 1,
+				[q.fieldName + '_start_year']: 2025,
+				[q.fieldName + '_end_day']: 2,
+				[q.fieldName + '_end_month']: 1,
+				[q.fieldName + '_end_year']: 2025
+			};
+		case COMPONENT_TYPES.DATE_TIME:
+			return {
+				[q.fieldName + '_day']: 1,
+				[q.fieldName + '_month']: 1,
+				[q.fieldName + '_year']: 2025,
+				[q.fieldName + '_hour']: 10,
+				[q.fieldName + '_minutes']: 45,
+				[q.fieldName + '_period']: 'am'
+			};
+		case COMPONENT_TYPES.TEXT_ENTRY:
+		case COMPONENT_TYPES.SINGLE_LINE_INPUT:
+			return { [q.fieldName]: 'test' };
+		case COMPONENT_TYPES.TEXT_ENTRY_REDACT:
+			return { [q.fieldName]: 'secret' };
+		case COMPONENT_TYPES.MULTI_FIELD_INPUT: {
+			const res = {};
+			for (const field of q.inputFields) {
+				res[field.fieldName] = mockAnswer(field);
+			}
+			return res;
+		}
+		case COMPONENT_TYPES.ADDRESS:
+			return {
+				[q.fieldName + '_addressLine1']: '1 Test St',
+				[q.fieldName + '_townCity']: 'Testville',
+				[q.fieldName + '_postcode']: 'TE5 5ST'
+			};
+		case COMPONENT_TYPES.UNIT_OPTION:
+			return {
+				[q.fieldName]: 'kg',
+				[q.options[0].conditional.fieldName]: 10
+			};
+		default:
+			return { [q.fieldName]: 'test' };
+	}
+}
+
+/**
+ * Build a valid & formatted answer for a question.
+ * @param {import('../src/questions/question-props.js').QuestionProps} q
+ * @returns {Object}
+ */
+export function mockAnswer(q) {
+	switch (q.type) {
+		case COMPONENT_TYPES.BOOLEAN:
+			return BOOLEAN_OPTIONS.YES;
+		case COMPONENT_TYPES.CHECKBOX:
+			return q.options[0].text;
+		case COMPONENT_TYPES.RADIO:
+		case COMPONENT_TYPES.SELECT:
+			return q.options[0].text;
+		case COMPONENT_TYPES.NUMBER:
+			return 1;
+		case COMPONENT_TYPES.DATE:
+			return '1 January 2025';
+		case COMPONENT_TYPES.DATE_PERIOD:
+			return 'Start: 00:00 1 January 2025<br>End: 00:00 2 January 2025';
+		case COMPONENT_TYPES.DATE_TIME:
+			return '1 January 2025<br>10:45am';
+		case COMPONENT_TYPES.TEXT_ENTRY:
+		case COMPONENT_TYPES.SINGLE_LINE_INPUT:
+			return 'test';
+		case COMPONENT_TYPES.TEXT_ENTRY_REDACT:
+			return 'secret';
+		case COMPONENT_TYPES.MULTI_FIELD_INPUT:
+			if (q.inputFields) {
+				let res = '';
+				for (const field of q.inputFields) {
+					res += mockAnswer(field) + '<br>';
+				}
+				return res;
+			}
+			break;
+		case COMPONENT_TYPES.ADDRESS: {
+			const answer = mockAnswerBody(q);
+			return Object.values(answer).filter(Boolean).join('<br>');
+		}
+		case COMPONENT_TYPES.UNIT_OPTION:
+			return '10 kg';
+		default:
+			return 'test';
+	}
+}

package/test/snapshots/add-insurance.html

@@ -0,0 +1,44 @@
+    <div class="govuk-grid-row">
+        <div class="govuk-grid-column-two-thirds">
+        </div>
+    </div>
+
+    
+    <div class="govuk-grid-row">
+        <div class="govuk-grid-column-two-thirds">
+            <form action="" method="post" novalidate>
+                <input type="hidden" name="_csrf" value="">
+                    <div class="govuk-form-group">
+  <fieldset class="govuk-fieldset" aria-describedby="addInsurance-hint">
+    <legend class="govuk-fieldset__legend govuk-fieldset__legend--l">
+      <h1 class="govuk-fieldset__heading">
+        Do you want to add travel insurance to your holiday?
+      </h1>
+    </legend>
+    <div id="addInsurance-hint" class="govuk-hint">
+      
+    </div>
+    <div class="govuk-radios govuk-radios" data-module="govuk-radios">
+      <div class="govuk-radios__item">
+        <input class="govuk-radios__input" id="addInsurance" name="addInsurance" type="radio" value="yes" data-cy="answer-yes">
+        <label class="govuk-label govuk-radios__label" for="addInsurance">
+          Yes
+        </label>
+      </div>
+      <div class="govuk-radios__item">
+        <input class="govuk-radios__input" id="addInsurance-2" name="addInsurance" type="radio" value="no" data-cy="answer-no">
+        <label class="govuk-label govuk-radios__label" for="addInsurance-2">
+          No
+        </label>
+      </div>
+    </div>
+  </fieldset>
+</div>
+
+
+                <button type="submit" class="govuk-button" data-module="govuk-button" data-cy="button-save-and-continue">
+  Continue
+</button>
+            </form>
+        </div>
+    </div>

package/test/snapshots/check-your-answers-not-started.html

@@ -0,0 +1,201 @@
+
+    <style >
+        .app-task-list {
+          padding-left: 0;
+        }
+        .app-task-list>li {
+          position: relative;
+          list-style-type: none;
+
+        }
+        .app-task-list__section .govuk-tag {
+          position: absolute;
+          top: 3px;
+          right: 0;
+        }
+        .app-task-list .govuk-summary-list {
+          border-top: 1px solid #b1b4b6;
+        }
+    </style>
+
+    <div class="govuk-grid-row">
+        <div class="govuk-grid-column-full">
+                        <dl class="govuk-summary-list">
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Activities
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-activities">Answer<span class="govuk-visually-hidden"> Which activities do you want to do on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Insurance
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/add-insurance">Answer<span class="govuk-visually-hidden"> Do you want to add travel insurance to your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Insurance Type
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/travel-insurance-type">Answer<span class="govuk-visually-hidden"> Which type of travel insurance would you like?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Destination
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-destination">Answer<span class="govuk-visually-hidden"> Where would you like to go on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Departure Date
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/departure-date">Answer<span class="govuk-visually-hidden"> When do you want to start your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Period
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-period">Answer<span class="govuk-visually-hidden"> What is the period of your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Description
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-description">Answer<span class="govuk-visually-hidden"> Describe your ideal holiday.</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Secret Holiday Wish
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/secret-wish">Answer<span class="govuk-visually-hidden"> Share a secret wish for your holiday (will be redacted).</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Class
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/travel-class">Answer<span class="govuk-visually-hidden"> Which class do you want to travel in?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Arrival
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-arrival">Answer<span class="govuk-visually-hidden"> When would you like to arrive at your destination?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Favourite Holiday Snack
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-snack">Answer<span class="govuk-visually-hidden"> What is your favourite snack to eat on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Companions
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/companions">Answer<span class="govuk-visually-hidden"> Enter the names and ages of your travel companions.</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Number of Nights
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/nights">Answer<span class="govuk-visually-hidden"> How many nights will you stay on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Hotel Address
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/hotel-address">Answer<span class="govuk-visually-hidden"> What is the address of your hotel?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Luggage Weight
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Not started
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/luggage-weight-units">Answer<span class="govuk-visually-hidden"> Select your luggage weight and unit.</span></a>
+    </dd>
+  </div>
+</dl>
+
+        <form action method="post">
+            <input type="hidden" name="_csrf" value="">
+            <button type="submit" class="govuk-button" data-module="govuk-button">
+  Accept &amp; Submit
+</button>
+        </form>
+
+        </div>
+    </div>
+
+

package/test/snapshots/check-your-answers-with-answers.html

@@ -0,0 +1,201 @@
+
+    <style >
+        .app-task-list {
+          padding-left: 0;
+        }
+        .app-task-list>li {
+          position: relative;
+          list-style-type: none;
+
+        }
+        .app-task-list__section .govuk-tag {
+          position: absolute;
+          top: 3px;
+          right: 0;
+        }
+        .app-task-list .govuk-summary-list {
+          border-top: 1px solid #b1b4b6;
+        }
+    </style>
+
+    <div class="govuk-grid-row">
+        <div class="govuk-grid-column-full">
+                        <dl class="govuk-summary-list">
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Activities
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Swimming
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-activities">Change<span class="govuk-visually-hidden"> Which activities do you want to do on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Insurance
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Yes
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/add-insurance">Change<span class="govuk-visually-hidden"> Do you want to add travel insurance to your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Insurance Type
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Basic
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/travel-insurance-type">Change<span class="govuk-visually-hidden"> Which type of travel insurance would you like?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Destination
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Beach
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-destination">Change<span class="govuk-visually-hidden"> Where would you like to go on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Departure Date
+    </dt>
+    <dd class="govuk-summary-list__value">
+      1 January 2025
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/departure-date">Change<span class="govuk-visually-hidden"> When do you want to start your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Period
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Start: 00:00 1 January 2025<br>End: 00:00 2 January 2025
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-period">Change<span class="govuk-visually-hidden"> What is the period of your holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Description
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Test
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-description">Change<span class="govuk-visually-hidden"> Describe your ideal holiday.</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Secret Holiday Wish
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Secret
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/secret-wish">Change<span class="govuk-visually-hidden"> Share a secret wish for your holiday (will be redacted).</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Class
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Economy
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/travel-class">Change<span class="govuk-visually-hidden"> Which class do you want to travel in?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Holiday Arrival
+    </dt>
+    <dd class="govuk-summary-list__value">
+      1 January 2025<br>10:45am
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-arrival">Change<span class="govuk-visually-hidden"> When would you like to arrive at your destination?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Favourite Holiday Snack
+    </dt>
+    <dd class="govuk-summary-list__value">
+      Test
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/holiday-snack">Change<span class="govuk-visually-hidden"> What is your favourite snack to eat on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Travel Companions
+    </dt>
+    <dd class="govuk-summary-list__value">
+      test<br>1<br>
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/companions">Change<span class="govuk-visually-hidden"> Enter the names and ages of your travel companions.</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Number of Nights
+    </dt>
+    <dd class="govuk-summary-list__value">
+      1
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/nights">Change<span class="govuk-visually-hidden"> How many nights will you stay on holiday?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Hotel Address
+    </dt>
+    <dd class="govuk-summary-list__value">
+      1 Test St<br>Testville<br>TE5 5ST
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/hotel-address">Change<span class="govuk-visually-hidden"> What is the address of your hotel?</span></a>
+    </dd>
+  </div>
+  <div class="govuk-summary-list__row">
+    <dt class="govuk-summary-list__key">
+      Luggage Weight
+    </dt>
+    <dd class="govuk-summary-list__value">
+      10 kg
+    </dd>
+    <dd class="govuk-summary-list__actions">
+      <a class="govuk-link" href="questions/luggage-weight-units">Change<span class="govuk-visually-hidden"> Select your luggage weight and unit.</span></a>
+    </dd>
+  </div>
+</dl>
+
+        <form action method="post">
+            <input type="hidden" name="_csrf" value="">
+            <button type="submit" class="govuk-button" data-module="govuk-button">
+  Accept &amp; Submit
+</button>
+        </form>
+
+        </div>
+    </div>
+
+