feat/df-875: Handles no state on save-and-exit (#1124)

* Handles no state on save-and-exit

* Extra coverage

* Slight rework

* Extra coverage

* Fixed path

* Reworked after review

* Content change atfer review

* Rework atfer review

* Missing space in JSDoc

Author: jbarnsley10

src/server/models/save-and-exit.js

@@ -22,6 +22,7 @@ const emailFieldName = 'email'
 const emailConfirmationFieldName = 'emailConfirmation'
 const securityQuestionFieldName = 'securityQuestion'
 const securityAnswerFieldName = 'securityAnswer'
+const general = 'general'
 
 const GOVUK_LABEL__M = 'govuk-label--m'
 const saveAndExitExpiryDays = config.get('saveAndExitExpiryDays')
@@ -55,6 +56,7 @@ function buildErrors(err) {
     return {}
   }
 
+  const generalError = err.details.find((item) => item.path[0] === general)
   const emailError = err.details.find((item) => item.path[0] === emailFieldName)
   const emailConfirmationError = err.details.find(
     (item) => item.path[0] === emailConfirmationFieldName
@@ -65,8 +67,13 @@ function buildErrors(err) {
   const securityAnswerError = err.details.find(
     (item) => item.path[0] === securityAnswerFieldName
   )
+
   const errors = []
 
+  if (generalError) {
+    errors.push({ text: generalError.message, href: '#' })
+  }
+
   if (emailError) {
     errors.push({ text: emailError.message, href: `#${emailFieldName}` })
   }

src/server/routes/save-and-exit-helper.js

@@ -8,7 +8,16 @@ export function getPayloadFromFlash(request) {
   return request.yar.flash(SAVE_AND_EXIT_PAYLOAD)
 }
 
+/**
+ * Check that the form has state
+ * @param {FormSubmissionState} formState
+ */
+export function hasState(formState) {
+  return Object.keys(formState).length > 0
+}
+
 /**
  * @import { Request } from '@hapi/hapi'
  * @import { SaveAndExitParams } from '~/src/server/models/save-and-exit.js'
+ * @import { FormSubmissionState } from '@defra/forms-engine-plugin/engine/types.js'
  */

src/server/routes/save-and-exit-helper.test.js

@@ -0,0 +1,27 @@
+import {
+  getPayloadFromFlash,
+  hasState
+} from '~/src/server/routes/save-and-exit-helper.js'
+
+describe('save-and-exit-helper tests', () => {
+  describe('getPayloadFromFlash', () => {
+    test('calls flash', () => {
+      const mockRequest = {
+        yar: { flash: jest.fn().mockReturnValueOnce('flash-content') }
+      }
+      // @ts-expect-error - partial mock of request
+      const res = getPayloadFromFlash(mockRequest)
+      expect(res).toBe('flash-content')
+    })
+  })
+
+  describe('hasState', () => {
+    test('returns true if some state', () => {
+      expect(hasState({ field1: 'val1' })).toBe(true)
+    })
+
+    test('returns false if no state', () => {
+      expect(hasState({})).toBe(false)
+    })
+  })
+})

src/server/routes/save-and-exit.js

@@ -11,6 +11,7 @@ import { StatusCodes } from 'http-status-codes'
 import Joi from 'joi'
 
 import { createLogger } from '~/src/server/common/helpers/logging/logger.js'
+import { createJoiError } from '~/src/server/helpers/error-helper.js'
 import { publishSaveAndExitEvent } from '~/src/server/messaging/publish.js'
 import {
   confirmationViewModel,
@@ -26,7 +27,10 @@ import {
   resumeSuccessViewModel,
   validatePayloadSchema
 } from '~/src/server/models/save-and-exit.js'
-import { getPayloadFromFlash } from '~/src/server/routes/save-and-exit-helper.js'
+import {
+  getPayloadFromFlash,
+  hasState
+} from '~/src/server/routes/save-and-exit-helper.js'
 import {
   getFormMetadata,
   getFormMetadataById,
@@ -40,6 +44,7 @@ const maxInvalidPasswordAttempts = 5
 const ERROR_BASE_URL = '/resume-form-error'
 
 // View paths
+const SAVE_AND_EXIT_DETAILS = 'save-and-exit/details'
 const RESUME_ERROR = 'save-and-exit/resume-error'
 const RESUME_ERROR_LOCKED = 'save-and-exit/resume-error-locked'
 const RESUME_PASSWORD_PATH = 'save-and-exit/resume-password'
@@ -52,6 +57,19 @@ export function getPasswordAttemptsLeft(attemptsSoFar) {
   return maxInvalidPasswordAttempts - attemptsSoFar
 }
 
+/**
+ * @param {Partial<{ errors?: { text: string, href: string }[]}>} model
+ * @param {{ href: string, text: string }} error
+ */
+export function addError(model, error) {
+  if (model.errors) {
+    model.errors.push(error)
+  } else {
+    model.errors = [error]
+  }
+  return model
+}
+
 export default [
   /**
    * @satisfies {ServerRoute<{ Params: SaveAndExitParams }>}
@@ -70,6 +88,13 @@ export default [
       // The current page state may be invalid so we don't want to push into the cache as normal properties.
       const cacheService = getCacheService(request.server)
       const formState = await cacheService.getState(request)
+
+      // Handle the user navigating back from previously submitting a save-and-exit. The state has been cleared
+      // so just show the form from the start
+      if (!hasState(formState)) {
+        return h.redirect(model.serviceUrl)
+      }
+
       const pagePayload = getPayloadFromFlash(request)
       const currentPagePayload = Array.isArray(pagePayload)
         ? {}
@@ -98,7 +123,9 @@ export default [
       // Clear any previous save and exit session state
       request.yar.clear(getKey(slug, status))
 
-      return h.view('save-and-exit/details', model)
+      return h
+        .view(SAVE_AND_EXIT_DETAILS, model)
+        .header('Cache-Control', 'no-cache, no-store, must-revalidate')
     },
     options: {
       validate: {
@@ -126,6 +153,23 @@ export default [
       }
       const state = await cacheService.getState(request)
 
+      const statusPath = status ? `/${status}` : ''
+
+      // Handle the user navigating back from previously submitting a save-and-exit. The state has been cleared
+      // so we need to warn the user
+      if (!hasState(state)) {
+        const model = detailsViewModel(
+          metadata,
+          status,
+          /** @type {SaveAndExitPayload} */ (payload),
+          createJoiError(
+            'general',
+            'Your information is no longer available. Return to the start of the form.'
+          )
+        )
+        return h.view(SAVE_AND_EXIT_DETAILS, model).takeover()
+      }
+
       await publishSaveAndExitEvent(
         metadata.id,
         metadata.title,
@@ -142,8 +186,6 @@ export default [
       request.yar.set(getKey(slug, status), email)
 
       // Redirect to the save and exit confirmation page
-      const statusPath = status ? `/${status}` : ''
-
       return h.redirect(`/save-and-exit/${slug}/confirmation${statusPath}`)
     },
     options: {
@@ -159,7 +201,7 @@ export default [
             err
           )
 
-          return h.view('save-and-exit/details', model).takeover()
+          return h.view(SAVE_AND_EXIT_DETAILS, model).takeover()
         },
         params: paramsSchema,
         payload: payloadSchema

src/server/routes/save-and-exit.test.js

@@ -2,6 +2,7 @@ import { StatusCodes } from 'http-status-codes'
 
 import { createJoiError } from '~/src/server/helpers/error-helper.js'
 import { createServer } from '~/src/server/index.js'
+import { addError } from '~/src/server/routes/save-and-exit.js'
 import {
   getFormMetadata,
   getFormMetadataById,
@@ -480,6 +481,22 @@ describe('Save-and-exit check routes', () => {
       expect(response.headers.location).toBe('/resume-form-error')
     })
   })
+
+  describe('addError', () => {
+    test('adds error to existing array', () => {
+      const model = { errors: [{ href: '#', text: 'Some error text1' }] }
+      const error = { href: '#', text: 'Some error text2' }
+      const newModel = addError(model, error)
+      expect(newModel.errors).toHaveLength(2)
+    })
+
+    test('adds error to new error array', () => {
+      const model = {}
+      const error = { href: '#', text: 'Some error text' }
+      const newModel = addError(model, error)
+      expect(newModel.errors).toHaveLength(1)
+    })
+  })
 })
 
 /**

test/form/save-and-exit.test.js

@@ -4,7 +4,10 @@ import { within } from '@testing-library/dom'
 import { StatusCodes } from 'http-status-codes'
 
 import { createServer } from '~/src/server/index.js'
-import { getPayloadFromFlash } from '~/src/server/routes/save-and-exit-helper.js'
+import {
+  getPayloadFromFlash,
+  hasState
+} from '~/src/server/routes/save-and-exit-helper.js'
 import { getFormMetadata } from '~/src/server/services/formsService.js'
 import * as fixtures from '~/test/fixtures/index.js'
 import { renderResponse } from '~/test/helpers/component-helpers.js'
@@ -31,6 +34,7 @@ describe('Save and exit', () => {
 
   beforeEach(() => {
     jest.mocked(getFormMetadata).mockResolvedValue(fixtures.form.metadata)
+    jest.mocked(hasState).mockReturnValue(true)
   })
 
   afterAll(async () => {
@@ -104,6 +108,20 @@ describe('Save and exit', () => {
     expect($securityAnswerLabel).toBeInTheDocument()
   })
 
+  it('redirects to first page of form when missing state', async () => {
+    const options = {
+      method: 'GET',
+      url: '/save-and-exit/basic'
+    }
+
+    jest.mocked(hasState).mockReturnValue(false)
+
+    const { response } = await renderResponse(server, options)
+
+    expect(response.statusCode).toBe(StatusCodes.MOVED_TEMPORARILY)
+    expect(response.headers.location).toBe('/form/test-form')
+  })
+
   it('shows the details page with errors', async () => {
     const options = {
       method: 'POST',
@@ -161,6 +179,36 @@ describe('Save and exit', () => {
     expect(response2.statusCode).toBe(StatusCodes.OK)
   })
 
+  it('posts details page catches error if no state', async () => {
+    const options = {
+      method: 'POST',
+      url: '/save-and-exit/basic',
+      payload: {
+        email: 'enrique.chase@defra.gov.uk',
+        emailConfirmation: 'enrique.chase@defra.gov.uk',
+        securityQuestion: 'audio-recommendation',
+        securityAnswer: 'Chase & Status'
+      }
+    }
+
+    jest.mocked(hasState).mockReturnValue(false)
+
+    const { container } = await renderResponse(server, options)
+
+    const $errorSummary = container.getByRole('alert')
+    const $heading = within($errorSummary).getByRole('heading', {
+      name: 'There is a problem',
+      level: 2
+    })
+    const $errorItems = within($errorSummary).getAllByRole('listitem')
+
+    expect($errorSummary).toBeInTheDocument()
+    expect($heading).toBeInTheDocument()
+    expect($errorItems[0]).toHaveTextContent(
+      'Your information is no longer available. Return to the start of the form.'
+    )
+  })
+
   it('confirmation page errors if no details are flashed', async () => {
     const options = {
       method: 'GET',