Skip to content

Commit

Permalink
fixed breaking changes
Browse files Browse the repository at this point in the history
  • Loading branch information
anishagg17 committed Mar 13, 2020
1 parent 1457a41 commit 97b56e6
Show file tree
Hide file tree
Showing 12 changed files with 121 additions and 121 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
## [`master`](https://github.com/elastic/eui/tree/master)

- Replaced various `lodash` functions with native functions ([#3053](https://github.com/elastic/eui/pull/3053))
- Exported `dateFormatAliases` as a part of the public API ([#3043](https://github.com/elastic/eui/pull/3043))
- Exported `EuiTextProps` type definition ([#3039](https://github.com/elastic/eui/pull/3039))
- Removed `role` attribute from `EuiImage`([#3036](https://github.com/elastic/eui/pull/3036))
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import React from "react";
import DatePicker from "react-datepicker";
import moment from "moment";
import range from "lodash/range";
import React from 'react';
import DatePicker from 'react-datepicker';
import moment from 'moment';

const range = (start, end, step) =>
Array.from({ length: (end - start) / step }, (_, i) => i * step + start);

const years = range(1990, moment().year() + 1, 1);
const months = moment.months();
Expand All @@ -10,13 +12,13 @@ export default class Default extends React.Component {
constructor(props) {
super(props);
this.state = {
startDate: moment()
startDate: moment(),
};
}

handleChange = date => {
this.setState({
startDate: date
startDate: date,
});
};

Expand Down Expand Up @@ -51,25 +53,22 @@ export default class Default extends React.Component {
decreaseMonth,
increaseMonth,
prevMonthButtonDisabled,
nextMonthButtonDisabled
nextMonthButtonDisabled,
}) => (
<div
style={{
margin: 10,
display: "flex",
justifyContent: "center"
}}
>
display: 'flex',
justifyContent: 'center',
}}>
<button
onClick={decreaseMonth}
disabled={prevMonthButtonDisabled}
>
{"<"}
disabled={prevMonthButtonDisabled}>
{'<'}
</button>
<select
value={date.year()}
onChange={({ target: { value } }) => changeYear(value)}
>
onChange={({ target: { value } }) => changeYear(value)}>
{years.map(option => (
<option key={option} value={option}>
{option}
Expand All @@ -79,8 +78,7 @@ export default class Default extends React.Component {

<select
value={months[date.month()]}
onChange={({ target: { value } }) => changeMonth(value)}
>
onChange={({ target: { value } }) => changeMonth(value)}>
{months.map(option => (
<option key={option} value={option}>
{option}
Expand All @@ -90,9 +88,8 @@ export default class Default extends React.Component {

<button
onClick={increaseMonth}
disabled={nextMonthButtonDisabled}
>
{">"}
disabled={nextMonthButtonDisabled}>
{'>'}
</button>
</div>
)}
Expand Down
7 changes: 4 additions & 3 deletions packages/react-datepicker/test/month_dropdown_test.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React from "react";
import range from "lodash/range";
import MonthDropdown from "../src/month_dropdown.jsx";
import MonthDropdownOptions from "../src/month_dropdown_options.jsx";
import { mount } from "enzyme";
Expand All @@ -9,10 +8,12 @@ import {
getDefaultLocaleData
} from "../src/date_utils";

const range = length => Array.from({ length }, (_, i) => i);

describe("MonthDropdown", () => {
let monthDropdown;
let handleChangeResult;
const mockHandleChange = function(changeInput) {
const mockHandleChange = function (changeInput) {
handleChangeResult = changeInput;
};
let sandbox;
Expand Down Expand Up @@ -40,7 +41,7 @@ describe("MonthDropdown", () => {
});

describe("scroll mode", () => {
beforeEach(function() {
beforeEach(function () {
monthDropdown = getMonthDropdown();
});

Expand Down
71 changes: 36 additions & 35 deletions packages/react-datepicker/test/month_test.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import React from "react";
import Month from "../src/month";
import Day from "../src/day";
import range from "lodash/range";
import { mount, shallow } from "enzyme";
import * as utils from "../src/date_utils";
import TestUtils from "react-dom/test-utils";

describe("Month", () => {
import React from 'react';
import Month from '../src/month';
import Day from '../src/day';
import { mount, shallow } from 'enzyme';
import * as utils from '../src/date_utils';
import TestUtils from 'react-dom/test-utils';

const range = length => Array.from({ length }, (_, i) => i);

describe('Month', () => {
function assertDateRangeInclusive(month, start, end) {
const dayCount = utils.getDaysDiff(end, start) + 1;
const days = month.find(Day);
Expand All @@ -16,32 +17,32 @@ describe("Month", () => {
const expectedDay = utils.addDays(utils.cloneDate(start), offset);
assert(
utils.isSameDay(day.props.day, expectedDay),
`Day ${offset % 7 + 1} ` +
`Day ${(offset % 7) + 1} ` +
`of week ${Math.floor(offset / 7) + 1} ` +
`should be "${utils.formatDate(expectedDay, "YYYY-MM-DD")}" ` +
`but it is "${utils.formatDate(day.props.day, "YYYY-MM-DD")}"`
`should be "${utils.formatDate(expectedDay, 'YYYY-MM-DD')}" ` +
`but it is "${utils.formatDate(day.props.day, 'YYYY-MM-DD')}"`
);
});
}

it("should have the month CSS class", () => {
it('should have the month CSS class', () => {
const month = shallow(<Month day={utils.newDate()} />);
expect(month.hasClass("react-datepicker__month")).to.equal(true);
expect(month.hasClass('react-datepicker__month')).to.equal(true);
});

it("should have the month aria-label", () => {
it('should have the month aria-label', () => {
const month = TestUtils.renderIntoDocument(
<Month day={utils.newDate("2015-12-01")} />
<Month day={utils.newDate('2015-12-01')} />
);
const month_dom = TestUtils.findRenderedDOMComponentWithClass(
month,
"react-datepicker__month"
'react-datepicker__month'
);
expect(month_dom.getAttribute("aria-label")).to.equal("month-2015-12");
expect(month_dom.getAttribute('aria-label')).to.equal('month-2015-12');
});

it("should render all days of the month and some days in neighboring months", () => {
const monthStart = utils.newDate("2015-12-01");
it('should render all days of the month and some days in neighboring months', () => {
const monthStart = utils.newDate('2015-12-01');

assertDateRangeInclusive(
mount(<Month day={monthStart} />),
Expand All @@ -50,8 +51,8 @@ describe("Month", () => {
);
});

it("should render all days of the month and peek into the next month", () => {
const monthStart = utils.newDate("2015-12-01");
it('should render all days of the month and peek into the next month', () => {
const monthStart = utils.newDate('2015-12-01');

assertDateRangeInclusive(
mount(<Month day={monthStart} peekNextMonth />),
Expand All @@ -62,8 +63,8 @@ describe("Month", () => {
);
});

it("should render a calendar of fixed height", () => {
const monthStart = utils.newDate("2016-11-01");
it('should render a calendar of fixed height', () => {
const monthStart = utils.newDate('2016-11-01');
const calendarStart = utils.getStartOfWeek(utils.cloneDate(monthStart));

assertDateRangeInclusive(
Expand All @@ -73,8 +74,8 @@ describe("Month", () => {
);
});

it("should render a calendar of fixed height with peeking", () => {
const monthStart = utils.newDate("2016-11-01");
it('should render a calendar of fixed height with peeking', () => {
const monthStart = utils.newDate('2016-11-01');
const calendarStart = utils.getStartOfWeek(utils.cloneDate(monthStart));

assertDateRangeInclusive(
Expand All @@ -84,22 +85,22 @@ describe("Month", () => {
);
});

it("should call the provided onDayClick function", () => {
it('should call the provided onDayClick function', () => {
let dayClicked = null;

function onDayClick(day) {
dayClicked = day;
}

const monthStart = utils.newDate("2015-12-01");
const monthStart = utils.newDate('2015-12-01');
const month = mount(<Month day={monthStart} onDayClick={onDayClick} />);
const day = month.find(Day).at(0);

day.simulate("click");
assert(utils.isSameDay(day.prop("day"), dayClicked));
day.simulate('click');
assert(utils.isSameDay(day.prop('day'), dayClicked));
});

it("should call the provided onMouseLeave function", () => {
it('should call the provided onMouseLeave function', () => {
let mouseLeaveCalled = false;

function onMouseLeave() {
Expand All @@ -109,11 +110,11 @@ describe("Month", () => {
const month = shallow(
<Month day={utils.newDate()} onMouseLeave={onMouseLeave} />
);
month.simulate("mouseleave");
month.simulate('mouseleave');
expect(mouseLeaveCalled).to.be.true;
});

it("should call the provided onDayMouseEnter function", () => {
it('should call the provided onDayMouseEnter function', () => {
let dayMouseEntered = null;

function onDayMouseEnter(day) {
Expand All @@ -124,7 +125,7 @@ describe("Month", () => {
<Month day={utils.newDate()} onDayMouseEnter={onDayMouseEnter} />
);
const day = month.find(Day).first();
day.simulate("mouseenter");
assert(utils.isSameDay(day.prop("day"), dayMouseEntered));
day.simulate('mouseenter');
assert(utils.isSameDay(day.prop('day'), dayMouseEntered));
});
});
Loading

0 comments on commit 97b56e6

Please sign in to comment.