@instructure/ui-time-select 10.19.2-snapshot-2 → 10.19.2-snapshot-4

package/es/TimeSelect/__new-tests__/TimeSelect.test.js

@@ -1,351 +0,0 @@
-var _TimeSelect, _TimeSelect2, _TimeSelect3, _TimeSelect4, _TimeSelect5, _TimeSelect6;
-/*
- * 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.
- */
-
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { vi } from 'vitest';
-import userEvent from '@testing-library/user-event';
-import moment from 'moment-timezone';
-import '@testing-library/jest-dom';
-
-// eslint-disable-next-line no-restricted-imports
-import { generateA11yTests } from '@instructure/ui-scripts/lib/test/generateA11yTests';
-import { runAxeCheck } from '@instructure/ui-axe-check';
-import { ApplyLocale } from '@instructure/ui-i18n';
-import { TimeSelect } from '../index';
-import TimeSelectExamples from '../__examples__/TimeSelect.examples';
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-describe('<TimeSelect />', () => {
-  let consoleWarningMock;
-  let consoleErrorMock;
-  beforeEach(() => {
-    // Mocking console to prevent test output pollution
-    consoleWarningMock = vi.spyOn(console, 'warn').mockImplementation(() => {});
-    consoleErrorMock = vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    consoleWarningMock.mockRestore();
-    consoleErrorMock.mockRestore();
-  });
-  it('should fire onFocus when input gains focus', async () => {
-    const onFocus = vi.fn();
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      onFocus: onFocus
-    }));
-    const input = screen.getByRole('combobox');
-    input.focus();
-    await waitFor(() => {
-      expect(onFocus).toHaveBeenCalled();
-    });
-  });
-  it('should render a default value', async () => {
-    const defaultValue = moment.tz('1986-05-17T18:00:00.000Z', moment.ISO_8601, 'en', 'US/Eastern');
-    const onChange = vi.fn();
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      onChange: onChange,
-      timezone: "US/Eastern",
-      defaultValue: defaultValue.toISOString()
-    }));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('2:00 PM');
-  });
-  it('should display value when both defaultValue and value are set', async () => {
-    const value = moment.tz('1986-05-17T18:00:00.000Z', moment.ISO_8601, 'en', 'US/Eastern');
-    const defaultValue = moment.tz('1986-05-25T19:00:00.000Z', moment.ISO_8601, 'en', 'US/Eastern');
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      timezone: "US/Eastern",
-      value: value.toISOString(),
-      defaultValue: defaultValue.toISOString()
-    }));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue(value.format('LT'));
-  });
-  it('should default to the first option if defaultToFirstOption is true', async () => {
-    render(_TimeSelect || (_TimeSelect = _jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      defaultToFirstOption: true
-    })));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('12:00 AM');
-  });
-  it('should use the specified timezone', async () => {
-    const value = moment.tz('2024-01-11T13:00:00.000Z', moment.ISO_8601, 'fr', 'UTC');
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      locale: "fr",
-      timezone: "Africa/Nairobi" // UTC + 3
-      ,
-      value: value.toISOString()
-    }));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('16:00');
-  });
-  it('should use the specified locale', async () => {
-    const value = moment.tz('2024-01-11T13:00:00.000Z', moment.ISO_8601, 'fr',
-    // 24-hour clock
-    'UTC');
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      locale: "en" // 12-hour clock
-      ,
-      timezone: "UTC",
-      value: value.toISOString()
-    }));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('1:00 PM');
-  });
-  it('should handle winter and summer time based on timezone', async () => {
-    const valueSummer = moment.tz('2024-07-11T13:00:00.000Z', moment.ISO_8601, 'en', 'UTC' // no time offset
-    );
-    const valueWinter = moment.tz('2024-01-11T13:00:00.000Z', moment.ISO_8601, 'en', 'UTC' // no time offset
-    );
-    const _render = render(_jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        locale: "en",
-        timezone: "Europe/London" // summer time offset
-        ,
-        value: valueSummer.toISOString()
-      })),
-      rerender = _render.rerender;
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('2:00 PM');
-    rerender(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      locale: "en",
-      timezone: "Europe/London" // summer time offset
-      ,
-      value: valueWinter.toISOString()
-    }));
-    const inputUpdated = screen.getByRole('combobox');
-    expect(inputUpdated).toHaveValue('1:00 PM');
-  });
-  it('should read locale and timezone from context', async () => {
-    const value = moment.tz('2017-05-01T17:30Z', moment.ISO_8601, 'en',
-    // 12-hour clock format
-    'UTC' // no time offset
-    );
-    render(_jsx(ApplyLocale, {
-      locale: "fr" // 24-hour clock format
-      ,
-      timezone: "Africa/Nairobi" // UTC + 3
-      ,
-      children: _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        step: 15,
-        value: value.toISOString()
-      })
-    }));
-    const input = screen.getByRole('combobox');
-    expect(input).toHaveValue('20:30');
-  });
-  it('adding event listeners does not break functionality', async () => {
-    const onChange = vi.fn();
-    const onKeyDown = vi.fn();
-    const handleInputChange = vi.fn();
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      allowNonStepInput: true,
-      locale: "en_AU",
-      timezone: "US/Eastern",
-      onChange: onChange,
-      onInputChange: handleInputChange,
-      onKeyDown: onKeyDown
-    }));
-    const input = screen.getByRole('combobox');
-    await userEvent.type(input, '7:45 PM');
-    fireEvent.blur(input); // sends onChange event
-
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), {
-      inputText: '7:45 PM',
-      value: expect.anything()
-    });
-    expect(onKeyDown).toHaveBeenCalled();
-    expect(handleInputChange).toHaveBeenCalled();
-    expect(input).toHaveValue('7:45 PM');
-  });
-  it('allowClearingSelection allows to clear the value', async () => {
-    const defaultValue = moment.tz('1986-05-17T18:00:00.000Z',
-    // 2:00 PM in US/Eastern
-    moment.ISO_8601, 'en', 'US/Eastern');
-    const onChange = vi.fn();
-    render(_jsx(TimeSelect, {
-      allowClearingSelection: true,
-      renderLabel: "Choose a time",
-      allowNonStepInput: true,
-      locale: "en_AU",
-      timezone: "US/Eastern",
-      defaultValue: defaultValue.toISOString(),
-      onChange: onChange
-    }));
-    const input = screen.getByRole('combobox');
-    await userEvent.type(input, '{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}');
-    fireEvent.blur(input); // sends onChange event
-
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), {
-      inputText: '',
-      value: ''
-    });
-    expect(input).toHaveValue('');
-  });
-  it('Can change from defaultValue', async () => {
-    const defaultValue = moment.tz('1986-05-17T18:00:00.000Z',
-    // 2:00 PM in US/Eastern
-    moment.ISO_8601, 'en', 'US/Eastern');
-    const onChange = vi.fn();
-    const onKeyDown = vi.fn();
-    const handleInputChange = vi.fn();
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      allowNonStepInput: true,
-      locale: "en_AU",
-      timezone: "US/Eastern",
-      defaultValue: defaultValue.toISOString(),
-      onChange: onChange,
-      onInputChange: handleInputChange,
-      onKeyDown: onKeyDown
-    }));
-    const input = screen.getByRole('combobox');
-    await userEvent.type(input, '{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}7:45 PM');
-    fireEvent.blur(input); // sends onChange event
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), {
-      inputText: '7:45 PM',
-      value: '1986-05-17T23:45:00.000Z'
-    });
-    expect(onKeyDown).toHaveBeenCalled();
-    expect(handleInputChange).toHaveBeenCalled();
-    expect(input).toHaveValue('7:45 PM');
-  });
-  it('Reverts to a set value if the current one is invalid', async () => {
-    const defaultValue = moment.tz('1986-05-17T18:00:00.000Z',
-    // 2:00 PM in US/Eastern
-    moment.ISO_8601, 'en', 'US/Eastern');
-    const onChange = vi.fn();
-    const onKeyDown = vi.fn();
-    const handleInputChange = vi.fn();
-    render(_jsx(TimeSelect, {
-      renderLabel: "Choose a time",
-      allowNonStepInput: true,
-      locale: "en_AU",
-      timezone: "US/Eastern",
-      defaultValue: defaultValue.toISOString(),
-      onChange: onChange,
-      onInputChange: handleInputChange,
-      onKeyDown: onKeyDown
-    }));
-    const input = screen.getByRole('combobox');
-    await userEvent.type(input, '{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}7:45 PM');
-    fireEvent.blur(input); // sends onChange event
-    await userEvent.type(input, 'asdf');
-    fireEvent.blur(input);
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), {
-      inputText: '7:45 PM',
-      value: '1986-05-17T23:45:00.000Z'
-    });
-    expect(onKeyDown).toHaveBeenCalled();
-    expect(handleInputChange).toHaveBeenCalled();
-    expect(input).toHaveValue('7:45 PM');
-  });
-  describe('input', () => {
-    it('should render with a custom id if given', async () => {
-      render(_TimeSelect2 || (_TimeSelect2 = _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        id: "timeSelect"
-      })));
-      const input = screen.getByRole('combobox');
-      expect(input).toHaveAttribute('id', 'timeSelect');
-    });
-    it('should render readonly when interaction="readonly"', async () => {
-      render(_TimeSelect3 || (_TimeSelect3 = _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        interaction: "readonly"
-      })));
-      const input = screen.getByRole('combobox');
-      expect(input).toHaveAttribute('readonly');
-      expect(input).not.toHaveAttribute('disabled');
-    });
-    it('should render disabled when interaction="disabled"', async () => {
-      render(_TimeSelect4 || (_TimeSelect4 = _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        interaction: "disabled"
-      })));
-      const input = screen.getByRole('combobox');
-      expect(input).toHaveAttribute('disabled');
-      expect(input).not.toHaveAttribute('readonly');
-    });
-    it('should render required when isRequired is true', async () => {
-      render(_TimeSelect5 || (_TimeSelect5 = _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        isRequired: true
-      })));
-      const input = screen.getByRole('combobox');
-      expect(input).toHaveAttribute('required');
-    });
-    it('should allow custom props to pass through', async () => {
-      render(_TimeSelect6 || (_TimeSelect6 = _jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        "data-custom-attr": "true"
-      })));
-      const input = screen.getByRole('combobox');
-      expect(input).toHaveAttribute('data-custom-attr', 'true');
-    });
-    it('should provide a ref to the input element', async () => {
-      const inputRef = vi.fn();
-      render(_jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        inputRef: inputRef
-      }));
-      const input = screen.getByRole('combobox');
-      expect(inputRef).toHaveBeenCalledWith(input);
-    });
-  });
-  describe('list', () => {
-    it('should provide a ref to the list element', async () => {
-      const listRef = vi.fn();
-      render(_jsx(TimeSelect, {
-        renderLabel: "Choose a time",
-        listRef: listRef
-      }));
-      const input = screen.getByRole('combobox');
-      await userEvent.click(input);
-      await waitFor(() => {
-        const listbox = screen.getByRole('listbox');
-        expect(listRef).toHaveBeenCalledWith(listbox);
-      });
-    });
-  });
-  describe('with generated examples', () => {
-    const generatedComponents = generateA11yTests(TimeSelect, TimeSelectExamples);
-    it.each(generatedComponents)('should be accessible with example: $description', async ({
-      content
-    }) => {
-      const _render2 = render(content),
-        container = _render2.container;
-      const axeCheck = await runAxeCheck(container);
-      expect(axeCheck).toBe(true);
-    });
-  });
-});