@dxc-technology/halstack-react 12.2.0 → 13.1.0

package/number-input/NumberInput.test.js

@@ -1,988 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@testing-library/react");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-var _NumberInput = _interopRequireDefault(require("./NumberInput"));
-// Mocking DOMRect for Radix Primitive Popover
-global.globalThis = global;
-global.DOMRect = {
-  fromRect: function fromRect() {
-    return {
-      top: 0,
-      left: 0,
-      bottom: 0,
-      right: 0,
-      width: 0,
-      height: 0
-    };
-  }
-};
-global.ResizeObserver = /*#__PURE__*/function () {
-  function ResizeObserver() {
-    (0, _classCallCheck2["default"])(this, ResizeObserver);
-  }
-  return (0, _createClass2["default"])(ResizeObserver, [{
-    key: "observe",
-    value: function observe() {}
-  }, {
-    key: "unobserve",
-    value: function unobserve() {}
-  }, {
-    key: "disconnect",
-    value: function disconnect() {}
-  }]);
-}();
-describe("Number input component tests", function () {
-  test("Number input renders with label, helper text, placeholder and increment/decrement action buttons", function () {
-    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        helperText: "Helper text",
-        placeholder: "Placeholder"
-      })),
-      getByLabelText = _render.getByLabelText,
-      getByText = _render.getByText,
-      queryAllByRole = _render.queryAllByRole;
-    var number = getByLabelText("Number input label");
-    expect(getByText("Number input label")).toBeTruthy();
-    expect(getByText("Helper text")).toBeTruthy();
-    expect(number.getAttribute("placeholder")).toBe("Placeholder");
-    expect(queryAllByRole("button").length).toBe(2);
-  });
-  test("Number input buttons' tooltip is correct", function () {
-    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number label"
-      })),
-      getByTitle = _render2.getByTitle;
-    expect(getByTitle("Decrement value")).toBeTruthy();
-    expect(getByTitle("Increment value")).toBeTruthy();
-  });
-  test("Number input is disabled", function () {
-    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number label",
-        disabled: true
-      })),
-      getByLabelText = _render3.getByLabelText;
-    var number = getByLabelText("Number label");
-    expect(number.disabled).toBeTruthy();
-  });
-  test("Number input is read only and cannot be incremented or decremented using the actions", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
-    var _render4, getByLabelText, getAllByRole, number, decrement, increment;
-    return _regenerator["default"].wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number label",
-            readOnly: true
-          })), getByLabelText = _render4.getByLabelText, getAllByRole = _render4.getAllByRole;
-          number = getByLabelText("Number label");
-          expect(number.readOnly).toBeTruthy();
-          decrement = getAllByRole("button")[0];
-          _context.next = 6;
-          return _userEvent["default"].click(decrement);
-        case 6:
-          expect(number.value).toBe("");
-          increment = getAllByRole("button")[1];
-          _context.next = 10;
-          return _userEvent["default"].click(increment);
-        case 10:
-          expect(number.value).toBe("");
-        case 11:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee);
-  })));
-  test("Number input is read only and cannot be incremented or decremented using the arrow keys", function () {
-    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number label",
-        readOnly: true
-      })),
-      getByLabelText = _render5.getByLabelText;
-    var number = getByLabelText("Number label");
-    expect(number.readOnly).toBeTruthy();
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("");
-  });
-  test("Number input is optional", function () {
-    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number label",
-        optional: true
-      })),
-      getByText = _render6.getByText;
-    expect(getByText("(Optional)")).toBeTruthy();
-  });
-  test("Number input is not optional: required field, displays error if not filled in", function () {
-    var onBlur = jest.fn();
-    var onChange = jest.fn();
-    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        onBlur: onBlur,
-        onChange: onChange
-      })),
-      getByLabelText = _render7.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "1");
-    _userEvent["default"].clear(number);
-    _react2.fireEvent.blur(number);
-    expect(onBlur).toHaveBeenCalled();
-    expect(onBlur).toHaveBeenCalledWith({
-      value: "",
-      error: "This field is required. Please, enter a value."
-    });
-    expect(onChange).toHaveBeenCalled();
-    expect(onChange).toHaveBeenCalledWith({
-      value: "",
-      error: "This field is required. Please, enter a value."
-    });
-  });
-  test("Suffix and prefix must be shown", function () {
-    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        prefix: "+34",
-        suffix: "USD"
-      })),
-      getByText = _render8.getByText;
-    expect(getByText("+34")).toBeTruthy();
-    expect(getByText("USD")).toBeTruthy();
-  });
-  test("Invalid number input renders error", function () {
-    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        error: "Error message."
-      })),
-      getByText = _render9.getByText;
-    expect(getByText("Error message.")).toBeTruthy();
-  });
-  test("onChange function is called correctly", function () {
-    var onChange = jest.fn();
-    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        onChange: onChange
-      })),
-      getByLabelText = _render10.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "t");
-    expect(onChange).not.toHaveBeenCalledWith({
-      value: "t"
-    });
-    expect(number.value).toBe("");
-    _userEvent["default"].type(number, "1");
-    expect(onChange).toHaveBeenCalledWith({
-      value: "1"
-    });
-    expect(number.value).toBe("1");
-  });
-  test("Error message is shown if the typed value is less than the min value", function () {
-    var onChange = jest.fn(function (_ref2) {
-      var value = _ref2.value,
-        error = _ref2.error;
-      expect(value).toBe("-1");
-      expect(error).toBe("Value must be greater than or equal to 0.");
-    });
-    var onBlur = jest.fn(function (_ref3) {
-      var value = _ref3.value,
-        error = _ref3.error;
-      expect(value).toBe("-1");
-      expect(error).toBe("Value must be greater than or equal to 0.");
-    });
-    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        min: 0,
-        onBlur: onBlur,
-        onChange: onChange
-      })),
-      getByLabelText = _render11.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "-1");
-    _react2.fireEvent.blur(number);
-  });
-  test("Cannot decrement the value if it is less than the min value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-    var _render12, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee2$(_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
-        case 0:
-          _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 5
-          })), getByLabelText = _render12.getByLabelText, getAllByRole = _render12.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "1");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("1");
-          decrement = getAllByRole("button")[0];
-          _context2.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("1");
-        case 9:
-        case "end":
-          return _context2.stop();
-      }
-    }, _callee2);
-  })));
-  test("Increment the value when it is less than the min value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
-    var _render13, getByLabelText, getAllByRole, number, increment;
-    return _regenerator["default"].wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
-        case 0:
-          _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 5
-          })), getByLabelText = _render13.getByLabelText, getAllByRole = _render13.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "1");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("1");
-          increment = getAllByRole("button")[1];
-          _context3.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("5");
-        case 9:
-        case "end":
-          return _context3.stop();
-      }
-    }, _callee3);
-  })));
-  test("Error message is shown if the typed value is greater than the max value", function () {
-    var onChange = jest.fn();
-    var onBlur = jest.fn();
-    var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        max: 10,
-        onBlur: onBlur,
-        onChange: onChange
-      })),
-      getByLabelText = _render14.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "12");
-    expect(onChange).toHaveBeenCalledTimes(2);
-    expect(onChange).toHaveBeenCalledWith({
-      value: "12",
-      error: "Value must be less than or equal to 10."
-    });
-    _react2.fireEvent.blur(number);
-    expect(onBlur).toHaveBeenCalled();
-    expect(onBlur).toHaveBeenCalledWith({
-      value: "12",
-      error: "Value must be less than or equal to 10."
-    });
-  });
-  test("Cannot increment the value if it is greater than the max value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4() {
-    var _render15, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee4$(_context4) {
-      while (1) switch (_context4.prev = _context4.next) {
-        case 0:
-          _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            max: 10
-          })), getByLabelText = _render15.getByLabelText, getAllByRole = _render15.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "12");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("12");
-          decrement = getAllByRole("button")[1];
-          _context4.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("12");
-        case 9:
-        case "end":
-          return _context4.stop();
-      }
-    }, _callee4);
-  })));
-  test("Decrement the value when it is greater than the max value", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
-    var _render16, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee5$(_context5) {
-      while (1) switch (_context5.prev = _context5.next) {
-        case 0:
-          _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            max: 10
-          })), getByLabelText = _render16.getByLabelText, getAllByRole = _render16.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "120");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("120");
-          decrement = getAllByRole("button")[0];
-          _context5.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("10");
-        case 9:
-        case "end":
-          return _context5.stop();
-      }
-    }, _callee5);
-  })));
-  test("Increment and decrement the value with min and max values", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
-    var _render17, getByLabelText, getAllByRole, number, decrement, increment;
-    return _regenerator["default"].wrap(function _callee6$(_context6) {
-      while (1) switch (_context6.prev = _context6.next) {
-        case 0:
-          _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 5,
-            max: 10
-          })), getByLabelText = _render17.getByLabelText, getAllByRole = _render17.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "1");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("1");
-          decrement = getAllByRole("button")[0];
-          _context6.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("1");
-          increment = getAllByRole("button")[1];
-          _context6.next = 12;
-          return _userEvent["default"].click(increment);
-        case 12:
-          expect(number.value).toBe("5");
-          _context6.next = 15;
-          return _userEvent["default"].click(increment);
-        case 15:
-          _context6.next = 17;
-          return _userEvent["default"].click(increment);
-        case 17:
-          _context6.next = 19;
-          return _userEvent["default"].click(increment);
-        case 19:
-          _context6.next = 21;
-          return _userEvent["default"].click(increment);
-        case 21:
-          _context6.next = 23;
-          return _userEvent["default"].click(increment);
-        case 23:
-          expect(number.value).toBe("10");
-          _context6.next = 26;
-          return _userEvent["default"].click(increment);
-        case 26:
-          expect(number.value).toBe("10");
-        case 27:
-        case "end":
-          return _context6.stop();
-      }
-    }, _callee6);
-  })));
-  test("Increment and decrement the value with an integer step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
-    var _render18, getByLabelText, getAllByRole, number, increment, decrement;
-    return _regenerator["default"].wrap(function _callee7$(_context7) {
-      while (1) switch (_context7.prev = _context7.next) {
-        case 0:
-          _render18 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            step: 5
-          })), getByLabelText = _render18.getByLabelText, getAllByRole = _render18.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "10");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("10");
-          increment = getAllByRole("button")[1];
-          _context7.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("15");
-          _context7.next = 11;
-          return _userEvent["default"].click(increment);
-        case 11:
-          expect(number.value).toBe("20");
-          decrement = getAllByRole("button")[0];
-          _context7.next = 15;
-          return _userEvent["default"].click(decrement);
-        case 15:
-          expect(number.value).toBe("15");
-          _context7.next = 18;
-          return _userEvent["default"].click(decrement);
-        case 18:
-          expect(number.value).toBe("10");
-        case 19:
-        case "end":
-          return _context7.stop();
-      }
-    }, _callee7);
-  })));
-  test("Increment and decrement the value with a decimal step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
-    var _render19, getByLabelText, getAllByRole, number, increment, decrement;
-    return _regenerator["default"].wrap(function _callee8$(_context8) {
-      while (1) switch (_context8.prev = _context8.next) {
-        case 0:
-          _render19 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            step: 0.5
-          })), getByLabelText = _render19.getByLabelText, getAllByRole = _render19.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "-9");
-          _react2.fireEvent.blur(number);
-          expect(number.value).toBe("-9");
-          increment = getAllByRole("button")[1];
-          _context8.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("-8.5");
-          _context8.next = 11;
-          return _userEvent["default"].click(increment);
-        case 11:
-          expect(number.value).toBe("-8");
-          decrement = getAllByRole("button")[0];
-          _context8.next = 15;
-          return _userEvent["default"].click(decrement);
-        case 15:
-          _context8.next = 17;
-          return _userEvent["default"].click(decrement);
-        case 17:
-          _context8.next = 19;
-          return _userEvent["default"].click(decrement);
-        case 19:
-          expect(number.value).toBe("-9.5");
-          _context8.next = 22;
-          return _userEvent["default"].click(decrement);
-        case 22:
-          expect(number.value).toBe("-10");
-        case 23:
-        case "end":
-          return _context8.stop();
-      }
-    }, _callee8);
-  })));
-  test("Increment and decrement the value with min, max and step", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
-    var onBlur, _render20, getByLabelText, getAllByRole, number, increment, decrement;
-    return _regenerator["default"].wrap(function _callee9$(_context9) {
-      while (1) switch (_context9.prev = _context9.next) {
-        case 0:
-          onBlur = jest.fn();
-          _render20 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 5,
-            max: 20,
-            step: 8,
-            onBlur: onBlur
-          })), getByLabelText = _render20.getByLabelText, getAllByRole = _render20.getAllByRole;
-          number = getByLabelText("Number input label");
-          _userEvent["default"].type(number, "1");
-          _react2.fireEvent.blur(number);
-          expect(onBlur).toHaveBeenCalledWith({
-            value: "1",
-            error: "Value must be greater than or equal to 5."
-          });
-          increment = getAllByRole("button")[1];
-          _context9.next = 9;
-          return _userEvent["default"].click(increment);
-        case 9:
-          expect(number.value).toBe("5");
-          _context9.next = 12;
-          return _userEvent["default"].click(increment);
-        case 12:
-          expect(number.value).toBe("13");
-          _context9.next = 15;
-          return _userEvent["default"].click(increment);
-        case 15:
-          expect(number.value).toBe("13");
-          _context9.next = 18;
-          return _userEvent["default"].click(increment);
-        case 18:
-          expect(number.value).toBe("13");
-          decrement = getAllByRole("button")[0];
-          _context9.next = 22;
-          return _userEvent["default"].click(decrement);
-        case 22:
-          expect(number.value).toBe("5");
-          _context9.next = 25;
-          return _userEvent["default"].click(decrement);
-        case 25:
-          expect(number.value).toBe("5");
-          _context9.next = 28;
-          return _userEvent["default"].click(decrement);
-        case 28:
-        case "end":
-          return _context9.stop();
-      }
-    }, _callee9);
-  })));
-  test("Start incrementing from 0 when the min value is less than 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10() {
-    var onBlur, _render21, getByLabelText, getAllByRole, number, increment;
-    return _regenerator["default"].wrap(function _callee10$(_context10) {
-      while (1) switch (_context10.prev = _context10.next) {
-        case 0:
-          onBlur = jest.fn();
-          _render21 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: -10,
-            max: 10,
-            step: 1,
-            onBlur: onBlur
-          })), getByLabelText = _render21.getByLabelText, getAllByRole = _render21.getAllByRole;
-          number = getByLabelText("Number input label");
-          increment = getAllByRole("button")[1];
-          _context10.next = 6;
-          return _userEvent["default"].click(increment);
-        case 6:
-          expect(number.value).toBe("1");
-          _context10.next = 9;
-          return _userEvent["default"].click(increment);
-        case 9:
-          expect(number.value).toBe("2");
-        case 10:
-        case "end":
-          return _context10.stop();
-      }
-    }, _callee10);
-  })));
-  test("Start incrementing from 0 when the min value is less than 0 and the max is 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
-    var _render22, getByLabelText, getAllByRole, number, increment;
-    return _regenerator["default"].wrap(function _callee11$(_context11) {
-      while (1) switch (_context11.prev = _context11.next) {
-        case 0:
-          _render22 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: -10,
-            max: 0,
-            step: 1
-          })), getByLabelText = _render22.getByLabelText, getAllByRole = _render22.getAllByRole;
-          number = getByLabelText("Number input label");
-          increment = getAllByRole("button")[1];
-          _context11.next = 5;
-          return _userEvent["default"].click(increment);
-        case 5:
-          expect(number.value).toBe("0");
-          _context11.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("0");
-        case 9:
-        case "end":
-          return _context11.stop();
-      }
-    }, _callee11);
-  })));
-  test("Start incrementing from the min value when it is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12() {
-    var _render23, getByLabelText, getAllByRole, number, increment;
-    return _regenerator["default"].wrap(function _callee12$(_context12) {
-      while (1) switch (_context12.prev = _context12.next) {
-        case 0:
-          _render23 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 2,
-            max: 10,
-            step: 0.5
-          })), getByLabelText = _render23.getByLabelText, getAllByRole = _render23.getAllByRole;
-          number = getByLabelText("Number input label");
-          increment = getAllByRole("button")[1];
-          _context12.next = 5;
-          return _userEvent["default"].click(increment);
-        case 5:
-          expect(number.value).toBe("2");
-          _context12.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("2.5");
-        case 9:
-        case "end":
-          return _context12.stop();
-      }
-    }, _callee12);
-  })));
-  test("Start incrementing from the max value when it is less than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13() {
-    var _render24, getByLabelText, getAllByRole, number, increment;
-    return _regenerator["default"].wrap(function _callee13$(_context13) {
-      while (1) switch (_context13.prev = _context13.next) {
-        case 0:
-          _render24 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: -10,
-            max: -1,
-            step: 0.5
-          })), getByLabelText = _render24.getByLabelText, getAllByRole = _render24.getAllByRole;
-          number = getByLabelText("Number input label");
-          increment = getAllByRole("button")[1];
-          _context13.next = 5;
-          return _userEvent["default"].click(increment);
-        case 5:
-          expect(number.value).toBe("-1");
-          _context13.next = 8;
-          return _userEvent["default"].click(increment);
-        case 8:
-          expect(number.value).toBe("-1");
-        case 9:
-        case "end":
-          return _context13.stop();
-      }
-    }, _callee13);
-  })));
-  test("Start decrementing from 0 when the min value is less than 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
-    var _render25, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee14$(_context14) {
-      while (1) switch (_context14.prev = _context14.next) {
-        case 0:
-          _render25 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: -10,
-            max: 10,
-            step: 1
-          })), getByLabelText = _render25.getByLabelText, getAllByRole = _render25.getAllByRole;
-          number = getByLabelText("Number input label");
-          decrement = getAllByRole("button")[0];
-          _context14.next = 5;
-          return _userEvent["default"].click(decrement);
-        case 5:
-          expect(number.value).toBe("-1");
-        case 6:
-        case "end":
-          return _context14.stop();
-      }
-    }, _callee14);
-  })));
-  test("Start decrementing from 0 when the min value is 0 and the max value is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15() {
-    var _render26, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee15$(_context15) {
-      while (1) switch (_context15.prev = _context15.next) {
-        case 0:
-          _render26 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 0,
-            max: 10,
-            step: 1
-          })), getByLabelText = _render26.getByLabelText, getAllByRole = _render26.getAllByRole;
-          number = getByLabelText("Number input label");
-          decrement = getAllByRole("button")[0];
-          _context15.next = 5;
-          return _userEvent["default"].click(decrement);
-        case 5:
-          expect(number.value).toBe("0");
-        case 6:
-        case "end":
-          return _context15.stop();
-      }
-    }, _callee15);
-  })));
-  test("Start decrementing from the min value when it is bigger than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee16() {
-    var _render27, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee16$(_context16) {
-      while (1) switch (_context16.prev = _context16.next) {
-        case 0:
-          _render27 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: 2,
-            max: 10,
-            step: 0.5
-          })), getByLabelText = _render27.getByLabelText, getAllByRole = _render27.getAllByRole;
-          number = getByLabelText("Number input label");
-          decrement = getAllByRole("button")[0];
-          _context16.next = 5;
-          return _userEvent["default"].click(decrement);
-        case 5:
-          expect(number.value).toBe("2");
-          _context16.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("2");
-        case 9:
-        case "end":
-          return _context16.stop();
-      }
-    }, _callee16);
-  })));
-  test("Start decrementing from the max value when it is less than 0", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee17() {
-    var _render28, getByLabelText, getAllByRole, number, decrement;
-    return _regenerator["default"].wrap(function _callee17$(_context17) {
-      while (1) switch (_context17.prev = _context17.next) {
-        case 0:
-          _render28 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            min: -10,
-            max: -1,
-            step: 0.5
-          })), getByLabelText = _render28.getByLabelText, getAllByRole = _render28.getAllByRole;
-          number = getByLabelText("Number input label");
-          decrement = getAllByRole("button")[0];
-          _context17.next = 5;
-          return _userEvent["default"].click(decrement);
-        case 5:
-          expect(number.value).toBe("-1");
-          _context17.next = 8;
-          return _userEvent["default"].click(decrement);
-        case 8:
-          expect(number.value).toBe("-1.5");
-        case 9:
-        case "end":
-          return _context17.stop();
-      }
-    }, _callee17);
-  })));
-  test("Increment and decrement the value with min, max and step using the arrows in keyboard", function () {
-    var _render29 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5
-      })),
-      getByLabelText = _render29.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "1");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("5");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("15");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("20");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("20");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("15");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("5");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("5");
-  });
-  test("Value is unchanged when using the scroll wheel in mouse in a disabled input", function () {
-    var _render30 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        disabled: true,
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5,
-        defaultValue: "10"
-      })),
-      getByLabelText = _render30.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("10");
-  });
-  test("Value is unchanged when using the arrows in keyboard in a disabled input", function () {
-    var _render31 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        disabled: true,
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5,
-        defaultValue: "10"
-      })),
-      getByLabelText = _render31.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("10");
-  });
-  test("Value is unchanged when using the scroll wheel in mouse in a read-only input", function () {
-    var _render32 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        readOnly: true,
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5,
-        defaultValue: "10"
-      })),
-      getByLabelText = _render32.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("10");
-  });
-  test("Value is unchanged when using the arrows in keyboard in a read-only input", function () {
-    var _render33 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        readOnly: true,
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5,
-        defaultValue: "10"
-      })),
-      getByLabelText = _render33.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 38
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.keyDown(number, {
-      keyCode: 40
-    });
-    expect(number.value).toBe("10");
-  });
-  test("Increment and decrement the value with min, max and step using the scroll wheel in mouse", function () {
-    var _render34 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label",
-        min: 5,
-        max: 20,
-        step: 5
-      })),
-      getByLabelText = _render34.getByLabelText;
-    var number = getByLabelText("Number input label");
-    _userEvent["default"].type(number, "1");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("5");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("15");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("20");
-    _react2.fireEvent.wheel(number, {
-      deltaY: -100
-    });
-    expect(number.value).toBe("20");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("15");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("10");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("5");
-    _react2.fireEvent.wheel(number, {
-      deltaY: 100
-    });
-    expect(number.value).toBe("5");
-  });
-  test("Number has correct accessibility attributes", function () {
-    var _render35 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-        label: "Number input label"
-      })),
-      getByLabelText = _render35.getByLabelText,
-      getAllByRole = _render35.getAllByRole;
-    var number = getByLabelText("Number input label");
-    expect(number.getAttribute("type")).toBe("number");
-    expect(number.getAttribute("aria-autocomplete")).toBeNull();
-    expect(number.getAttribute("aria-controls")).toBeNull();
-    expect(number.getAttribute("aria-expanded")).toBeNull();
-    var decrement = getAllByRole("button")[0];
-    expect(decrement.getAttribute("aria-label")).toBe("Decrement value");
-    var increment = getAllByRole("button")[1];
-    expect(increment.getAttribute("aria-label")).toBe("Increment value");
-  });
-  test("Number input submits correct values inside a form and actions don't trigger the submit event", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee18() {
-    var handlerOnSubmit, _render36, getByText, getAllByRole, less, more, submit;
-    return _regenerator["default"].wrap(function _callee18$(_context18) {
-      while (1) switch (_context18.prev = _context18.next) {
-        case 0:
-          handlerOnSubmit = jest.fn(function (e) {
-            e.preventDefault();
-            var formData = new FormData(e.target);
-            var formProps = Object.fromEntries(formData);
-            expect(formProps).toStrictEqual({
-              data: "0"
-            });
-          });
-          _render36 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("form", {
-            onSubmit: handlerOnSubmit
-          }, /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
-            label: "Number input label",
-            name: "data"
-          }), /*#__PURE__*/_react["default"].createElement("button", {
-            type: "submit"
-          }, "Submit"))), getByText = _render36.getByText, getAllByRole = _render36.getAllByRole;
-          less = getAllByRole("button")[0];
-          more = getAllByRole("button")[1];
-          submit = getByText("Submit");
-          _context18.next = 7;
-          return _userEvent["default"].click(more);
-        case 7:
-          expect(handlerOnSubmit).not.toHaveBeenCalled();
-          _context18.next = 10;
-          return _userEvent["default"].click(less);
-        case 10:
-          expect(handlerOnSubmit).not.toHaveBeenCalled();
-          _context18.next = 13;
-          return _userEvent["default"].click(submit);
-        case 13:
-          expect(handlerOnSubmit).toHaveBeenCalled();
-        case 14:
-        case "end":
-          return _context18.stop();
-      }
-    }, _callee18);
-  })));
-});