@dxc-technology/halstack-react 0.0.0-9bd9511 → 0.0.0-9c20370

package/radio-group/RadioGroup.test.js

@@ -1,10 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _react = _interopRequireDefault(require("react"));
+
 var _react2 = require("@testing-library/react");
+
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
+
 var _RadioGroup = _interopRequireDefault(require("./RadioGroup.tsx"));
+
 var options = [{
   label: "Option 01",
   value: "1"
@@ -47,14 +52,15 @@ var singleDisabledOptions = [{
 describe("Radio Group component tests", function () {
   test("Initial render has correct aria attributes and tabIndex", function () {
     var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        options: options,
-        error: ""
-      })),
-      getByRole = _render.getByRole,
-      getAllByRole = _render.getAllByRole,
-      getByText = _render.getByText,
-      container = _render.container;
+      label: "test-radioGroup-label",
+      options: options,
+      error: ""
+    })),
+        getByRole = _render.getByRole,
+        getAllByRole = _render.getAllByRole,
+        getByText = _render.getByText,
+        container = _render.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var errorId = "error-".concat(getByText("test-radioGroup-label").id.replace("label-", ""));
@@ -67,7 +73,7 @@ describe("Radio Group component tests", function () {
     expect(error.getAttribute("aria-live")).toBe("off");
     radios.forEach(function (radio, index) {
       // if no option was previously selected, first option is the focusable one
-      index === 0 ? expect(radio.tabIndex).toBe(0) : expect(radio.tabIndex).toBe(-1);
+      if (index === 0) expect(radio.tabIndex).toBe(0);else expect(radio.tabIndex).toBe(-1);
       expect(radio.getAttribute("aria-checked")).toBe("false");
       expect(radio.getAttribute("aria-disabled")).toBe("false");
       expect(radio.getAttribute("aria-labelledby")).toBe(getByText("Option 0".concat(index + 1)).id);
@@ -75,11 +81,12 @@ describe("Radio Group component tests", function () {
   });
   test("aria-orientation attribute changes depending on stacking prop value", function () {
     var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        options: options,
-        stacking: "row"
-      })),
-      getByRole = _render2.getByRole;
+      label: "test-radioGroup-label",
+      options: options,
+      stacking: "row"
+    })),
+        getByRole = _render2.getByRole;
+
     var radioGroup = getByRole("radiogroup");
     expect(radioGroup.getAttribute("aria-orientation")).toBe("horizontal");
   });
@@ -92,86 +99,100 @@ describe("Radio Group component tests", function () {
         radiogroup: "5"
       });
     });
+
     var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("form", {
-        onSubmit: handlerOnSubmit
-      }, /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "radiogroup",
-        label: "test-radio-group-label",
-        options: options
-      }), /*#__PURE__*/_react["default"].createElement("button", {
-        type: "submit"
-      }, "Submit"))),
-      getByText = _render3.getByText,
-      getByRole = _render3.getByRole,
-      getAllByRole = _render3.getAllByRole;
+      onSubmit: handlerOnSubmit
+    }, /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
+      name: "radiogroup",
+      label: "test-radio-group-label",
+      options: options
+    }), /*#__PURE__*/_react["default"].createElement("button", {
+      type: "submit"
+    }, "Submit"))),
+        getByText = _render3.getByText,
+        getByRole = _render3.getByRole,
+        getAllByRole = _render3.getAllByRole;
+
     var radioGroup = getByRole("radiogroup");
     var submit = getByText("Submit");
+
     _userEvent["default"].click(radioGroup);
+
     _userEvent["default"].click(getAllByRole("radio")[4]);
+
     _userEvent["default"].click(submit);
   });
   test("Disabled state renders with correct aria attribute, correct tabIndex values and it is not focusable by keyboard", function () {
     var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        options: options,
-        disabled: true
-      })),
-      getByRole = _render4.getByRole,
-      getAllByRole = _render4.getAllByRole;
+      label: "test-radioGroup-label",
+      options: options,
+      disabled: true
+    })),
+        getByRole = _render4.getByRole,
+        getAllByRole = _render4.getAllByRole;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     expect(radioGroup.getAttribute("aria-disabled")).toBe("true");
     radios.forEach(function (radio) {
       expect(radio.tabIndex).toBe(-1);
     });
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: " ",
       code: "Space",
       keyCode: 13,
       charCode: 13
     });
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowLeft",
       code: "ArrowLeft",
       keyCode: 37,
       charCode: 37
     });
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowDown",
       code: "ArrowDown",
       keyCode: 40,
       charCode: 40
     });
+
     radios.forEach(function (radio) {
       expect(radio.tabIndex).toBe(-1);
     });
   });
   test("Disabled option renders with correct aria attribute, correct tabIndex value and it is not focusable by keyboard (focus 'jumps' the disabled option)", function () {
     var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radioGroup-label",
-        options: singleDisabledOptions
-      })),
-      getByRole = _render5.getByRole,
-      getAllByRole = _render5.getAllByRole;
+      name: "test",
+      label: "test-radioGroup-label",
+      options: singleDisabledOptions
+    })),
+        getByRole = _render5.getByRole,
+        getAllByRole = _render5.getAllByRole;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     expect(radios[2].getAttribute("aria-disabled")).toBe("true");
     expect(radios[0].tabIndex).toBe(0);
     expect(radios[1].tabIndex).toBe(-1);
     expect(radios[2].tabIndex).toBe(-1);
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowDown",
       code: "ArrowDown",
       keyCode: 40,
       charCode: 40
     });
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowDown",
       code: "ArrowDown",
       keyCode: 40,
       charCode: 40
     });
+
     expect(radios[0].tabIndex).toBe(0);
     expect(radios[1].tabIndex).toBe(-1);
     expect(radios[2].tabIndex).toBe(-1);
@@ -183,29 +204,33 @@ describe("Radio Group component tests", function () {
       var formProps = Object.fromEntries(formData);
       expect(formProps).toStrictEqual({});
     });
+
     var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("form", {
-        onSubmit: handlerOnSubmit
-      }, /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "radiogroup",
-        defaultValue: "1",
-        disabled: true,
-        label: "test-radio-group-label",
-        options: options
-      }), /*#__PURE__*/_react["default"].createElement("button", {
-        type: "submit"
-      }, "Submit"))),
-      getByText = _render6.getByText;
+      onSubmit: handlerOnSubmit
+    }, /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
+      name: "radiogroup",
+      defaultValue: "1",
+      disabled: true,
+      label: "test-radio-group-label",
+      options: options
+    }), /*#__PURE__*/_react["default"].createElement("button", {
+      type: "submit"
+    }, "Submit"))),
+        getByText = _render6.getByText;
+
     var submit = getByText("Submit");
+
     _userEvent["default"].click(submit);
   });
   test("Error state renders with correct aria attributes", function () {
     var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        options: options,
-        error: "Error message"
-      })),
-      getByRole = _render7.getByRole,
-      getByText = _render7.getByText;
+      label: "test-radioGroup-label",
+      options: options,
+      error: "Error message"
+    })),
+        getByRole = _render7.getByRole,
+        getByText = _render7.getByText;
+
     var radioGroup = getByRole("radiogroup");
     var errorMessage = getByText("Error message");
     expect(radioGroup.getAttribute("aria-errormessage")).toBe(errorMessage.id);
@@ -215,24 +240,33 @@ describe("Radio Group component tests", function () {
   test("Radio group with required constraint and 'undefined' as value, sends an error", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render8.getByRole,
-      getAllByRole = _render8.getAllByRole;
+      label: "test-radioGroup-label",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render8.getByRole,
+        getAllByRole = _render8.getAllByRole;
+
     var radioGroup = getByRole("radiogroup");
     expect(radioGroup.getAttribute("aria-required")).toBe("true");
+
     _react2.fireEvent.blur(radioGroup);
+
     expect(onBlur).toHaveBeenCalledWith({
       error: "This field is required. Please, choose an option."
     });
+
     _userEvent["default"].click(radioGroup);
+
     _userEvent["default"].click(getAllByRole("radio")[0]);
+
     expect(onChange).toHaveBeenCalledWith("1");
+
     _react2.fireEvent.blur(radioGroup);
+
     expect(onBlur).toHaveBeenCalledWith({
       value: "1"
     });
@@ -240,37 +274,45 @@ describe("Radio Group component tests", function () {
   test("Radio group with required constraint and empty string as value, sends an error", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        label: "test-radioGroup-label",
-        value: "",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render9.getByRole,
-      getAllByRole = _render9.getAllByRole;
+      label: "test-radioGroup-label",
+      value: "",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render9.getByRole,
+        getAllByRole = _render9.getAllByRole;
+
     var radioGroup = getByRole("radiogroup");
     expect(radioGroup.getAttribute("aria-required")).toBe("true");
+
     _react2.fireEvent.blur(radioGroup);
+
     expect(onBlur).toHaveBeenCalledWith({
       value: "",
       error: "This field is required. Please, choose an option."
     });
+
     _userEvent["default"].click(getAllByRole("radio")[0]);
+
     expect(onChange).toHaveBeenCalledWith("1");
   });
   test("The 'defaultValue' gives the radio group an initial value when it is uncontrolled", function () {
     var onChange = jest.fn();
+
     var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        defaultValue: "2",
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getAllByRole = _render10.getAllByRole,
-      container = _render10.container;
+      defaultValue: "2",
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getAllByRole = _render10.getAllByRole,
+        container = _render10.container;
+
     var radio = getAllByRole("radio")[1];
     var submitInput = container.querySelector("input[name=\"test\"]");
     expect(radio.tabIndex).toBe(0);
@@ -280,75 +322,91 @@ describe("Radio Group component tests", function () {
   test("Optional radio group conditions: onBlur event doesn't send an error when no radio was checked, has correct aria attributes, custom label and its value is the empty string", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur,
-        optional: true,
-        optionalItemLabel: "No selection"
-      })),
-      getByRole = _render11.getByRole,
-      getByText = _render11.getByText,
-      container = _render11.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur,
+      optional: true,
+      optionalItemLabel: "No selection"
+    })),
+        getByRole = _render11.getByRole,
+        getByText = _render11.getByText,
+        container = _render11.container;
+
     var radioGroup = getByRole("radiogroup");
     expect(radioGroup.getAttribute("aria-required")).toBe("false");
+
     _react2.fireEvent.blur(radioGroup);
+
     expect(onBlur).toHaveBeenCalledWith({});
     expect(radioGroup.getAttribute("aria-invalid")).toBe("false");
     var optionalLabel = getByText("No selection");
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _userEvent["default"].click(optionalLabel);
+
     expect(onChange).toHaveBeenCalledWith("");
     expect(submitInput.value).toBe("");
   });
   test("Controlled radio group", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        value: "2",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render12.getByRole,
-      getAllByRole = _render12.getAllByRole,
-      container = _render12.container;
+      name: "test",
+      value: "2",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render12.getByRole,
+        getAllByRole = _render12.getAllByRole,
+        container = _render12.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
     expect(submitInput.value).toBe("2");
     expect(radios[1].tabIndex).toBe(0);
     expect(radios[1].getAttribute("aria-checked")).toBe("true");
+
     _userEvent["default"].click(radios[6]);
+
     expect(onChange).toHaveBeenCalledWith("7");
+
     _react2.fireEvent.blur(radioGroup);
+
     expect(onBlur).toHaveBeenCalledWith({
       value: "2"
     });
   });
   test("Select an option by clicking on its label", function () {
     var onChange = jest.fn();
+
     var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getByText = _render13.getByText,
-      getAllByRole = _render13.getAllByRole,
-      container = _render13.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getByText = _render13.getByText,
+        getAllByRole = _render13.getAllByRole,
+        container = _render13.container;
+
     var radioLabel = getByText("Option 09");
     var checkedRadio = getAllByRole("radio")[8];
     var submitInput = container.querySelector("input[name=\"test\"]");
     expect(checkedRadio.tabIndex).toBe(-1);
+
     _userEvent["default"].click(radioLabel);
+
     expect(onChange).toHaveBeenCalledWith("9");
     expect(checkedRadio.getAttribute("aria-checked")).toBe("true");
     expect(checkedRadio.tabIndex).toBe(0);
@@ -357,19 +415,23 @@ describe("Radio Group component tests", function () {
   });
   test("Select an option by clicking on its radio input", function () {
     var onChange = jest.fn();
+
     var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getAllByRole = _render14.getAllByRole,
-      container = _render14.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getAllByRole = _render14.getAllByRole,
+        container = _render14.container;
+
     var checkedRadio = getAllByRole("radio")[6];
     var submitInput = container.querySelector("input[name=\"test\"]");
     expect(checkedRadio.tabIndex).toBe(-1);
+
     _userEvent["default"].click(checkedRadio);
+
     expect(onChange).toHaveBeenCalledWith("7");
     expect(checkedRadio.getAttribute("aria-checked")).toBe("true");
     expect(checkedRadio.tabIndex).toBe(0);
@@ -378,43 +440,51 @@ describe("Radio Group component tests", function () {
   });
   test("Select an option that is already checked does not call onChange event but gives the focus", function () {
     var onChange = jest.fn();
+
     var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        defaultValue: "2",
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getAllByRole = _render15.getAllByRole;
+      defaultValue: "2",
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getAllByRole = _render15.getAllByRole;
+
     var checkedRadio = getAllByRole("radio")[1];
     expect(checkedRadio.tabIndex).toBe(0);
     expect(checkedRadio.getAttribute("aria-checked")).toBe("true");
+
     _userEvent["default"].click(checkedRadio);
+
     expect(onChange).not.toHaveBeenCalled();
     expect(document.activeElement).toEqual(checkedRadio);
   });
   test("The 'space' key checks the current focused option if anyone is checked", function () {
     var onChange = jest.fn();
+
     var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getByRole = _render16.getByRole,
-      getAllByRole = _render16.getAllByRole,
-      container = _render16.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getByRole = _render16.getByRole,
+        getAllByRole = _render16.getAllByRole,
+        container = _render16.container;
+
     var radioGroup = getByRole("radiogroup");
     var checkedRadio = getAllByRole("radio")[0];
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: " ",
       code: "Space",
       keyCode: 32,
       charCode: 32
     });
+
     expect(onChange).toHaveBeenCalledWith("1");
     expect(checkedRadio.getAttribute("aria-checked")).toBe("true");
     expect(checkedRadio.tabIndex).toBe(0);
@@ -423,33 +493,39 @@ describe("Radio Group component tests", function () {
   test("When the radio group gains the focus by keyboard ('tab' key), it goes to the first option (if no one was previously selected), without selecting it", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render17.getByRole,
-      getAllByRole = _render17.getAllByRole,
-      container = _render17.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render17.getByRole,
+        getAllByRole = _render17.getAllByRole,
+        container = _render17.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
     var checkedRadio = getAllByRole("radio")[0];
+
     _userEvent["default"].tab();
+
     expect(onChange).not.toHaveBeenCalled();
     expect(submitInput.value).toBe("");
     expect(checkedRadio.tabIndex).toBe(0);
     expect(checkedRadio.getAttribute("aria-checked")).toBe("false");
     expect(document.activeElement).toEqual(checkedRadio);
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowRight",
       code: "ArrowRight",
       keyCode: 39,
       charCode: 39
     });
+
     expect(onBlur).not.toHaveBeenCalled();
     expect(onChange).toHaveBeenCalledTimes(1);
     expect(radios[1].getAttribute("aria-checked")).toBe("true");
@@ -460,39 +536,45 @@ describe("Radio Group component tests", function () {
   test("The 'arrowDown' and 'arrowRight' keys move the selection to the next radio. When the last radio is reached, moves the selection to the first one", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render18 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        defaultValue: "8",
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render18.getByRole,
-      getAllByRole = _render18.getAllByRole,
-      container = _render18.container;
+      defaultValue: "8",
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render18.getByRole,
+        getAllByRole = _render18.getAllByRole,
+        container = _render18.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowDown",
       code: "ArrowDown",
       keyCode: 40,
       charCode: 40
     });
+
     expect(onBlur).not.toHaveBeenCalled();
     expect(onChange).toHaveBeenCalledTimes(1);
     expect(radios[8].getAttribute("aria-checked")).toBe("true");
     expect(document.activeElement).toEqual(radios[8]);
     expect(radios[8].tabIndex).toBe(0);
     expect(submitInput.value).toBe("9");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowRight",
       code: "ArrowRight",
       keyCode: 39,
       charCode: 39
     });
+
     expect(onBlur).not.toHaveBeenCalled();
     expect(onChange).toHaveBeenCalledTimes(2);
     expect(radios[0].getAttribute("aria-checked")).toBe("true");
@@ -503,39 +585,45 @@ describe("Radio Group component tests", function () {
   test("The 'arrowUp' and 'arrowLeft' keys move the selection to the previous radio. When the first radio is reached, moves the selection to the last one", function () {
     var onChange = jest.fn();
     var onBlur = jest.fn();
+
     var _render19 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        defaultValue: "2",
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        onBlur: onBlur
-      })),
-      getByRole = _render19.getByRole,
-      getAllByRole = _render19.getAllByRole,
-      container = _render19.container;
+      defaultValue: "2",
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      onBlur: onBlur
+    })),
+        getByRole = _render19.getByRole,
+        getAllByRole = _render19.getAllByRole,
+        container = _render19.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowUp",
       code: "ArrowUp",
       keyCode: 38,
       charCode: 38
     });
+
     expect(onBlur).not.toHaveBeenCalled();
     expect(onChange).toHaveBeenCalledTimes(1);
     expect(radios[0].getAttribute("aria-checked")).toBe("true");
     expect(document.activeElement).toEqual(radios[0]);
     expect(radios[0].tabIndex).toBe(0);
     expect(submitInput.value).toBe("1");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowLeft",
       code: "ArrowLeft",
       keyCode: 37,
       charCode: 37
     });
+
     expect(onBlur).not.toHaveBeenCalled();
     expect(onChange).toHaveBeenCalledTimes(2);
     expect(radios[8].getAttribute("aria-checked")).toBe("true");
@@ -545,38 +633,46 @@ describe("Radio Group component tests", function () {
   });
   test("Keyboard focus movement continues from the last radio input clicked", function () {
     var onChange = jest.fn();
+
     var _render20 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange
-      })),
-      getByRole = _render20.getByRole,
-      getAllByRole = _render20.getAllByRole,
-      container = _render20.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange
+    })),
+        getByRole = _render20.getByRole,
+        getAllByRole = _render20.getAllByRole,
+        container = _render20.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _userEvent["default"].click(radios[3]);
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowDown",
       code: "ArrowDown",
       keyCode: 40,
       charCode: 40
     });
+
     expect(onChange).toHaveBeenCalledWith("5");
     expect(radios[4].getAttribute("aria-checked")).toBe("true");
     expect(document.activeElement).toEqual(radios[4]);
     expect(radios[4].tabIndex).toBe(0);
     expect(submitInput.value).toBe("5");
+
     _userEvent["default"].click(radios[8]);
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowLeft",
       code: "ArrowLeft",
       keyCode: 37,
       charCode: 37
     });
+
     expect(onChange).toHaveBeenCalledWith("8");
     expect(radios[7].getAttribute("aria-checked")).toBe("true");
     expect(document.activeElement).toEqual(radios[7]);
@@ -585,32 +681,38 @@ describe("Radio Group component tests", function () {
   });
   test("Readonly radio group lets the user move the focus, but neither click nor keyboard press changes the value", function () {
     var onChange = jest.fn();
+
     var _render21 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_RadioGroup["default"], {
-        name: "test",
-        label: "test-radio-group-label",
-        helperText: "test-radio-group-helper-text",
-        options: options,
-        onChange: onChange,
-        readonly: true
-      })),
-      getByRole = _render21.getByRole,
-      getAllByRole = _render21.getAllByRole,
-      container = _render21.container;
+      name: "test",
+      label: "test-radio-group-label",
+      helperText: "test-radio-group-helper-text",
+      options: options,
+      onChange: onChange,
+      readonly: true
+    })),
+        getByRole = _render21.getByRole,
+        getAllByRole = _render21.getAllByRole,
+        container = _render21.container;
+
     var radioGroup = getByRole("radiogroup");
     var radios = getAllByRole("radio");
     var submitInput = container.querySelector("input[name=\"test\"]");
+
     _userEvent["default"].click(radios[5]);
+
     expect(onChange).not.toHaveBeenCalled();
     expect(radios[5].getAttribute("aria-checked")).toBe("false");
     expect(document.activeElement).toEqual(radios[5]);
     expect(radios[5].tabIndex).toBe(0);
     expect(submitInput.value).toBe("");
+
     _react2.fireEvent.keyDown(radioGroup, {
       key: "ArrowUp",
       code: "ArrowUp",
       keyCode: 38,
       charCode: 38
     });
+
     expect(onChange).not.toHaveBeenCalled();
     expect(radios[4].getAttribute("aria-checked")).toBe("false");
     expect(document.activeElement).toEqual(radios[4]);