@defra/forms-engine-plugin 4.0.6 → 4.0.8

package/src/server/plugins/engine/components/helpers/components.test.ts

@@ -0,0 +1,270 @@
+import {
+  ComponentType,
+  type EastingNorthingFieldComponent,
+  type LatLongFieldComponent,
+  type NationalGridFieldNumberFieldComponent,
+  type OsGridRefFieldComponent
+} from '@defra/forms-model'
+
+import {
+  getAnswer,
+  getAnswerMarkdown
+} from '~/src/server/plugins/engine/components/helpers/components.js'
+import {
+  EastingNorthingField,
+  LatLongField,
+  NationalGridFieldNumberField,
+  OsGridRefField
+} from '~/src/server/plugins/engine/components/index.js'
+import { FormModel } from '~/src/server/plugins/engine/models/FormModel.js'
+import definition from '~/test/form/definitions/blank.js'
+
+describe('Location field formatting', () => {
+  let model: FormModel
+
+  beforeEach(() => {
+    model = new FormModel(definition, {
+      basePath: 'test'
+    })
+  })
+
+  describe('EastingNorthingField', () => {
+    let field: EastingNorthingField
+
+    beforeEach(() => {
+      const def: EastingNorthingFieldComponent = {
+        type: ComponentType.EastingNorthingField,
+        name: 'locationEN',
+        title: 'Location',
+        options: {}
+      }
+      field = new EastingNorthingField(def, { model })
+    })
+
+    it('formats for email output with labels on separate lines', () => {
+      const state = {
+        locationEN__easting: 123456,
+        locationEN__northing: 654321
+      }
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('Northing: 654321\nEasting: 123456\n')
+    })
+
+    it('formats for data output', () => {
+      const state = {
+        locationEN__easting: 123456,
+        locationEN__northing: 654321
+      }
+
+      const answer = getAnswer(field, state, { format: 'data' })
+      expect(answer).toBe('Northing: 654321\nEasting: 123456')
+    })
+
+    it('formats for summary display', () => {
+      const state = {
+        locationEN__easting: 123456,
+        locationEN__northing: 654321
+      }
+
+      const answer = getAnswer(field, state, { format: 'summary' })
+      // Should render as HTML from markdown
+      expect(answer).toContain('Northing: 654321')
+      expect(answer).toContain('Easting: 123456')
+    })
+
+    it('returns empty string when no values', () => {
+      const state = {}
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('')
+    })
+  })
+
+  describe('LatLongField', () => {
+    let field: LatLongField
+
+    beforeEach(() => {
+      const def: LatLongFieldComponent = {
+        type: ComponentType.LatLongField,
+        name: 'locationLL',
+        title: 'Coordinates',
+        options: {}
+      }
+      field = new LatLongField(def, { model })
+    })
+
+    it('formats for email output with labels on separate lines', () => {
+      const state = {
+        locationLL__latitude: 51.51945,
+        locationLL__longitude: -0.127758
+      }
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('Lat: 51.51945\nLong: -0.127758\n')
+    })
+
+    it('formats for data output', () => {
+      const state = {
+        locationLL__latitude: 51.51945,
+        locationLL__longitude: -0.127758
+      }
+
+      const answer = getAnswer(field, state, { format: 'data' })
+      expect(answer).toBe('Lat: 51.51945\nLong: -0.127758')
+    })
+
+    it('formats for summary display', () => {
+      const state = {
+        locationLL__latitude: 51.51945,
+        locationLL__longitude: -0.127758
+      }
+
+      const answer = getAnswer(field, state, { format: 'summary' })
+      // Should render as HTML from markdown
+      expect(answer).toContain('Lat: 51.51945')
+      expect(answer).toContain('Long: -0.127758')
+    })
+
+    it('returns empty string when no values', () => {
+      const state = {}
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('')
+    })
+  })
+
+  describe('OsGridRefField', () => {
+    let field: OsGridRefField
+
+    beforeEach(() => {
+      const def: OsGridRefFieldComponent = {
+        type: ComponentType.OsGridRefField,
+        name: 'gridRef',
+        title: 'OS Grid Reference',
+        options: {}
+      }
+      field = new OsGridRefField(def, { model })
+    })
+
+    it('formats for email output as single value', () => {
+      const state = {
+        gridRef: 'TQ123456'
+      }
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('TQ123456\n')
+    })
+
+    it('formats for data output', () => {
+      const state = {
+        gridRef: 'TQ123456'
+      }
+
+      const answer = getAnswer(field, state, { format: 'data' })
+      expect(answer).toBe('TQ123456')
+    })
+
+    it('formats for summary display', () => {
+      const state = {
+        gridRef: 'TQ123456'
+      }
+
+      const answer = getAnswer(field, state, { format: 'summary' })
+      expect(answer).toBe('TQ123456')
+    })
+  })
+
+  describe('NationalGridFieldNumberField', () => {
+    let field: NationalGridFieldNumberField
+
+    beforeEach(() => {
+      const def: NationalGridFieldNumberFieldComponent = {
+        type: ComponentType.NationalGridFieldNumberField,
+        name: 'ngField',
+        title: 'National Grid Field Number',
+        options: {}
+      }
+      field = new NationalGridFieldNumberField(def, { model })
+    })
+
+    it('formats for email output as single value', () => {
+      const state = {
+        ngField: 'NG12345678'
+      }
+
+      const answer = getAnswer(field, state, { format: 'email' })
+      expect(answer).toBe('NG12345678\n')
+    })
+
+    it('formats for data output', () => {
+      const state = {
+        ngField: 'NG12345678'
+      }
+
+      const answer = getAnswer(field, state, { format: 'data' })
+      expect(answer).toBe('NG12345678')
+    })
+
+    it('formats for summary display', () => {
+      const state = {
+        ngField: 'NG12345678'
+      }
+
+      const answer = getAnswer(field, state, { format: 'summary' })
+      expect(answer).toBe('NG12345678')
+    })
+  })
+
+  describe('getAnswerMarkdown', () => {
+    it('formats EastingNorthingField correctly', () => {
+      const def: EastingNorthingFieldComponent = {
+        type: ComponentType.EastingNorthingField,
+        name: 'locationEN',
+        title: 'Location',
+        options: {}
+      }
+      const field = new EastingNorthingField(def, { model })
+      const state = {
+        locationEN__easting: 123456,
+        locationEN__northing: 654321
+      }
+
+      const answer = getAnswerMarkdown(field, state, { format: 'email' })
+      expect(answer).toBe('Northing: 654321\nEasting: 123456\n')
+    })
+
+    it('formats LatLongField correctly', () => {
+      const def: LatLongFieldComponent = {
+        type: ComponentType.LatLongField,
+        name: 'locationLL',
+        title: 'Coordinates',
+        options: {}
+      }
+      const field = new LatLongField(def, { model })
+      const state = {
+        locationLL__latitude: 51.51945,
+        locationLL__longitude: -0.127758
+      }
+
+      const answer = getAnswerMarkdown(field, state, { format: 'email' })
+      expect(answer).toBe('Lat: 51.51945\nLong: -0.127758\n')
+    })
+
+    it('formats simple location fields correctly', () => {
+      const def: OsGridRefFieldComponent = {
+        type: ComponentType.OsGridRefField,
+        name: 'gridRef',
+        title: 'OS Grid Reference',
+        options: {}
+      }
+      const field = new OsGridRefField(def, { model })
+      const state = {
+        gridRef: 'TQ123456'
+      }
+
+      const answer = getAnswerMarkdown(field, state, { format: 'email' })
+      expect(answer).toBe('TQ123456\n')
+    })
+  })
+})

package/src/server/plugins/engine/components/helpers/components.ts

@@ -1,11 +1,11 @@
 import { ComponentType, type ComponentDef } from '@defra/forms-model'
-import { Marked, type Token } from 'marked'
 
 import { config } from '~/src/config/index.js'
 import { type ComponentBase } from '~/src/server/plugins/engine/components/ComponentBase.js'
 import { ListFormComponent } from '~/src/server/plugins/engine/components/ListFormComponent.js'
 import { escapeMarkdown } from '~/src/server/plugins/engine/components/helpers/index.js'
 import * as Components from '~/src/server/plugins/engine/components/index.js'
+import { markdown } from '~/src/server/plugins/engine/components/markdownParser.js'
 import { type FormState } from '~/src/server/plugins/engine/types.js'
 
 // All component instances
@@ -20,10 +20,15 @@ export type Field = InstanceType<
   | typeof Components.YesNoField
   | typeof Components.CheckboxesField
   | typeof Components.DatePartsField
+  | typeof Components.DeclarationField
+  | typeof Components.EastingNorthingField
   | typeof Components.EmailAddressField
+  | typeof Components.LatLongField
   | typeof Components.MonthYearField
   | typeof Components.MultilineTextField
+  | typeof Components.NationalGridFieldNumberField
   | typeof Components.NumberField
+  | typeof Components.OsGridRefField
   | typeof Components.SelectField
   | typeof Components.TelephoneNumberField
   | typeof Components.TextField
@@ -32,13 +37,12 @@ export type Field = InstanceType<
 >
 
 // Guidance component instances only
-export type Guidance = InstanceType<
-  | typeof Components.Details
-  | typeof Components.Html
-  | typeof Components.Markdown
-  | typeof Components.InsetText
-  | typeof Components.List
->
+export type Guidance =
+  | InstanceType<typeof Components.Details>
+  | InstanceType<typeof Components.Html>
+  | InstanceType<typeof Components.Markdown>
+  | InstanceType<typeof Components.InsetText>
+  | InstanceType<typeof Components.List>
 
 // List component instances only
 export type ListField = InstanceType<
@@ -51,43 +55,8 @@ export type ListField = InstanceType<
 
 export const designerUrl = config.get('designerUrl')
 
-export const markdown = new Marked({
-  breaks: true,
-  gfm: true,
-
-  /**
-   * Render paragraphs without `<p>` wrappers
-   * for check answers summary list `<dd>`
-   */
-  extensions: [
-    {
-      name: 'paragraph',
-      renderer({ tokens = [] }) {
-        const text = this.parser.parseInline(tokens)
-        return tokens.length > 1 ? `${text}<br>` : text
-      }
-    }
-  ],
-
-  /**
-   * Restrict allowed Markdown tokens
-   */
-  walkTokens(token) {
-    const tokens: Token['type'][] = [
-      'br',
-      'escape',
-      'list',
-      'list_item',
-      'paragraph',
-      'space',
-      'text'
-    ]
-
-    if (!tokens.includes(token.type)) {
-      token.type = 'text'
-    }
-  }
-})
+// Re-export markdown from its own module to avoid circular dependencies
+export { markdown } from '~/src/server/plugins/engine/components/markdownParser.js'
 
 /**
  * Filter known components with lists
@@ -95,7 +64,7 @@ export const markdown = new Marked({
 export function hasListFormField(
   field?: Partial<Component>
 ): field is ListFormComponent {
-  return !!field && isListFieldType(field.type)
+  return !!field && field.type !== undefined && isListFieldType(field.type)
 }
 
 export function isListFieldType(
@@ -134,6 +103,10 @@ export function createComponent(
       component = new Components.DatePartsField(def, options)
       break
 
+    case ComponentType.DeclarationField:
+      component = new Components.DeclarationField(def, options)
+      break
+
     case ComponentType.Details:
       component = new Components.Details(def, options)
       break
@@ -197,6 +170,22 @@ export function createComponent(
     case ComponentType.FileUploadField:
       component = new Components.FileUploadField(def, options)
       break
+
+    case ComponentType.EastingNorthingField:
+      component = new Components.EastingNorthingField(def, options)
+      break
+
+    case ComponentType.OsGridRefField:
+      component = new Components.OsGridRefField(def, options)
+      break
+
+    case ComponentType.NationalGridFieldNumberField:
+      component = new Components.NationalGridFieldNumberField(def, options)
+      break
+
+    case ComponentType.LatLongField:
+      component = new Components.LatLongField(def, options)
+      break
   }
 
   if (typeof component === 'undefined') {
@@ -234,7 +223,9 @@ export function getAnswer(
   if (
     field instanceof ListFormComponent ||
     field instanceof Components.MultilineTextField ||
-    field instanceof Components.UkAddressField
+    field instanceof Components.UkAddressField ||
+    field instanceof Components.EastingNorthingField ||
+    field instanceof Components.LatLongField
   ) {
     return markdown
       .parse(getAnswerMarkdown(field, state), { async: false })
@@ -325,6 +316,12 @@ export function getAnswerMarkdown(
       .map(escapeMarkdown)
       .join('\n')
       .concat('\n')
+  } else if (
+    field instanceof Components.EastingNorthingField ||
+    field instanceof Components.LatLongField
+  ) {
+    const contextValue = field.getContextValueFromState(state)
+    answerEscaped = contextValue ? `${contextValue}\n` : ''
   }
 
   return answerEscaped

package/src/server/plugins/engine/components/helpers/helpers.test.ts

@@ -1,6 +1,10 @@
-import { type ComponentDef } from '@defra/forms-model'
+import { ComponentType, type ComponentDef } from '@defra/forms-model'
 
 import { ComponentBase } from '~/src/server/plugins/engine/components/ComponentBase.js'
+import { EastingNorthingField } from '~/src/server/plugins/engine/components/EastingNorthingField.js'
+import { LatLongField } from '~/src/server/plugins/engine/components/LatLongField.js'
+import { NationalGridFieldNumberField } from '~/src/server/plugins/engine/components/NationalGridFieldNumberField.js'
+import { OsGridRefField } from '~/src/server/plugins/engine/components/OsGridRefField.js'
 import { createComponent } from '~/src/server/plugins/engine/components/helpers/components.js'
 import { FormModel } from '~/src/server/plugins/engine/models/FormModel.js'
 import definition from '~/test/form/definitions/basic.js'
@@ -22,6 +26,72 @@ describe('helpers tests', () => {
       )
     ).toThrow('Component type invalid-type does not exist')
   })
+
+  test('should create EastingNorthingField component', () => {
+    const component = createComponent(
+      {
+        type: ComponentType.EastingNorthingField,
+        name: 'testField',
+        title: 'Test Easting Northing',
+        options: {},
+        schema: {}
+      },
+      { model: formModel }
+    )
+
+    expect(component).toBeInstanceOf(EastingNorthingField)
+    expect(component.name).toBe('testField')
+    expect(component.title).toBe('Test Easting Northing')
+  })
+
+  test('should create LatLongField component', () => {
+    const component = createComponent(
+      {
+        type: ComponentType.LatLongField,
+        name: 'testField',
+        title: 'Test Lat Long',
+        options: {},
+        schema: {}
+      },
+      { model: formModel }
+    )
+
+    expect(component).toBeInstanceOf(LatLongField)
+    expect(component.name).toBe('testField')
+    expect(component.title).toBe('Test Lat Long')
+  })
+
+  test('should create OsGridRefField component', () => {
+    const component = createComponent(
+      {
+        type: ComponentType.OsGridRefField,
+        name: 'testField',
+        title: 'Test OS Grid Ref',
+        options: {}
+      },
+      { model: formModel }
+    )
+
+    expect(component).toBeInstanceOf(OsGridRefField)
+    expect(component.name).toBe('testField')
+    expect(component.title).toBe('Test OS Grid Ref')
+  })
+
+  test('should create NationalGridFieldNumberField component', () => {
+    const component = createComponent(
+      {
+        type: ComponentType.NationalGridFieldNumberField,
+        name: 'testField',
+        title: 'Test National Grid',
+        options: {}
+      },
+      { model: formModel }
+    )
+
+    expect(component).toBeInstanceOf(NationalGridFieldNumberField)
+    expect(component.name).toBe('testField')
+    expect(component.title).toBe('Test National Grid')
+  })
 })
 
 describe('ComponentBase tests', () => {

package/src/server/plugins/engine/components/index.ts

@@ -7,6 +7,7 @@
 export { AutocompleteField } from '~/src/server/plugins/engine/components/AutocompleteField.js'
 export { CheckboxesField } from '~/src/server/plugins/engine/components/CheckboxesField.js'
 export { DatePartsField } from '~/src/server/plugins/engine/components/DatePartsField.js'
+export { DeclarationField } from '~/src/server/plugins/engine/components/DeclarationField.js'
 export { Details } from '~/src/server/plugins/engine/components/Details.js'
 export { EmailAddressField } from '~/src/server/plugins/engine/components/EmailAddressField.js'
 export { FileUploadField } from '~/src/server/plugins/engine/components/FileUploadField.js'
@@ -23,3 +24,7 @@ export { TelephoneNumberField } from '~/src/server/plugins/engine/components/Tel
 export { TextField } from '~/src/server/plugins/engine/components/TextField.js'
 export { UkAddressField } from '~/src/server/plugins/engine/components/UkAddressField.js'
 export { YesNoField } from '~/src/server/plugins/engine/components/YesNoField.js'
+export { EastingNorthingField } from '~/src/server/plugins/engine/components/EastingNorthingField.js'
+export { OsGridRefField } from '~/src/server/plugins/engine/components/OsGridRefField.js'
+export { NationalGridFieldNumberField } from '~/src/server/plugins/engine/components/NationalGridFieldNumberField.js'
+export { LatLongField } from '~/src/server/plugins/engine/components/LatLongField.js'

package/src/server/plugins/engine/components/markdownParser.ts

@@ -0,0 +1,40 @@
+import { Marked, type Token } from 'marked'
+
+export const markdown = new Marked({
+  breaks: true,
+  gfm: true,
+
+  /**
+   * Render paragraphs without `<p>` wrappers
+   * for check answers summary list `<dd>`
+   */
+  extensions: [
+    {
+      name: 'paragraph',
+      renderer({ tokens = [] }) {
+        const text = this.parser.parseInline(tokens)
+        return tokens.length > 1 ? `${text}<br>` : text
+      }
+    }
+  ],
+
+  /**
+   * Restrict allowed Markdown tokens
+   */
+  walkTokens(token) {
+    const tokens: Token['type'][] = [
+      'br',
+      'escape',
+      'link',
+      'list',
+      'list_item',
+      'paragraph',
+      'space',
+      'text'
+    ]
+
+    if (!tokens.includes(token.type)) {
+      token.type = 'text'
+    }
+  }
+})

package/src/server/plugins/engine/components/types.ts

@@ -60,6 +60,10 @@ export interface DateInputItem {
   name?: string
   value?: Item['value']
   classes?: string
+  // Prefix/suffix are used by location fields (e.g., LatLong, EastingNorthing) for units like "°"
+  // but not by date fields. This interface is reused by both component types.
+  prefix?: ComponentText
+  suffix?: ComponentText
   condition?: undefined
 }
 
@@ -126,3 +130,13 @@ export interface MonthYearState extends Record<string, number> {
   month: number
   year: number
 }
+
+export interface EastingNorthingState extends Record<string, number> {
+  easting: number
+  northing: number
+}
+
+export interface LatLongState extends Record<string, number> {
+  latitude: number
+  longitude: number
+}

package/src/server/plugins/engine/models/SummaryViewModel.test.ts

@@ -15,6 +15,7 @@ import {
   type FormContextRequest,
   type FormState
 } from '~/src/server/plugins/engine/types.js'
+import v2Definition from '~/test/form/definitions/conditions-relative-dates-v2.js'
 import definition from '~/test/form/definitions/repeat-mixed.js'
 const basePath = `${FORM_PREFIX}/test`
 
@@ -326,7 +327,7 @@ describe('SummaryPageController', () => {
       expect(viewModel).toHaveProperty('allowSaveAndExit', true)
     })
 
-    it('should display correct page title', () => {
+    it('should display correct page title for v1 form', () => {
       const state: FormState = {
         $$__referenceNumber: 'foobar',
         orderType: 'collection',
@@ -334,9 +335,81 @@ describe('SummaryPageController', () => {
       }
 
       const context = model.getFormContext(request, state)
-      const viewModel = controller.getViewModel(request, context)
+      const viewModel = controller.getSummaryViewModel(request, context)
+
+      expect(viewModel.pageTitle).toBe(
+        'Check your answers before sending your form'
+      )
+    })
+
+    it('should display default page title for v2 form when title not supplied', () => {
+      const state: FormState = {
+        $$__referenceNumber: 'foobar',
+        orderType: 'collection',
+        pizza: []
+      }
+
+      const titleModel = new FormModel(v2Definition, {
+        basePath: `${FORM_PREFIX}/test`
+      })
+
+      controller = new SummaryPageController(titleModel, v2Definition.pages[5])
+
+      request = {
+        method: 'get',
+        url: new URL('http://example.com/repeat/pizza-order/summary'),
+        path: '/test/summary',
+        params: {
+          path: 'summary',
+          slug: 'test'
+        },
+        query: {},
+        app: { model: titleModel },
+        server: serverWithSaveAndExit
+      }
+
+      const context = titleModel.getFormContext(request, state)
+      const viewModel = controller.getSummaryViewModel(request, context)
+
+      expect(viewModel.pageTitle).toBe(
+        'Check your answers before sending your form'
+      )
+    })
+
+    it('should display override page title for v2 form when title supplied', () => {
+      const state: FormState = {
+        $$__referenceNumber: 'foobar',
+        orderType: 'collection',
+        pizza: []
+      }
+
+      const v2DefinitionWithSummaryTitle = structuredClone(v2Definition)
+      const summaryPage = v2DefinitionWithSummaryTitle.pages[5]
+      summaryPage.title = 'Override summary title'
+
+      const titleModel = new FormModel(v2DefinitionWithSummaryTitle, {
+        basePath: `${FORM_PREFIX}/test`
+      })
+
+      controller = new SummaryPageController(titleModel, summaryPage)
+
+      request = {
+        method: 'get',
+        url: new URL('http://example.com/repeat/pizza-order/summary'),
+        path: '/test/summary',
+        params: {
+          path: 'summary',
+          slug: 'test'
+        },
+        query: {},
+        app: { model: titleModel },
+        server: serverWithSaveAndExit
+      }
+
+      const context = titleModel.getFormContext(request, state)
+      const viewModel = controller.getSummaryViewModel(request, context)
 
-      expect(viewModel.pageTitle).toBe('Check your answers')
+      expect(viewModel.pageTitle).toBe('Override summary title')
     })
   })
 })