Web: Components: fixed calendar locale and theme color props, add new tests

web/ASC.Web.Components/src/components/calendar-new/calendar.test.js

@@ -58,6 +58,11 @@ const baseDayProps = {
   size: "base"
 };
 
+const selectedDate = new Date("09/12/2019");
+const openToDate = new Date("09/12/2019");
+const minDate = new Date("01/01/1970");
+const maxDate = new Date("01/01/2020");
+
 describe("Weekdays tests:", () => {
   it("Weekdays renders without error", () => {
     const wrapper = mount(<Weekdays {...baseWeekdaysProps} />);
@@ -127,13 +132,11 @@ describe("Calendar tests:", () => {
     expect(wrapper).toExist();
   });
 
-  /*
   it("Calendar has rendered content.", () => {
     const wrapper = mount(<NewCalendar {...baseCalendarProps} />);
-    //expect(wrapper.find('span')).toExist();
+    expect(wrapper.find("div")).toExist();
     expect(wrapper.find("ul")).not.toExist();
   });
-*/
 
   it("Calendar not re-render test", () => {
     const wrapper = shallow(<NewCalendar {...baseCalendarProps} />).instance();
@@ -144,6 +147,48 @@ describe("Calendar tests:", () => {
     expect(shouldUpdate).toBe(false);
   });
 
+  it("Calendar selectedDate test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} selectedDate={selectedDate} />
+    );
+    expect(wrapper.props().selectedDate).toEqual(selectedDate);
+  });
+
+  it("Calendar openToDate test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} openToDate={openToDate} />
+    );
+    expect(wrapper.props().openToDate).toEqual(openToDate);
+  });
+
+  it("Calendar minDate test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} minDate={minDate} />
+    );
+    expect(wrapper.props().minDate).toEqual(minDate);
+  });
+
+  it("Calendar maxDate test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} maxDate={maxDate} />
+    );
+    expect(wrapper.props().maxDate).toEqual(maxDate);
+  });
+
+  it("Calendar themeColor test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} themeColor={"#fff"} />
+    );
+    expect(wrapper.props().themeColor).toEqual("#fff");
+  });
+
+  it("Calendar locale test", () => {
+    const wrapper = mount(
+      <NewCalendar {...baseCalendarProps} locale={"en-GB"} />
+    );
+    expect(wrapper.prop("locale")).toEqual("en-GB");
+  });
+
   it("Calendar disabled when isDisabled is passed", () => {
     const wrapper = mount(
       <NewCalendar {...baseCalendarProps} isDisabled={true} />

web/ASC.Web.Components/src/components/calendar-new/index.js

@@ -600,7 +600,9 @@ class Calendar extends Component {
       openToDate,
       minDate,
       maxDate,
-      isDisabled
+      isDisabled,
+      locale,
+      themeColor
     } = this.props;
 
     const { hasError, optionsDays } = this.state;
@@ -612,7 +614,9 @@ class Calendar extends Component {
       this.compareDates(maxDate, nextProps.maxDate) === 0 &&
       isDisabled === nextProps.isDisabled &&
       hasError === nextState.hasError &&
-      optionsDays === nextState.optionsDays
+      optionsDays === nextState.optionsDays &&
+      locale === nextProps.locale &&
+      themeColor === nextProps.themeColor
     ) {
       return false;
     }

web/ASC.Web.Components/src/components/date-picker/date-picker.test.js

@@ -1,20 +1,82 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import DatePicker from '.';
-
-describe('<DatePicker />', () => {
-  it('renders without error', () => {
-    const wrapper = mount(
-      <DatePicker
-        onChange={date => {
-          console.log('Selected date', date);
-        }}
-        selectedDate={new Date()}
-        minDate={new Date("1970/01/01")}
-        maxDate={new Date(new Date().getFullYear() + 1 + "/01/01")}
-      />
-    );
+import React from "react";
+import { mount, shallow } from "enzyme";
+import DatePicker from "./";
+import moment from "moment";
 
+const selectedDate = new Date("09/12/2019");
+const minDate = new Date("01/01/1970");
+const maxDate = new Date("01/01/2020");
+describe("DatePicker tests", () => {
+  it("DatePicker renders without error", () => {
+    const wrapper = mount(<DatePicker />);
     expect(wrapper).toExist();
   });
+
+  it("DatePicker disabled when isDisabled is passed", () => {
+    const wrapper = mount(<DatePicker isDisabled={true} />);
+    expect(wrapper.prop("isDisabled")).toEqual(true);
+  });
+
+  it("DatePicker opened when inOpen is passed", () => {
+    const wrapper = mount(<DatePicker inOpen={true} />);
+    expect(wrapper.prop("inOpen")).toEqual(true);
+  });
+
+  it("DatePicker hasError is passed", () => {
+    const wrapper = mount(<DatePicker hasError={true} />);
+    expect(wrapper.prop("hasError")).toEqual(true);
+  });
+
+  it("DatePicker disabled when isReadOnly is passed", () => {
+    const wrapper = mount(<DatePicker isReadOnly={true} />);
+    expect(wrapper.prop("isReadOnly")).toEqual(true);
+  });
+
+  it("DatePicker minDate test", () => {
+    const wrapper = mount(<DatePicker minDate={minDate} />);
+    expect(wrapper.props().minDate).toEqual(minDate);
+  });
+
+  it("DatePicker maxDate test", () => {
+    const wrapper = mount(<DatePicker maxDate={maxDate} />);
+    expect(wrapper.props().maxDate).toEqual(maxDate);
+  });
+
+  it("DatePicker selectedDate test", () => {
+    const wrapper = mount(<DatePicker selectedDate={selectedDate} />);
+    expect(wrapper.props().selectedDate).toEqual(selectedDate);
+  });
+
+  it("DatePicker locale test", () => {
+    const wrapper = mount(<DatePicker locale={"en-GB"} />);
+    expect(wrapper.prop("locale")).toEqual("en-GB");
+  });
+
+  it("DatePicker themeColor test", () => {
+    const wrapper = mount(<DatePicker themeColor={"#fff"} />);
+    expect(wrapper.props().themeColor).toEqual("#fff");
+  });
+
+  it("DatePicker call onChange when changing value", () => {
+    const onChange = jest.fn(event => {
+      expect(event.target.value).toEqual("03/03/2000");
+    });
+    const event = { target: { value: moment("2000-03-03") } };
+    const wrapper = mount(<DatePicker onChange={onChange} />);
+    wrapper.simulate("change", event);
+  });
+
+  it("DatePicker test click event", () => {
+    const onClick = jest.fn(event => {
+      expect(event.inOpen).toEqual(true);
+    });
+    const wrapper = shallow(<DatePicker onClick={onClick} />);
+    wrapper.simulate("click");
+  });
+
+  it("DatePicker onFocus test", () => {
+    const onFocus = jest.fn;
+    const wrapper = mount(<DatePicker onFocus={onFocus} />);
+    wrapper.simulate("focus");
+  });
 });