@instructure/ui-date-input 10.19.2-snapshot-2 → 10.19.2-snapshot-4

package/lib/DateInput/__new-tests__/DateInput.test.js

@@ -1,643 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _react = require("@testing-library/react");
-var _vitest = require("vitest");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-require("@testing-library/jest-dom");
-var _generateA11yTests = require("@instructure/ui-scripts/lib/test/generateA11yTests");
-var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
-var _Calendar = require("@instructure/ui-calendar/lib/Calendar");
-var _DateInput = _interopRequireDefault(require("../__examples__/DateInput.examples"));
-var _index = require("../index");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-var _Calendar$Day, _button, _button2, _Calendar$Day2, _Calendar$Day3;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-// eslint-disable-next-line no-restricted-imports
-describe('<DateInput />', () => {
-  const weekdayLabels = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
-  const generateDays = (count = _Calendar.Calendar.DAY_COUNT) => {
-    const days = [];
-    const date = new Date('2019-07-28');
-    while (days.length < count) {
-      days.push((0, _jsxRuntime.jsx)(_Calendar.Calendar.Day, {
-        date: date.toISOString(),
-        label: date.toISOString(),
-        children: date.getDate()
-      }, date.toISOString()));
-      date.setDate(date.getDate() + 1);
-    }
-    return days;
-  };
-  let consoleWarningMock;
-  let consoleErrorMock;
-  beforeEach(() => {
-    // Mocking console to prevent test output pollution
-    consoleWarningMock = _vitest.vi.spyOn(console, 'warn').mockImplementation(() => {});
-    consoleErrorMock = _vitest.vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    consoleWarningMock.mockRestore();
-    consoleErrorMock.mockRestore();
-  });
-  it('should render an input and a calendar', async () => {
-    const _render = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "date-input",
-        renderWeekdayLabels: weekdayLabels,
-        isShowingCalendar: true,
-        children: generateDays()
-      })),
-      container = _render.container,
-      findByRole = _render.findByRole;
-    const dateInput = container.querySelector('input');
-    expect(dateInput).toBeInTheDocument();
-    expect(dateInput).toHaveAttribute('type', 'text');
-    await _userEvent.default.click(dateInput);
-    const calendarTable = await findByRole('listbox');
-    const calendarWrapper = await document.querySelector('[id^="Selectable_"][id$="-list"]');
-    await (0, _react.waitFor)(() => {
-      expect(calendarWrapper).toBeInTheDocument();
-      expect(calendarTable).toBeInTheDocument();
-    });
-  });
-  describe('input', () => {
-    it('should render a label', () => {
-      const labelText = 'label text';
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: labelText,
-        renderWeekdayLabels: weekdayLabels,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('label text');
-      expect(dateInput).toBeInTheDocument();
-    });
-    it('should set value', () => {
-      const value = 'January 5';
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        value: value,
-        onChange: _vitest.vi.fn(),
-        renderWeekdayLabels: weekdayLabels,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveValue(value);
-    });
-    it('should call onChange with the updated value', async () => {
-      const onChange = _vitest.vi.fn();
-      const value = 'May 18, 2022';
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        onChange: onChange,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      _react.fireEvent.change(dateInput, {
-        target: {
-          value: value
-        }
-      });
-      _react.fireEvent.keyDown(dateInput, {
-        key: 'Enter',
-        code: 'Enter'
-      });
-      _react.fireEvent.blur(dateInput);
-      await (0, _react.waitFor)(() => {
-        expect(onChange).toHaveBeenCalledTimes(1);
-        expect(onChange.mock.calls[0][1].value).toEqual(expect.stringContaining(value));
-      });
-    });
-    it('should call onBlur', () => {
-      const onBlur = _vitest.vi.fn();
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        onBlur: onBlur,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      _react.fireEvent.blur(dateInput);
-      expect(onBlur).toHaveBeenCalledTimes(1);
-    });
-    it('should correctly set interaction type', async () => {
-      const _render2 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          interaction: "disabled",
-          children: generateDays()
-        })),
-        rerender = _render2.rerender;
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('disabled');
-      rerender((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        interaction: "readonly",
-        children: generateDays()
-      }));
-      const dateInputAfterUpdate = _react.screen.getByLabelText('Choose date');
-      await (0, _react.waitFor)(() => {
-        expect(dateInputAfterUpdate).toHaveAttribute('readonly');
-      });
-    });
-    it('should correctly set disabled', () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        disabled: true,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('disabled');
-    });
-    it('should correctly set readOnly', () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        readOnly: true,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('readOnly');
-    });
-    it('should set placeholder', () => {
-      const placeholder = 'Start typing to choose a date';
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        placeholder: placeholder,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('placeholder', placeholder);
-    });
-    it('should be requireable', () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        isRequired: true,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date *');
-      expect(dateInput).toHaveAttribute('required');
-    });
-    it('should provide inputRef', () => {
-      const inputRef = _vitest.vi.fn();
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        inputRef: inputRef,
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(inputRef).toHaveBeenCalledWith(dateInput);
-    });
-    it('should render messages', () => {
-      const text = 'The selected date is invalid';
-      const _render3 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          messages: [{
-            type: 'error',
-            text
-          }],
-          children: generateDays()
-        })),
-        container = _render3.container;
-      expect(container).toHaveTextContent(text);
-    });
-    it('should allow custom props to pass through', () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        "data-custom-attr": "custom value",
-        name: "my name",
-        children: generateDays()
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('data-custom-attr', 'custom value');
-      expect(dateInput).toHaveAttribute('name', 'my name');
-    });
-  });
-  describe('Calendar', () => {
-    it('should show calendar when `isShowingCalendar` is set', async () => {
-      const _render4 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          children: generateDays()
-        })),
-        rerender = _render4.rerender,
-        queryByRole = _render4.queryByRole;
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      const calendarTable = await queryByRole('listbox');
-      const calendarWrapper = await document.querySelector('[id^="Selectable_"][id$="-list"]');
-      expect(dateInput).toBeInTheDocument();
-      expect(calendarTable).not.toBeInTheDocument();
-      expect(calendarWrapper).not.toBeInTheDocument();
-      rerender((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        isShowingCalendar: true,
-        children: generateDays()
-      }));
-      const dateInputAfterUpdate = _react.screen.getByLabelText('Choose date');
-      const calendarTableAfterUpdate = await queryByRole('listbox');
-      const calendarWrapperAfterUpdate = await document.querySelector('[id^="Selectable_"][id$="-list"]');
-      await (0, _react.waitFor)(() => {
-        expect(dateInputAfterUpdate).toBeInTheDocument();
-        expect(calendarTableAfterUpdate).toBeInTheDocument();
-        expect(calendarWrapperAfterUpdate).toBeInTheDocument();
-      });
-    });
-    describe('onRequestShowCalendar', () => {
-      it('should call onRequestShowCalendar when label is clicked', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        const _render5 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-            renderLabel: "Choose date",
-            renderWeekdayLabels: weekdayLabels,
-            onRequestShowCalendar: onRequestShowCalendar,
-            children: generateDays()
-          })),
-          container = _render5.container;
-        const dateInput = container.querySelector('span[class$="-formFieldLayout__label"]');
-        expect(dateInput).toHaveTextContent('Choose date');
-        await _userEvent.default.click(dateInput);
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalled();
-        });
-      });
-      it('should call onRequestShowCalendar when input is clicked', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        const _render6 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-            renderLabel: "Choose date",
-            renderWeekdayLabels: weekdayLabels,
-            onRequestShowCalendar: onRequestShowCalendar,
-            children: generateDays()
-          })),
-          container = _render6.container;
-        const dateInput = container.querySelector('input');
-        await _userEvent.default.click(dateInput);
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should call onRequestShowCalendar when input receives space event', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{space}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should not call onRequestShowCalendar when input receives space event if calendar is already showing', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          isShowingCalendar: true,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{space}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).not.toHaveBeenCalled();
-        });
-      });
-      it('should call onRequestShowCalendar when input receives down arrow event', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{arrowdown}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should not call onRequestShowCalendar when input receives down arrow event if calendar is already showing', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          isShowingCalendar: true,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{arrowdown}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).not.toHaveBeenCalled();
-        });
-      });
-      it('should call onRequestShowCalendar when input receives up arrow event', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{arrowup}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should not call onRequestShowCalendar when input receives up arrow event if calendar is already showing', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          isShowingCalendar: true,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{arrowup}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).not.toHaveBeenCalled();
-        });
-      });
-      it('should call onRequestShowCalendar when input receives onChange event', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        _react.fireEvent.change(dateInput, {
-          target: {
-            value: 'January 5'
-          }
-        });
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should not call onRequestShowCalendar when disabled', async () => {
-        const onRequestShowCalendar = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestShowCalendar: onRequestShowCalendar,
-          interaction: "disabled",
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        _react.fireEvent.click(dateInput);
-        await _userEvent.default.type(dateInput, '{arrowup}{arrowdown}{space}January 5', {
-          skipClick: true
-        });
-        await (0, _react.waitFor)(() => {
-          expect(onRequestShowCalendar).not.toHaveBeenCalled();
-        });
-      });
-    });
-    describe('onRequestHideCalendar and onRequestValidateDate', () => {
-      it('should call onRequestHideCalendar and onRequestValidateDate input receives onBlur event', async () => {
-        const onRequestHideCalendar = _vitest.vi.fn();
-        const onRequestValidateDate = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestHideCalendar: onRequestHideCalendar,
-          onRequestValidateDate: onRequestValidateDate,
-          isShowingCalendar: true,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        _react.fireEvent.blur(dateInput);
-        await (0, _react.waitFor)(() => {
-          expect(onRequestHideCalendar).toHaveBeenCalledTimes(1);
-          expect(onRequestValidateDate).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should call onRequestHideCalendar and onRequestValidateDate when input receives esc event', async () => {
-        const onRequestHideCalendar = _vitest.vi.fn();
-        const onRequestValidateDate = _vitest.vi.fn();
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestHideCalendar: onRequestHideCalendar,
-          onRequestValidateDate: onRequestValidateDate,
-          isShowingCalendar: true,
-          children: generateDays()
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{esc}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestHideCalendar).toHaveBeenCalledTimes(1);
-          expect(onRequestValidateDate).toHaveBeenCalledTimes(1);
-        });
-      });
-      it('should call onRequestHideCalendar and onRequestValidateDate when input receives enter event', async () => {
-        const onRequestHideCalendar = _vitest.vi.fn();
-        const onRequestValidateDate = _vitest.vi.fn();
-        const days = generateDays();
-        days[4] = _Calendar$Day || (_Calendar$Day = (0, _jsxRuntime.jsx)(_Calendar.Calendar.Day, {
-          label: "4",
-          date: "2019-09-28",
-          isSelected: true,
-          children: 4
-        }, "4"));
-        (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-          renderLabel: "Choose date",
-          renderWeekdayLabels: weekdayLabels,
-          onRequestHideCalendar: onRequestHideCalendar,
-          onRequestValidateDate: onRequestValidateDate,
-          isShowingCalendar: true,
-          children: days
-        }));
-        const dateInput = _react.screen.getByLabelText('Choose date');
-        await _userEvent.default.type(dateInput, '{enter}');
-        await (0, _react.waitFor)(() => {
-          expect(onRequestHideCalendar).toHaveBeenCalledTimes(1);
-          expect(onRequestValidateDate).toHaveBeenCalledTimes(1);
-        });
-      });
-    });
-    it('should render calendar navigation label', () => {
-      const label = 'January 2019';
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        renderNavigationLabel: (0, _jsxRuntime.jsx)("div", {
-          "data-testId": "label-id",
-          children: label
-        }),
-        isShowingCalendar: true,
-        children: generateDays()
-      }));
-      const navigationLabel = _react.screen.getByTestId('label-id');
-      expect(navigationLabel).toBeInTheDocument();
-      expect(navigationLabel).toHaveTextContent(label);
-    });
-    it('should render calendar weekday labels', async () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        isShowingCalendar: true,
-        children: generateDays()
-      }));
-      const calendar = await _react.screen.findByRole('listbox');
-      const headers = calendar.querySelectorAll('th');
-      expect(headers.length).toEqual(7);
-      weekdayLabels.forEach(label => {
-        expect(calendar).toHaveTextContent(label);
-      });
-    });
-    it('should render all focusable elements in calendar with tabIndex="-1"', async () => {
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        renderNextMonthButton: _button || (_button = (0, _jsxRuntime.jsx)("button", {
-          "data-testId": "button-next",
-          children: "next"
-        })),
-        renderPrevMonthButton: _button2 || (_button2 = (0, _jsxRuntime.jsx)("button", {
-          "data-testId": "button-prev",
-          children: "prev"
-        })),
-        isShowingCalendar: true,
-        children: generateDays()
-      }));
-      const calendar = await _react.screen.findByRole('listbox');
-      const calendarDays = calendar.querySelectorAll('button');
-      const nextMonthButton = _react.screen.getByTestId('button-next');
-      const prevMonthButton = _react.screen.getByTestId('button-prev');
-      expect(nextMonthButton).toHaveAttribute('tabIndex', '-1');
-      expect(prevMonthButton).toHaveAttribute('tabIndex', '-1');
-      expect(calendarDays).toHaveLength(42);
-      calendarDays.forEach(day => {
-        expect(day).toHaveAttribute('tabIndex', '-1');
-      });
-    });
-    it('should render days with the correct role', async () => {
-      const days = generateDays();
-      days[5] = _Calendar$Day2 || (_Calendar$Day2 = (0, _jsxRuntime.jsx)(_Calendar.Calendar.Day, {
-        label: "5",
-        date: "2019-09-28",
-        id: "5",
-        isOutsideMonth: true,
-        children: "outside"
-      }, "5"));
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        isShowingCalendar: true,
-        children: days
-      }));
-      const calendar = await _react.screen.findByRole('listbox');
-      const calendarDays = calendar.querySelectorAll('button');
-      calendarDays.forEach(day => {
-        if (day.textContent.includes('outside')) {
-          expect(day).toHaveAttribute('role', 'presentation');
-        } else {
-          expect(day).toHaveAttribute('role', 'option');
-        }
-      });
-    });
-    it('should assign aria-selected to the selected date and link it to the input', async () => {
-      const days = generateDays();
-      days[7] = _Calendar$Day3 || (_Calendar$Day3 = (0, _jsxRuntime.jsx)(_Calendar.Calendar.Day, {
-        label: "7",
-        date: "2019-09-28",
-        id: "selected-day-id",
-        isSelected: true,
-        children: "selected"
-      }, "7"));
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        renderWeekdayLabels: weekdayLabels,
-        isShowingCalendar: true,
-        children: days
-      }));
-      const calendar = await _react.screen.findByRole('listbox');
-      const calendarDays = calendar.querySelectorAll('button');
-      let selectedDayID = '';
-      calendarDays.forEach(day => {
-        if (day.textContent.includes('selected')) {
-          selectedDayID = day.id;
-          expect(day).toHaveAttribute('aria-selected', 'true');
-        } else {
-          expect(day).toHaveAttribute('aria-selected', 'false');
-        }
-      });
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      expect(dateInput).toHaveAttribute('aria-activedescendant', selectedDayID);
-    });
-  });
-  describe('with generated examples', () => {
-    const generatedComponents = (0, _generateA11yTests.generateA11yTests)(_index.DateInput, _DateInput.default);
-    it.each(generatedComponents)('should be accessible with example: $description', async ({
-      content
-    }) => {
-      const _render7 = (0, _react.render)(content),
-        container = _render7.container;
-      const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
-      expect(axeCheck).toBe(true);
-    });
-  });
-  describe('with minimal config', () => {
-    it('should render 44 buttons (a calendar) when clicked', async () => {
-      const onChange = _vitest.vi.fn();
-      (0, _react.render)((0, _jsxRuntime.jsx)(_index.DateInput, {
-        renderLabel: "Choose date",
-        assistiveText: "Type a date or use arrow keys to navigate date picker.",
-        width: "20rem",
-        isInline: true,
-        value: '2023-11-23',
-        onChange: onChange,
-        currentDate: "2023-12-23",
-        disabledDates: ['2023-12-22', '2023-12-12', '2023-12-11'],
-        disabledDateErrorMessage: "disabled date",
-        invalidDateErrorMessage: "invalid date"
-      }));
-      const dateInput = _react.screen.getByLabelText('Choose date');
-      _react.fireEvent.click(dateInput);
-      const calendarTable = document.querySelector('table');
-      const calendarDays = calendarTable.querySelectorAll('button');
-      const calendarWrapper = document.querySelector('[id^="Selectable_"][id$="-list"]');
-      const calendarButtons = calendarWrapper.querySelectorAll('button');
-      await (0, _react.waitFor)(() => {
-        expect(calendarButtons).toHaveLength(44);
-        expect(calendarDays).toHaveLength(42);
-      });
-    });
-  });
-});