@docsvision/material-ui-pickers 3.2.0-beta.26 → 3.2.0-beta.27

package/src/__tests__/_shared/ModalDialog.test.tsx

@@ -1,109 +0,0 @@
-import * as React from 'react';
-import { ShallowWrapper } from 'enzyme';
-import { shallow } from '../test-utils';
-import { ModalDialog, ModalDialogProps } from '../../_shared/ModalDialog';
-
-const initialProps = {
-  onAccept: jest.fn(),
-  onDismiss: jest.fn(),
-  onClear: jest.fn(),
-  onKeyDownInner: jest.fn(),
-  okLabel: 'OK',
-  open: false,
-  cancelLabel: 'Cancel',
-  clearLabel: 'Clear',
-  clearable: false,
-  todayLabel: 'Today',
-  showTodayButton: false,
-  onSetToday: jest.fn(),
-  children: 'Test',
-  classes: {} as any,
-};
-
-describe('ModalDialog', () => {
-  let component: ShallowWrapper<ModalDialogProps>;
-  const props = { ...initialProps };
-
-  beforeEach(() => {
-    component = shallow(<ModalDialog {...props} />);
-  });
-
-  it('Should render dialog content', () => {
-    expect(component.find('WithStyles(ForwardRef(DialogContent))').props().children).toBe(
-      props.children
-    );
-  });
-
-  it('Should render dialog actions with 2 buttons', () => {
-    expect(component.find('WithStyles(ForwardRef(DialogActions))').length).toBe(1);
-    expect(
-      component
-        .find('WithStyles(ForwardRef(Button))')
-        .at(0)
-        .props().children
-    ).toBe('Cancel');
-
-    expect(
-      component
-        .find('WithStyles(ForwardRef(Button))')
-        .at(1)
-        .props().children
-    ).toBe('OK');
-  });
-
-  it('Should handle on OK button click', () => {
-    component
-      .find('WithStyles(ForwardRef(Button))')
-      .at(1)
-      .simulate('click');
-    expect(props.onAccept).toHaveBeenCalled();
-  });
-
-  it('Should handle on Cancel button click', () => {
-    component
-      .find('WithStyles(ForwardRef(Button))')
-      .at(0)
-      .simulate('click');
-    expect(props.onDismiss).toHaveBeenCalled();
-  });
-});
-
-describe('ModalDialog with Clear Button', () => {
-  let component: ShallowWrapper<ModalDialogProps>;
-  const props = {
-    ...initialProps,
-    clearable: true,
-  };
-
-  beforeEach(() => {
-    component = shallow(<ModalDialog {...props} />);
-  });
-
-  it('Should handle on Clear button click', () => {
-    component
-      .find('WithStyles(ForwardRef(Button))')
-      .at(0)
-      .simulate('click');
-    expect(props.onClear).toHaveBeenCalled();
-  });
-});
-
-describe('ModalDialog with Today Button', () => {
-  let component: ShallowWrapper<ModalDialogProps>;
-  const props = {
-    ...initialProps,
-    showTodayButton: true,
-  };
-
-  beforeEach(() => {
-    component = shallow(<ModalDialog {...props} />);
-  });
-
-  it('Should handle on Clear button click', () => {
-    component
-      .find('WithStyles(ForwardRef(Button))')
-      .at(0)
-      .simulate('click');
-    expect(props.onSetToday).toHaveBeenCalled();
-  });
-});

package/src/__tests__/e2e/DatePicker.test.tsx

@@ -1,233 +0,0 @@
-import * as React from 'react';
-import { ReactWrapper } from 'enzyme';
-import { mount, utilsToUse } from '../test-utils';
-import { DatePicker, DatePickerProps } from '../../DatePicker/DatePicker';
-
-describe('e2e - DatePicker default year format', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    component = mount(
-      <DatePicker
-        animateYearScrolling={false}
-        value={utilsToUse.date('2018-01-01T00:00:00.000')}
-        onChange={onChangeMock}
-        views={['year']}
-      />
-    );
-  });
-
-  it('Should use year format by default for year only view', () => {
-    expect(component.find('input').props().value).toBe(
-      utilsToUse.format(date, utilsToUse.yearFormat)
-    );
-  });
-});
-
-describe('e2e - DatePicker default year month format', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker onChange={onChangeMock} value={date} views={['year', 'month']} />
-    );
-  });
-
-  it('Should use year month format by default for year & month views', () => {
-    expect(component.find('input').props().value).toBe(
-      utilsToUse.format(date, utilsToUse.yearMonthFormat)
-    );
-  });
-});
-
-describe('e2e - DatePicker default year month day format', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker onChange={onChangeMock} value={date} views={['year', 'month', 'date']} />
-    );
-  });
-
-  it('Should use default for year & month & day views', () => {
-    expect(component.find('input').props().value).toBe(
-      utilsToUse.format(date, utilsToUse.dateFormat)
-    );
-  });
-});
-
-describe('e2e - DatePicker inline variant', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const onCloseMock = jest.fn();
-  const onOpenMock = jest.fn();
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    component = mount(
-      <DatePicker
-        autoOk
-        variant="inline"
-        animateYearScrolling={false}
-        onChange={onChangeMock}
-        onClose={onCloseMock}
-        onOpen={onOpenMock}
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-      />
-    );
-  });
-
-  it('Should renders', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('Should open modal with picker on click', () => {
-    component.find('input').simulate('click');
-
-    expect(component.find('WithStyles(ForwardRef(Popover))').props().open).toBeTruthy();
-    expect(onOpenMock).toHaveBeenCalled();
-  });
-
-  it('Should close on popover close request', () => {
-    const popoverOnClose = component
-      .find('WithStyles(ForwardRef(Popover))')
-      .prop('onClose') as () => void;
-
-    popoverOnClose();
-
-    expect(component.find('WithStyles(ForwardRef(Popover))').prop('open')).toBeFalsy();
-    expect(onCloseMock).toHaveBeenCalled();
-  });
-
-  it('Should dispatch onChange and close on day select', () => {
-    component.find('input').simulate('click');
-    component
-      .find('Day button')
-      .at(10)
-      .simulate('click');
-
-    expect(onChangeMock).toHaveBeenCalled();
-    expect(component.find('WithStyles(ForwardRef(Popover))').props().open).toBeFalsy();
-  });
-});
-
-describe('e2e - DatePicker without month change', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    component = mount(<DatePicker open onChange={onChangeMock} value={date} />);
-  });
-
-  it('Should not add to loading queue if callback is undefined', () => {
-    component
-      .find('CalendarHeader button')
-      .first()
-      .simulate('click');
-    expect(
-      component
-        .find('Calendar')
-        .first()
-        .state('loadingQueue')
-    ).toEqual(0);
-  });
-});
-
-describe('e2e - DatePicker month change sync', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-  const onMonthChangeMock = jest.fn();
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker open onChange={onChangeMock} onMonthChange={onMonthChangeMock} value={date} />
-    );
-  });
-
-  it('Should not add to loading queue when synchronous', () => {
-    component
-      .find('CalendarHeader button')
-      .first()
-      .simulate('click');
-    expect(
-      component
-        .find('Calendar')
-        .first()
-        .state('loadingQueue')
-    ).toEqual(0);
-  });
-});
-
-describe('e2e - DatePicker month change async', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-
-  const sleep = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
-  const promise = sleep(50);
-  const onMonthChangeAsyncMock = jest.fn(async () => {
-    await promise;
-  });
-
-  const date = utilsToUse.date('2018-01-01T00:00:00.000Z');
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker
-        open
-        onChange={onChangeMock}
-        onMonthChange={onMonthChangeAsyncMock}
-        value={date}
-      />
-    );
-  });
-
-  it('Should add to loading queue when loading asynchronous data', () => {
-    component
-      .find('CalendarHeader button')
-      .first()
-      .simulate('click');
-
-    expect(
-      component
-        .find('Calendar')
-        .first()
-        .state('loadingQueue')
-    ).toEqual(1);
-  });
-
-  it('Should empty loading queue after loading asynchronous data', async () => {
-    component
-      .find('CalendarHeader button')
-      .first()
-      .simulate('click');
-    await sleep(100);
-    expect(
-      component
-        .find('Calendar')
-        .first()
-        .state('loadingQueue')
-    ).toEqual(0);
-  });
-});
-
-test('Custom toolbar component', () => {
-  const component = mount(
-    <DatePicker
-      open
-      value={new Date()}
-      onChange={jest.fn()}
-      ToolbarComponent={() => <div id="custom-toolbar" />}
-    />
-  );
-
-  expect(component.find('#custom-toolbar').length).toBe(1);
-});

package/src/__tests__/e2e/DatePickerProps.test.tsx

@@ -1,18 +0,0 @@
-import * as React from 'react';
-import { mount, utilsToUse } from '../test-utils';
-import { DatePicker } from '../../DatePicker/DatePicker';
-
-describe('DatePicker - different props', () => {
-  it('Should not render toolbar if onlyCalendar = true', () => {
-    const component = mount(
-      <DatePicker
-        open
-        disableToolbar
-        onChange={jest.fn()}
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-      />
-    );
-
-    expect(component.find('WithStyles(PickerToolbar)').length).toBe(0);
-  });
-});

package/src/__tests__/e2e/DatePickerRoot.test.tsx

@@ -1,154 +0,0 @@
-import * as React from 'react';
-import { ReactWrapper } from 'enzyme';
-import { clickOKButton } from './commands';
-import { mount, utilsToUse } from '../test-utils';
-import { DatePicker, DatePickerProps } from '../../DatePicker';
-
-describe('e2e - DatePicker', () => {
-  let component: ReactWrapper<DatePickerProps>;
-  const onChangeMock = jest.fn();
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    component = mount(
-      <DatePicker
-        open
-        autoOk
-        openTo="date"
-        animateYearScrolling={false}
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-        onChange={onChangeMock}
-      />
-    );
-  });
-
-  it('Should renders', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('Should render proper count of days', () => {
-    expect(component.find('Day').length).toBe(35);
-  });
-
-  it('Should dispatch onChange on day click', () => {
-    component
-      .find('Day button')
-      .at(2)
-      .simulate('click');
-    expect(onChangeMock).toHaveBeenCalled();
-  });
-
-  it('Should render year selection', () => {
-    component
-      .find('ToolbarButton')
-      .first()
-      .simulate('click');
-
-    expect(component.find('Year').length).toBe(201);
-
-    component
-      .find('Year')
-      .at(1)
-      .simulate('click');
-
-    clickOKButton(component);
-    expect(onChangeMock).toHaveBeenCalled();
-  });
-});
-
-describe('e2e -- DatePicker views year', () => {
-  const onChangeMock = jest.fn();
-  const onYearChangeMock = jest.fn();
-
-  let component: ReactWrapper<DatePickerProps>;
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker
-        open
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-        onChange={onChangeMock}
-        onYearChange={onYearChangeMock}
-        views={['year']}
-      />
-    );
-  });
-
-  it('Should render year selection and select year', () => {
-    expect(component.find('Year').length).toBe(201);
-
-    component
-      .find('Year')
-      .at(1)
-      .simulate('click');
-
-    clickOKButton(component);
-    expect(onYearChangeMock).toHaveBeenCalled();
-  });
-});
-
-describe('e2e -- DatePicker views year and month', () => {
-  const onChangeMock = jest.fn();
-  const onMonthChangeMock = jest.fn();
-
-  let component: ReactWrapper<DatePickerProps>;
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker
-        open
-        autoOk
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-        onChange={onChangeMock}
-        onMonthChange={onMonthChangeMock}
-        openTo="month"
-        views={['year', 'month']}
-      />
-    );
-  });
-
-  it('Should select month', () => {
-    expect(component.find('Month').length).toBe(12);
-    component
-      .find('Month')
-      .first()
-      .simulate('click');
-
-    expect(onMonthChangeMock).toHaveBeenCalled();
-  });
-
-  it('Should switch to year selection and back to month', () => {
-    component
-      .find('ToolbarButton')
-      .first()
-      .simulate('click');
-
-    const year = component.find('Year');
-    expect(component.find('Year').length).toBe(201);
-
-    year.first().simulate('click');
-    expect(component.find('Month').length).toBe(12);
-  });
-});
-
-describe('e2e -- DatePicker views year and month open from year', () => {
-  const onChangeMock = jest.fn();
-  let component: ReactWrapper<DatePickerProps>;
-
-  beforeEach(() => {
-    component = mount(
-      <DatePicker
-        open
-        autoOk
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-        onChange={onChangeMock}
-        views={['year', 'month']}
-        openTo="year"
-      />
-    );
-  });
-
-  it('Should render year selection', () => {
-    expect(component.find('Year').length).toBe(201);
-  });
-});

package/src/__tests__/e2e/DateTimePicker.test.tsx

@@ -1,86 +0,0 @@
-import * as React from 'react';
-import { ReactWrapper } from 'enzyme';
-import { mount, utilsToUse } from '../test-utils';
-import { DateTimePicker, DateTimePickerProps } from '../../DateTimePicker/DateTimePicker';
-
-const format = process.env.UTILS === 'moment' ? 'MM/DD/YYYY HH:mm' : 'MM/dd/yyyy hh:mm';
-
-describe('e2e - DateTimePicker', () => {
-  let component: ReactWrapper<DateTimePickerProps>;
-
-  const onCloseMock = jest.fn();
-  const onChangeMock = jest.fn();
-
-  beforeEach(() => {
-    component = mount(
-      <DateTimePicker
-        clearable
-        format={format}
-        onClose={onCloseMock}
-        onChange={onChangeMock}
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-      />
-    );
-  });
-
-  it('Should renders', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('Should open modal with picker on click', () => {
-    component.find('input').simulate('click');
-    expect(component.find('WithStyles(ForwardRef(Dialog))').prop('open')).toBeTruthy();
-  });
-
-  it('Should update state when passing new value from outside', () => {
-    component.setProps({ value: '2018-01-01T00:00:00.000Z' });
-    component.update(); // make additional react tick to update text field
-
-    const expectedString = utilsToUse.format(utilsToUse.date('2018-01-01T00:00:00.000Z'), format);
-    expect(component.find('input').props().value).toBe(expectedString);
-  });
-
-  it('Should change internal state on update', () => {
-    component.find('input').simulate('click');
-    component
-      .find('Day button')
-      .at(3)
-      .simulate('click');
-
-    expect(
-      component
-        .find('ToolbarButton')
-        .at(0)
-        .text()
-    ).toBe('2018');
-    // expect(component.find('ToolbarButton').at(1).text()).toBe('Jan 3');
-  });
-});
-
-describe('e2e -- Controlling open state', () => {
-  let component: ReactWrapper<DateTimePickerProps>;
-  const onCloseMock = jest.fn();
-
-  beforeEach(() => {
-    component = mount(
-      <DateTimePicker
-        open
-        onClose={onCloseMock}
-        onChange={jest.fn()}
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-      />
-    );
-  });
-
-  it('Should be opened', () => {
-    expect(component.find('WithStyles(ForwardRef(Dialog))').prop('open')).toBeTruthy();
-  });
-
-  it('Should close', () => {
-    component
-      .find('ForwardRef(DialogActions) button')
-      .at(0)
-      .simulate('click');
-    expect(onCloseMock).toHaveBeenCalled();
-  });
-});

package/src/__tests__/e2e/DateTimePickerRoot.test.tsx

@@ -1,72 +0,0 @@
-import * as React from 'react';
-import { ReactWrapper } from 'enzyme';
-import { clickOKButton } from './commands';
-import { mount, utilsToUse, toHaveBeenCalledExceptMoment } from '../test-utils';
-import { DateTimePicker, DateTimePickerProps } from '../../DateTimePicker/DateTimePicker';
-
-describe('e2e - DateTimePicker', () => {
-  let component: ReactWrapper<DateTimePickerProps>;
-  const onChangeMock = jest.fn();
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    component = mount(
-      <DateTimePicker
-        open
-        value={utilsToUse.date('2018-01-01T00:00:00.000Z')}
-        onChange={onChangeMock}
-        openTo="hours"
-        leftArrowIcon="keyboard_arrow_left"
-        rightArrowIcon="keyboard_arrow_right"
-        dateRangeIcon="date_range"
-        timeIcon="access_time"
-      />
-    );
-  });
-
-  it('Should renders', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('Should display year view', () => {
-    component
-      .find('ToolbarButton')
-      .first()
-      .simulate('click');
-
-    expect(component.find('Year').length).toBe(201);
-    component
-      .find('Year')
-      .at(1)
-      .simulate('click');
-
-    clickOKButton(component);
-    expect(onChangeMock).toHaveBeenCalled();
-  });
-
-  it('Should render hour view', () => {
-    component
-      .find('ToolbarButton')
-      .at(2)
-      .simulate('click');
-    expect(component.find('TimePickerView').props().type).toBe('hours');
-  });
-
-  it('Should render minutes view', () => {
-    component
-      .find('ToolbarButton')
-      .at(3)
-      .simulate('click');
-    expect(component.find('TimePickerView').props().type).toBe('minutes');
-  });
-
-  it('Should change meridiem', () => {
-    component
-      .find('ToolbarButton')
-      .at(5)
-      .simulate('click');
-
-    clickOKButton(component);
-    toHaveBeenCalledExceptMoment(onChangeMock, [utilsToUse.date('2018-01-01T12:00:00.000Z')]);
-  });
-});