@ukhomeoffice/cop-react-form-renderer 4.28.0 → 4.29.0-beta

package/dist/components/FormRenderer/FormRenderer.test.js

@@ -36,6 +36,10 @@ var _taskList = _interopRequireDefault(require("../../json/taskList.json"));
 
 var _firstForm = _interopRequireDefault(require("../../json/firstForm.json"));
 
+var _multiQuestionTaskListData = _interopRequireDefault(require("../../json/multiQuestionTaskListData.json"));
+
+var _multiQuestionTaskList = _interopRequireDefault(require("../../json/multiQuestionTaskList.json"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -634,21 +638,21 @@ describe('components', function () {
               newPage = container.childNodes[0].childNodes[0];
               expect(newPage.childNodes[0].textContent).toEqual('Event Date');
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-day',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[1].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-month',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[2].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[2].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-year',
                   value: '2022'
@@ -663,7 +667,7 @@ describe('components', function () {
               newPage = container.childNodes[0].childNodes[0];
               expect(newPage.childNodes[0].textContent).toEqual('Event Mode');
 
-              _react.fireEvent.click(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[0], {});
+              _react.fireEvent.click(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0], {});
 
               continueButton = newPage.childNodes[2].childNodes[0];
 
@@ -678,7 +682,7 @@ describe('components', function () {
               changePage = container.childNodes[0].childNodes[0];
               expect(changePage.childNodes[0].textContent).toEqual('Event Mode'); // Click on radio for 'Air'
 
-              _react.fireEvent.click(changePage.childNodes[1].childNodes[2].childNodes[1].childNodes[0], {}); // Continue again to CYA page
+              _react.fireEvent.click(changePage.childNodes[1].childNodes[0].childNodes[2].childNodes[1].childNodes[0], {}); // Continue again to CYA page
 
 
               continueButton = changePage.childNodes[2].childNodes[0];
@@ -752,21 +756,21 @@ describe('components', function () {
 
               newPage = container.childNodes[0].childNodes[0];
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-day',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[1].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-month',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[2].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[2].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-year',
                   value: '2022'
@@ -778,7 +782,7 @@ describe('components', function () {
 
               newPage = container.childNodes[0].childNodes[0];
 
-              _react.fireEvent.click(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[0], {});
+              _react.fireEvent.click(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0], {});
 
               _react.fireEvent.click(newPage.childNodes[2].childNodes[0], {}); //Continue on from CYA page
 
@@ -843,21 +847,21 @@ describe('components', function () {
 
               newPage = container.childNodes[0].childNodes[0];
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-day',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[1].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-month',
                   value: '7'
                 }
               });
 
-              _react.fireEvent.change(newPage.childNodes[1].childNodes[2].childNodes[2].childNodes[1], {
+              _react.fireEvent.change(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[2].childNodes[0].childNodes[1], {
                 target: {
                   name: 'date-year',
                   value: '2022'
@@ -869,7 +873,7 @@ describe('components', function () {
 
               newPage = container.childNodes[0].childNodes[0];
 
-              _react.fireEvent.click(newPage.childNodes[1].childNodes[2].childNodes[0].childNodes[0], {});
+              _react.fireEvent.click(newPage.childNodes[1].childNodes[0].childNodes[2].childNodes[0].childNodes[0], {});
 
               _react.fireEvent.click(newPage.childNodes[2].childNodes[0], {}); // Launch same task again
 
@@ -1002,5 +1006,59 @@ describe('components', function () {
         }
       }, _callee28);
     })));
+    it('should display CYSA page when resuming an in-progress form, with Action buttons replaced with a single Continue button', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee30() {
+      var ON_SUBMIT, HOOKS, taskList;
+      return regeneratorRuntime.wrap(function _callee30$(_context30) {
+        while (1) {
+          switch (_context30.prev = _context30.next) {
+            case 0:
+              ON_SUBMIT = function ON_SUBMIT(type, payload, onSuccess, onError) {
+                onSuccess();
+              };
+
+              HOOKS = {
+                onSubmit: ON_SUBMIT
+              };
+              _context30.next = 4;
+              return (0, _testUtils.act)( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee29() {
+                return regeneratorRuntime.wrap(function _callee29$(_context29) {
+                  while (1) {
+                    switch (_context29.prev = _context29.next) {
+                      case 0:
+                        (0, _reactDom.render)( /*#__PURE__*/_react2.default.createElement(_FormRenderer.default, _extends({}, _multiQuestionTaskList.default, {
+                          data: _multiQuestionTaskListData.default,
+                          hooks: HOOKS
+                        })), container);
+
+                      case 1:
+                      case "end":
+                        return _context29.stop();
+                    }
+                  }
+                }, _callee29);
+              })));
+
+            case 4:
+              taskList = container.childNodes[0].childNodes[1]; //Resume the first task
+
+              _react.fireEvent.click(taskList.childNodes[5].childNodes[1].childNodes[0].childNodes[0], {}); // Verify the correct title has been rendered, and the Action buttons have been changed to Continue Only
+
+
+              expect(container.childNodes[0].childNodes[0].childNodes[0].textContent).toEqual('Check your saved answers');
+              expect(container.childNodes[0].childNodes[0].childNodes[5].childNodes[0].childNodes[0].textContent).toEqual('Continue'); // Click Continue
+
+              _react.fireEvent.click(container.childNodes[0].childNodes[0].childNodes[5].childNodes[0].childNodes[0], {}); // Verify that Save & Continue / Save and Return Later buttons are restored on the next screen
+
+
+              expect(container.childNodes[0].childNodes[0].childNodes[6].childNodes[0].textContent).toEqual('Save and continue');
+              expect(container.childNodes[0].childNodes[0].childNodes[6].childNodes[1].textContent).toEqual('Save and return later');
+
+            case 11:
+            case "end":
+              return _context30.stop();
+          }
+        }
+      }, _callee30);
+    })));
   });
 });

package/dist/components/FormRenderer/handlers/navigate.js

@@ -16,11 +16,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * @param {string} currentPageId The current pageId.
  * @param {Function} onNavigate The handler to call if the pageId is different to the currentPageId.
  */
-var navigate = function navigate(action, currentPageId, onNavigate) {
+var navigate = function navigate(action, currentPageId, onNavigate, state) {
   var pageId = (0, _getPageId.default)(action, currentPageId);
 
   if (pageId !== currentPageId) {
-    onNavigate(pageId);
+    onNavigate(pageId, state);
   }
 };
 

package/dist/json/multiQuestionTaskList.json

@@ -0,0 +1,275 @@
+{
+  "id": "cop-multiTaskList",
+  "cya": {
+    "actions": [
+      { "type": "saveAndContinue", "label": "save cont", "validate": true }
+    ],
+    "hide_page_titles": false
+  },
+  "hub": {
+    "format": "CYA",
+    "refTitle": "COP reference number",
+    "sections": [
+      {
+        "name": "Add passenger details",
+        "tasks": [
+          {
+            "name": "Passenger 1",
+            "pages": ["officer", "p1Name", "p1details"],
+            "state": "complete"
+          },
+          {
+            "name": "Passenger 2",
+            "pages": ["relationship", "p2Name", "p2details"],
+            "state": "inProgress"
+          }
+        ]
+      },
+      {
+        "name": "Submit form",
+        "tasks": [
+          {
+            "name": "Accept and submit",
+            "pages": ["submitForm"],
+            "state": "inProgress"
+          }
+        ]
+      }
+    ]
+  },
+  "name": "cop-multiTaskList",
+  "type": "task-list",
+  "pages": [
+    {
+      "id": "officer",
+      "name": "officer",
+      "title": "Officer Details",
+      "actions": [
+        { "page": "p1Name", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": { "page": "officer", "aria_suffix": "Officer Details" },
+      "components": [{ "use": "officerName" }]
+    },
+    {
+      "id": "p1Name",
+      "name": "p1Name",
+      "title": "Passenger 1 Names",
+      "actions": [
+        { "page": "p1details", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": { "page": "p1Name", "aria_suffix": "Passenger 1 name" },
+      "components": [
+        { "use": "passenger1firstname" },
+        { "use": "passenger1surname" }
+      ]
+    },
+    {
+      "id": "p1details",
+      "name": "p1details",
+      "title": "Passenger 1 Details",
+      "actions": [
+        { "page": "cya", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": { "page": "p1details", "aria_suffix": "Passenger 1 Details" },
+      "components": [
+        { "use": "dateofarrivalp1" },
+        { "use": "dateofdeparturep1" },
+        { "use": "doesp1havevisa" },
+        { "use": "p1flightNo" },
+        { "use": "p1extraDetails" }
+      ]
+    },
+    {
+      "id": "relationship",
+      "name": "relationship",
+      "title": "Passenger relationship",
+      "actions": [
+        { "page": "p2Name", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": {
+        "page": "relationship",
+        "aria_suffix": "Passenger Relationship"
+      },
+      "components": [{ "use": "p2relationship" }]
+    },
+    {
+      "id": "p2Name",
+      "name": "p2Name",
+      "title": "Passenger 2 Names",
+      "actions": [
+        { "page": "p2details", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": { "page": "p2Name", "aria_suffix": "Passenger 2 name" },
+      "components": [
+        { "use": "passenger2firstname" },
+        { "use": "passenger2surname" }
+      ]
+    },
+    {
+      "id": "p2details",
+      "name": "p2details",
+      "title": "Passenger 2 Details",
+      "actions": [
+        { "page": "cya", "type": "saveAndNavigate" },
+        "saveAndReturn"
+      ],
+      "cya_link": { "page": "p2details", "aria_suffix": "Passenger 2 Details" },
+      "components": [
+        { "use": "dateofarrivalp2" },
+        { "use": "dateofdeparturep2" },
+        { "use": "doesp2havevisa" },
+        { "use": "p2flightNo" },
+        { "use": "p2extraDetails" }
+      ]
+    },
+    {
+      "id": "submitForm",
+      "name": "submitForm",
+      "title": "Submit",
+      "actions": [
+        { "type": "submit", "label": "Submit", "validate": true },
+        "saveAndReturn"
+      ],
+      "components": []
+    }
+  ],
+  "title": "Task List Multi Question Form",
+  "version": "1",
+  "components": [
+    {
+      "id": "officerName",
+      "type": "text",
+      "label": "Officer name",
+      "fieldId": "officerName",
+      "required": true
+    },
+    {
+      "id": "passenger1firstname",
+      "type": "text",
+      "label": "Passenger 1 first name",
+      "fieldId": "passenger1firstname",
+      "required": true
+    },
+    {
+      "id": "passenger1surname",
+      "type": "text",
+      "label": "Passenger 1 last name",
+      "fieldId": "passenger1surname",
+      "required": true
+    },
+    {
+      "id": "dateofarrivalp1",
+      "type": "date",
+      "label": "Date of Arrival for passenger 1",
+      "fieldId": "dateofarrivalp1",
+      "required": true
+    },
+    {
+      "id": "dateofdeparturep1",
+      "type": "date",
+      "label": "Date of Departure for passenger 1",
+      "fieldId": "dateofdeparturep1",
+      "required": true
+    },
+    {
+      "id": "doesp1havevisa",
+      "data": {
+        "options": [
+          { "label": "Yes, passenger 1 has a valid visa", "value": "yes" },
+          {
+            "label": "No, passenger 1 does not have a valid visa",
+            "value": "no"
+          }
+        ]
+      },
+      "type": "radios",
+      "label": "Valid visa",
+      "fieldId": "doesp1havevisa",
+      "required": true
+    },
+    {
+      "id": "p1flightNo",
+      "type": "text",
+      "label": "Passenger 1 outbound flight number",
+      "fieldId": "p1flightNo",
+      "required": true
+    },
+    {
+      "id": "p2relationship",
+      "type": "text",
+      "label": "What is the relationship of passenger 2 to passenger 1",
+      "fieldId": "p2relationship",
+      "required": true
+    },
+    {
+      "id": "p1extraDetails",
+      "type": "textarea",
+      "label": "Enter any extra details about journey for passenger 1",
+      "fieldId": "p1extraDetails",
+      "required": true
+    },
+    {
+      "id": "passenger2firstname",
+      "type": "text",
+      "label": "Passenger 2 first name",
+      "fieldId": "passenger2firstname",
+      "required": true
+    },
+    {
+      "id": "passenger2surname",
+      "type": "text",
+      "label": "Passenger 2 last name",
+      "fieldId": "passenger2surname",
+      "required": true
+    },
+    {
+      "id": "dateofarrivalp2",
+      "type": "date",
+      "label": "Date of Arrival for passenger 2",
+      "fieldId": "dateofarrivalp2",
+      "required": true
+    },
+    {
+      "id": "dateofdeparturep2",
+      "type": "date",
+      "label": "Date of Departure for passenger 2",
+      "fieldId": "dateofdeparturep2",
+      "required": true
+    },
+    {
+      "id": "doesp2havevisa",
+      "data": {
+        "options": [
+          { "label": "Yes, passenger 2 has a valid visa", "value": "yes" },
+          {
+            "label": "No, passenger 2 does not have a valid visa",
+            "value": "no"
+          }
+        ]
+      },
+      "type": "radios",
+      "label": "Valid visa",
+      "fieldId": "doesp2havevisa",
+      "required": true
+    },
+    {
+      "id": "p2flightNo",
+      "type": "text",
+      "label": "Passenger 2 outbound flight number",
+      "fieldId": "p2flightNo",
+      "required": true
+    },
+    {
+      "id": "p2extraDetails",
+      "type": "textarea",
+      "label": "Enter any extra details about journey for passenger 2",
+      "fieldId": "p2extraDetails",
+      "required": true
+    }
+  ]
+}

package/dist/json/multiQuestionTaskListData.json

@@ -0,0 +1,39 @@
+{
+  "id": "695735b6-7187-11ed-a74f-4a1f833894ff",
+  "businessKey": "DEV-20221201-1250",
+  "officerName": "Bob Smith",
+  "formStatus": {
+    "tasks": {
+      "Passenger 1": { "complete": false, "currentPage": "p1details" }
+    },
+    "taskPage": "p1details"
+  },
+  "links": [
+    {
+      "method": "GET",
+      "href": "https://workflow-service-green.dev.cop.homeoffice.gov.uk/camunda/engine-rest/process-instance/695735b6-7187-11ed-a74f-4a1f833894ff",
+      "rel": "self"
+    }
+  ],
+  "definitionId": "cop-multiTaskList:2:04acd47e-6a95-11ed-89dc-8e447b30f638",
+  "caseInstanceId": null,
+  "ended": false,
+  "suspended": false,
+  "tenantId": null,
+  "passenger1firstname": "James",
+  "passenger1surname": "Jones",
+  "dateofarrivalp1": "1-1-2022",
+  "dateofdeparturep1": "3-2-2022",
+  "doesp1havevisa": "yes",
+  "p1flightNo": "564131946",
+  "p1extraDetails": "N/A",
+  "form": {
+    "formId": "cop-multiTaskList",
+    "formVersionId": "1",
+    "title": "Task List Multi Question Form",
+    "name": "cop-multiTaskList",
+    "submissionDate": "2022-12-01T14:50:58.363Z",
+    "submittedBy": "james.bowers@digital.homeoffice.gov.uk",
+    "draftForm": true
+  }
+}

package/dist/models/PageAction.js

@@ -14,6 +14,7 @@ var TYPE_COLLECTION_ADD = 'collectionAdd';
 var TYPE_COLLECTION_DUPLICATE = 'collectionDuplicate';
 var TYPE_COLLECTION_REMOVE = 'collectionRemove';
 var TYPE_NAVIGATE = 'navigate';
+var TYPE_CONTINUE = 'continue';
 var TYPE_SAVE_AND_CONTINUE = 'saveAndContinue';
 var TYPE_SAVE_AND_NAVIGATE = 'saveAndNavigate';
 var TYPE_SAVE_AND_RETURN = 'saveAndReturn';
@@ -24,6 +25,7 @@ var PageActionTypes = {
   COLLECTION_DUPLICATE: TYPE_COLLECTION_DUPLICATE,
   COLLECTION_REMOVE: TYPE_COLLECTION_REMOVE,
   NAVIGATE: TYPE_NAVIGATE,
+  CONTINUE: TYPE_CONTINUE,
   SAVE_AND_CONTINUE: TYPE_SAVE_AND_CONTINUE,
   SAVE_AND_NAVIGATE: TYPE_SAVE_AND_NAVIGATE,
   SAVE_AND_RETURN: TYPE_SAVE_AND_RETURN,
@@ -35,7 +37,11 @@ var DefaultPageActions = (_DefaultPageActions = {}, _defineProperty(_DefaultPage
   validate: false,
   label: 'Cancel',
   classModifiers: 'secondary'
-}), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_ADD, undefined), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_DUPLICATE, undefined), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_REMOVE, undefined), _defineProperty(_DefaultPageActions, TYPE_NAVIGATE, undefined), _defineProperty(_DefaultPageActions, TYPE_SAVE_AND_CONTINUE, {
+}), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_ADD, undefined), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_DUPLICATE, undefined), _defineProperty(_DefaultPageActions, TYPE_COLLECTION_REMOVE, undefined), _defineProperty(_DefaultPageActions, TYPE_NAVIGATE, undefined), _defineProperty(_DefaultPageActions, TYPE_CONTINUE, {
+  type: TYPE_CONTINUE,
+  validate: true,
+  label: 'Continue'
+}), _defineProperty(_DefaultPageActions, TYPE_SAVE_AND_CONTINUE, {
   type: TYPE_SAVE_AND_CONTINUE,
   validate: true,
   label: 'Save and continue'

package/dist/utils/Component/getComponentTests/getComponent.autocomplete.test.js

@@ -37,11 +37,12 @@ describe('utils.Component.get', function () {
     var autocompleteWrapper = undefined;
     var autocomplete = undefined;
     var autocompleteInput = undefined;
-    formGroup.childNodes.forEach(function (node) {
+    var fieldSet = formGroup.childNodes[0];
+    fieldSet.childNodes.forEach(function (node) {
       // Check if it's an element.
       if (node instanceof Element) {
-        if (node.tagName === 'LABEL') {
-          label = node;
+        if (node.tagName === 'LEGEND') {
+          label = node.childNodes[0];
         } else if (node.classList.contains('hods-autocomplete__outer-wrapper')) {
           autocompleteWrapper = node;
           var autocompleteInner = node.childNodes[0];

package/dist/utils/Component/getComponentTests/getComponent.calculation.test.js

@@ -154,7 +154,7 @@ describe('utils.Component.get', function () {
               _getAllByTestId = (0, _react.getAllByTestId)(container, ID), _getAllByTestId2 = _slicedToArray(_getAllByTestId, 2), formGroup = _getAllByTestId2[0], input = _getAllByTestId2[1];
               expect(formGroup.tagName).toEqual('DIV');
               expect(formGroup.classList).toContain('govuk-form-group');
-              label = formGroup.childNodes[0];
+              label = formGroup.childNodes[0].childNodes[0].childNodes[0];
               expect(label.tagName).toEqual('LABEL');
               expect(label.classList).toContain('govuk-label');
               expect(label.textContent).toContain(LABEL);
@@ -268,7 +268,7 @@ describe('utils.Component.get', function () {
 
       expect(formGroup.tagName).toEqual('DIV');
       expect(formGroup.classList).toContain('govuk-form-group');
-      var label = formGroup.childNodes[0];
+      var label = formGroup.childNodes[0].childNodes[0].childNodes[0];
       expect(label.tagName).toEqual('LABEL');
       expect(label.classList).toContain('govuk-label');
       expect(label.textContent).toContain(LABEL);

package/dist/utils/Component/getComponentTests/getComponent.checkboxes.test.js

@@ -60,12 +60,13 @@ describe('utils.Component.get', function () {
 
     expect(formGroup.tagName).toEqual('DIV');
     expect(formGroup.classList).toContain('govuk-form-group');
+    var fieldSet = formGroup.childNodes[0];
     var label = undefined;
-    formGroup.childNodes.forEach(function (node) {
+    fieldSet.childNodes.forEach(function (node) {
       // Check if it's an element.
       if (node instanceof Element) {
-        if (node.tagName === 'LABEL') {
-          label = node;
+        if (node.tagName === 'LEGEND') {
+          label = node.childNodes[0];
         }
       }
     });

package/dist/utils/Component/getComponentTests/getComponent.date.test.js

@@ -50,7 +50,7 @@ describe('utils.Component.get', function () {
 
     expect(formGroup.tagName).toEqual('DIV');
     expect(formGroup.classList).toContain('govuk-form-group');
-    var label = formGroup.childNodes[0];
+    var label = formGroup.childNodes[0].childNodes[0].childNodes[0];
     expect(label.innerHTML).toContain(LABEL);
     expect(label.getAttribute('for')).toEqual(ID);
     expect(dateinput.tagName).toEqual('DIV');
@@ -59,31 +59,31 @@ describe('utils.Component.get', function () {
     var dayitem = dateinput.childNodes[0];
     expect(dayitem.tagName).toEqual('DIV');
     expect(dayitem.classList).toContain('govuk-date-input__item');
-    var daylabel = dayitem.childNodes[0];
+    var daylabel = dayitem.childNodes[0].childNodes[0].childNodes[0];
     expect(daylabel.tagName).toEqual('LABEL');
     expect(daylabel.classList).toContain('govuk-label');
     expect(daylabel.textContent).toEqual('Day');
-    var dayinput = dayitem.childNodes[1];
+    var dayinput = dayitem.childNodes[0].childNodes[1];
     expect(dayinput.tagName).toEqual('INPUT');
     expect(dayinput.id).toEqual("".concat(ID, "-day"));
     var monthitem = dateinput.childNodes[1];
     expect(monthitem.tagName).toEqual('DIV');
     expect(monthitem.classList).toContain('govuk-date-input__item');
-    var monthlabel = monthitem.childNodes[0];
+    var monthlabel = monthitem.childNodes[0].childNodes[0].childNodes[0];
     expect(monthlabel.tagName).toEqual('LABEL');
     expect(monthlabel.classList).toContain('govuk-label');
     expect(monthlabel.textContent).toEqual('Month');
-    var monthinput = monthitem.childNodes[1];
+    var monthinput = monthitem.childNodes[0].childNodes[1];
     expect(monthinput.tagName).toEqual('INPUT');
     expect(monthinput.id).toEqual("".concat(ID, "-month"));
     var yearitem = dateinput.childNodes[2];
     expect(yearitem.tagName).toEqual('DIV');
     expect(yearitem.classList).toContain('govuk-date-input__item');
-    var yearlabel = yearitem.childNodes[0];
+    var yearlabel = yearitem.childNodes[0].childNodes[0].childNodes[0];
     expect(yearlabel.tagName).toEqual('LABEL');
     expect(yearlabel.classList).toContain('govuk-label');
     expect(yearlabel.textContent).toEqual('Year');
-    var yearinput = yearitem.childNodes[1];
+    var yearinput = yearitem.childNodes[0].childNodes[1];
     expect(yearinput.tagName).toEqual('INPUT');
     expect(yearinput.id).toEqual("".concat(ID, "-year")); // Add something to the day and make sure it fires.
 

package/dist/utils/Component/getComponentTests/getComponent.email.test.js

@@ -51,10 +51,10 @@ describe('utils.Component.get', function () {
     expect(formGroup.tagName).toEqual('DIV');
     expect(formGroup.classList).toContain('govuk-form-group');
     var label = undefined;
-    formGroup.childNodes.forEach(function (node) {
+    formGroup.childNodes[0].childNodes.forEach(function (node) {
       // Check if it's an element.
-      if (node instanceof Element && node.tagName === 'LABEL') {
-        label = node;
+      if (node instanceof Element && node.tagName === 'LEGEND') {
+        label = node.childNodes[0];
       }
     });
     expect(label).toBeDefined();

package/dist/utils/Component/getComponentTests/getComponent.file.test.js

@@ -53,10 +53,10 @@ describe('utils.Component.get', function () {
     expect(formGroup.tagName).toEqual('DIV');
     expect(formGroup.classList).toContain('govuk-form-group');
     var label = undefined;
-    formGroup.childNodes.forEach(function (node) {
+    formGroup.childNodes[0].childNodes.forEach(function (node) {
       // Check if it's an element.
-      if (node instanceof Element && node.tagName === 'LABEL') {
-        label = node;
+      if (node instanceof Element && node.tagName === 'LEGEND') {
+        label = node.childNodes[0];
       }
     });
     expect(label).toBeDefined();