@defra/forms-engine-plugin 4.0.33 → 4.0.34

package/src/server/plugins/engine/pageControllers/errors.test.ts

@@ -0,0 +1,63 @@
+import { ComponentType } from '@defra/forms-model'
+
+import { FileUploadField } from '~/src/server/plugins/engine/components/FileUploadField.js'
+import { TextField } from '~/src/server/plugins/engine/components/TextField.js'
+import { FormModel } from '~/src/server/plugins/engine/models/FormModel.js'
+import { InvalidComponentStateError } from '~/src/server/plugins/engine/pageControllers/errors.js'
+import definition from '~/test/form/definitions/file-upload-basic.js'
+
+describe('InvalidComponentStateError', () => {
+  let model: FormModel
+
+  beforeEach(() => {
+    model = new FormModel(definition, {
+      basePath: 'test'
+    })
+  })
+
+  describe('getStateKeys', () => {
+    it('should return component name and upload for FileUploadField', () => {
+      const page = model.pages.find((p) => p.path === '/file-upload-component')
+      const component = new FileUploadField(
+        {
+          name: 'fileUpload',
+          title: 'Upload something',
+          type: ComponentType.FileUploadField,
+          options: {},
+          schema: {}
+        },
+        { model, page }
+      )
+
+      const error = new InvalidComponentStateError(
+        component,
+        'Test error message'
+      )
+      const stateKeys = error.getStateKeys()
+
+      expect(stateKeys).toEqual(['fileUpload', 'upload'])
+    })
+
+    it('should return only component name for non-FileUploadField components', () => {
+      const page = model.pages.find((p) => p.path === '/file-upload-component')
+      const component = new TextField(
+        {
+          name: 'textField',
+          title: 'Text field',
+          type: ComponentType.TextField,
+          options: {},
+          schema: {}
+        },
+        { model, page }
+      )
+
+      const error = new InvalidComponentStateError(
+        component,
+        'Test error message'
+      )
+      const stateKeys = error.getStateKeys()
+
+      expect(stateKeys).toEqual(['textField'])
+    })
+  })
+})

package/src/server/plugins/engine/pageControllers/errors.ts

@@ -0,0 +1,30 @@
+import { FileUploadField } from '~/src/server/plugins/engine/components/FileUploadField.js'
+import { type FormComponent } from '~/src/server/plugins/engine/components/FormComponent.js'
+
+/**
+ * Thrown when a component has an invalid state. This is typically only required where state needs
+ * to be checked against an external source upon submission of a form. For example: file upload
+ * has internal state (file upload IDs) but also external state (files in S3). The internal state
+ * is always validated by the engine, but the external state needs validating too.
+ *
+ * This should be used within a formComponent.onSubmit(...).
+ */
+export class InvalidComponentStateError extends Error {
+  public readonly component: FormComponent
+  public readonly userMessage: string
+
+  constructor(component: FormComponent, userMessage: string) {
+    const message = `Invalid component state for: ${component.name}`
+    super(message)
+    this.name = 'InvalidComponentStateError'
+    this.component = component
+    this.userMessage = userMessage
+  }
+
+  getStateKeys() {
+    const extraStateKeys =
+      this.component instanceof FileUploadField ? ['upload'] : []
+
+    return [this.component.name].concat(extraStateKeys)
+  }
+}

package/src/server/plugins/engine/services/localFormsService.js

@@ -51,5 +51,12 @@ export const formsService = async () => {
     slug: 'components'
   })
 
+  await loader.addForm('src/server/forms/simple-form.yaml', {
+    ...metadata,
+    id: 'a1b2c3d4-e5f6-7890-abcd-ef0123456789',
+    title: 'Simple Form',
+    slug: 'simple-form'
+  })
+
   return loader.toFormsService()
 }

package/src/server/plugins/engine/views/index.html

@@ -10,7 +10,7 @@
         {% include "partials/preview-banner.html" %}
       {% endif %}
 
-      {% if errors %}
+      {% if errors | length  %}
         {{ govukErrorSummary({
           titleText: "There is a problem",
           errorList: checkErrorTemplates(errors)

package/src/server/plugins/nunjucks/context.test.js

@@ -87,7 +87,11 @@ describe('Nunjucks context', () => {
             }
           },
           path: '/test',
-          url: { search: '' }
+          url: { search: '' },
+          yar: {
+            flash: jest.fn().mockReturnValue([]),
+            commit: jest.fn()
+          }
           // state intentionally omitted to test real malformed requests
         })
       )
@@ -121,7 +125,11 @@ describe('Nunjucks context', () => {
           },
           path: '/test',
           url: { search: '' },
-          state: {}
+          state: {},
+          yar: {
+            flash: jest.fn().mockReturnValue([]),
+            commit: jest.fn()
+          }
         })
       )
 

package/src/server/plugins/nunjucks/types.js

@@ -17,6 +17,7 @@
  * @property {string} [currentPath] - Current path
  * @property {string} [previewMode] - Preview mode
  * @property {string} [slug] - Form slug
+ * @property {string} [error] - Error message for temporary error messages (not related to form state)
  * @property {FormContext} [context] - the current form context
  */
 

package/src/server/services/cacheService.ts

@@ -99,6 +99,22 @@ export class CacheService {
     request.yar.flash(key.id, message)
   }
 
+  async resetComponentStates(
+    request: AnyFormRequest,
+    componentNames: string[]
+  ) {
+    const state = await this.getState(request)
+
+    for (const componentName of componentNames) {
+      if (componentName in state) {
+        // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
+        delete state[componentName]
+      }
+    }
+
+    return this.setState(request, state)
+  }
+
   /**
    * The key used to store user session data against.
    * If there are multiple forms on the same runner instance, for example `form-a` and `form-a-feedback` this will prevent CacheService from clearing data from `form-a` if a user gave feedback before they finished `form-a`

package/src/typings/hapi/index.d.ts

@@ -5,6 +5,7 @@ import { type ServerYar, type Yar } from '@hapi/yar'
 import { type Logger } from 'pino'
 
 import {
+  type COMPONENT_STATE_ERROR,
   type EXTERNAL_STATE_APPENDAGE,
   type EXTERNAL_STATE_PAYLOAD
 } from '~/src/server/constants.js'
@@ -20,6 +21,7 @@ declare module '@hapi/yar' {
   interface YarFlashes {
     [EXTERNAL_STATE_APPENDAGE]: object
     [EXTERNAL_STATE_PAYLOAD]: object
+    [COMPONENT_STATE_ERROR]: string
     [key: string]: { errors: FormSubmissionError[] }
   }
 }