Merge pull request #9 from digital-land/backButtons

Back buttons

src/controllers/MyController.js

@@ -0,0 +1,10 @@
+const { Controller } = require('hmpo-form-wizard')
+
+class MyController extends Controller {
+  locals (req, res, callback) {
+    req.form.options.lastPage = req.journeyModel.get('lastVisited')
+    super.locals(req, res, callback)
+  }
+}
+
+module.exports = MyController

src/controllers/dataSubjectController.js

@@ -0,0 +1,9 @@
+'use strict'
+
+const MyController = require('./MyController.js')
+
+class DataSubjectController extends MyController {
+
+}
+
+module.exports = DataSubjectController

src/controllers/datasetController.js

@@ -1,6 +1,6 @@
 'use strict'
 
-const { Controller } = require('hmpo-form-wizard')
+const MyController = require('./MyController.js')
 
 const datasetOptions = {
   'Article 4': [
@@ -40,7 +40,7 @@ const datasetOptions = {
   'Listed building': false
 }
 
-class DatasetController extends Controller {
+class DatasetController extends MyController {
   get (req, res, next) {
     const dataset = req.sessionModel.get('data-subject')
     const options = datasetOptions[dataset]

src/controllers/errorsController.js

@@ -1,8 +1,8 @@
 'use strict'
 
-const { Controller } = require('hmpo-form-wizard')
+const MyController = require('./MyController.js')
 
-class ErrorsController extends Controller {
+class ErrorsController extends MyController {
   get (req, res, next) {
     const json = req.sessionModel.get('validationResult')
 

src/controllers/uploadController.js

@@ -2,7 +2,7 @@
 const multer = require('multer')
 const upload = multer({ dest: 'uploads/' })
 
-const { Controller } = require('hmpo-form-wizard')
+const MyController = require('./MyController.js')
 
 const { readFile } = require('node:fs/promises')
 const { lookup } = require('mime-types')
@@ -11,7 +11,7 @@ const config = require('../../config')
 
 const apiRoute = config.api.url + config.api.validationEndpoint
 
-class UploadController extends Controller {
+class UploadController extends MyController {
   middlewareSetup () {
     super.middlewareSetup()
     this.use('/upload', upload.single('datafile'))

src/routes/form-wizard/steps.js

@@ -6,6 +6,7 @@ module.exports = {
     template: '../views/start.html'
   },
   '/data-subject': {
+    controller: require('../../controllers/dataSubjectController'),
     fields: ['data-subject'],
     next: 'dataset'
   },

src/views/data-subject.html

@@ -1,6 +1,6 @@
 {% extends "layouts/main.html" %}
 
-{% from 'govuk/components/back-link/macro.njk' import govukBackLink %}
+
 {% from 'govuk/components/button/macro.njk' import govukButton %}
 {% from 'govuk/components/radios/macro.njk' import govukRadios %}
 {% from 'govuk/components/error-message/macro.njk' import govukErrorMessage %}
@@ -24,14 +24,6 @@
   {% endif %}
 {% endblock %}
 
-
-{% block beforeContent %}
-  {{ govukBackLink({
-    text: "Back",
-    href: "javascript:window.history.back()"
-  }) }}
-{% endblock %}
-
 {% block content %}
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">

src/views/dataset.html

@@ -1,5 +1,4 @@
 {% extends "layouts/main.html" %}
-{% from 'govuk/components/back-link/macro.njk' import govukBackLink %}
 {% from 'govuk/components/button/macro.njk' import govukButton %}
 {% from 'govuk/components/radios/macro.njk' import govukRadios %}
 {% from 'govuk/components/error-message/macro.njk' import govukErrorMessage %}
@@ -22,13 +21,6 @@
   {% endif %}
 {% endblock %}
 
-{% block beforeContent %}
-  {{ govukBackLink({
-    text: "Back",
-    href: "javascript:window.history.back()"
-  }) }}
-{% endblock %}
-
 {% block content %}
 <div class="govuk-grid-row">
   <div class="govuk-grid-column-two-thirds">

src/views/errors.html

@@ -1,19 +1,11 @@
 {% extends "layouts/main.html" %}
 
-{% from 'govuk/components/back-link/macro.njk' import govukBackLink %}
 {% from 'govuk/components/button/macro.njk' import govukButton %}
 {% from 'govuk/components/radios/macro.njk' import govukRadios %}
 {% from 'govuk/components/inset-text/macro.njk' import govukInsetText %}
 
 {% set pageName = 'There’s a problem' %}
 
-{% block beforeContent %}
-  {{ govukBackLink({
-    text: "Back",
-    href: "javascript:window.history.back()"
-  }) }}
-{% endblock %}
-
 {% block content %}
 
   <div class="govuk-grid-row">

src/views/layouts/main.html

@@ -7,6 +7,7 @@
 {% from 'govuk/components/header/macro.njk' import govukHeader%}
 {% from 'govuk/components/footer/macro.njk' import govukFooter%}
 {% from 'govuk/components/phase-banner/macro.njk' import govukPhaseBanner%}
+{% from 'govuk/components/back-link/macro.njk' import govukBackLink %}
 
 {% block head %}
   <link rel="stylesheet" href="public/stylesheets/index.css">
@@ -28,6 +29,15 @@
   <link rel="stylesheet" href="public/stylesheets/index.css">
 {% endblock %}
 
+{% block beforeContent %}
+  {% if options.lastPage %}
+    {{ govukBackLink({
+      text: "Back",
+      href: options.lastPage
+    }) }}
+  {% endif %}
+{% endblock %}
+
 {% block footer %}
 {% set footerHtml %}
   <h2 class="govuk-heading-m">Get help</h2>

src/views/submit.html

@@ -1,17 +1,9 @@
 {% extends "layouts/main.html" %}
-{% from 'govuk/components/back-link/macro.njk' import govukBackLink %}
 {% from 'govuk/components/button/macro.njk' import govukButton %}
 {% from 'govuk/components/radios/macro.njk' import govukRadios %}
 
 {% set pageName = 'Dataset' %}
 
-{% block beforeContent %}
-  {{ govukBackLink({
-    text: "Back",
-    href: "javascript:window.history.back()"
-  }) }}
-{% endblock %}
-
 {% block content %}
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">

src/views/upload.html

@@ -1,6 +1,5 @@
 {% extends "layouts/main.html" %}
 
-{% from "govuk/components/back-link/macro.njk" import govukBackLink %}
 {% from "govuk/components/file-upload/macro.njk" import govukFileUpload %}
 {% from "govuk/components/button/macro.njk" import govukButton %}
 {% from 'govuk/components/error-message/macro.njk' import govukErrorMessage %}
@@ -24,13 +23,6 @@
   {% endif %}
 {% endblock %}
 
-{% block beforeContent %}
-  {{ govukBackLink({
-    text: "Back",
-    href: "javascript:window.history.back()"
-  }) }}
-{% endblock %}
-
 {% block content %}
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">

test/acceptance/back_buttons.test.js

@@ -0,0 +1,32 @@
+import { test, expect } from '@playwright/test'
+
+test.use({ javaScriptEnabled: false })
+
+test.describe('Back buttons work as expected without js for', () => {
+  test('data subject page', async ({ page, baseURL }) => {
+    await page.goto('/')
+    await page.click('text=Start now')
+    await page.getByRole('link', { name: 'Back', exact: true }).click()
+    expect(page.url()).toBe(baseURL + '/')
+  })
+
+  test('dataset page', async ({ page, baseURL }) => {
+    await page.goto('/')
+    await page.click('text=Start now')
+    await page.getByLabel('Conservation area').check()
+    await page.getByRole('button', { name: 'Continue' }).click()
+    await page.getByRole('link', { name: 'Back', exact: true }).click()
+    expect(page.url()).toBe(baseURL + '/data-subject')
+  })
+
+  test('upload page', async ({ page, baseURL }) => {
+    await page.goto('/')
+    await page.click('text=Start now')
+    await page.getByLabel('Conservation area').check()
+    await page.getByRole('button', { name: 'Continue' }).click()
+    await page.getByLabel('Conservation area dataset').check()
+    await page.getByRole('button', { name: 'Continue' }).click()
+    await page.getByRole('link', { name: 'Back', exact: true }).click()
+    expect(page.url()).toBe(baseURL + '/dataset')
+  })
+})