Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Enzyme deprecation linter to avoid more usage of Enzyme #4346

Closed
wants to merge 1 commit into from
Closed

Add Enzyme deprecation linter to avoid more usage of Enzyme #4346

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion .eslintrc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@

"plugins": [
"react",
"unused-imports"
"unused-imports",
"enzyme-deprecation"
],

"parserOptions": {
Expand All @@ -20,6 +21,8 @@
"parser": "@babel/eslint-parser",

"rules": {
"enzyme-deprecation/no-shallow": 2,
"enzyme-deprecation/no-mount": 2,
"no-unused-vars": "off",
"unused-imports/no-unused-imports": "error",
"unused-imports/no-unused-vars": [
Expand Down
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,7 @@
"css-loader": "^6.8.1",
"enzyme": "^3.11.0",
"eslint": "^8.44.0",
"eslint-plugin-enzyme-deprecation": "^0.7.7",
"eslint-plugin-import": "^2.27.5",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^6.1.0",
Expand Down
5 changes: 3 additions & 2 deletions test/calendar_icon.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@

describe("CalendarIcon", () => {
it("renders a custom SVG icon when provided", () => {
const wrapper = mount(

Check failure on line 16 in test/calendar_icon.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

did you mean to move this one line up?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like somehow prettier is moving things to a new line. Not sure if there's a good workaround for this.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a guess, but I think it's because you are using eslint-disable-line instead of eslint-disable-next-line. Can you try that instead if you want the comment before the line?

Image of Joey G Joey G

<CalendarIcon showIcon icon={<IconParkSolidApplication />} />,
);
expect(
Expand All @@ -22,12 +23,12 @@
});

it("renders a FontAwesome icon when provided", () => {
const wrapper = mount(<CalendarIcon showIcon icon="fa-example-icon" />);
const wrapper = mount(<CalendarIcon showIcon icon="fa-example-icon" />); // eslint-disable-line enzyme-deprecation/no-mount
expect(wrapper.find("i.fa-example-icon")).toHaveLength(1);
});

it("does not render an icon when none is provided", () => {
const wrapper = mount(<CalendarIcon showIcon />);
const wrapper = mount(<CalendarIcon showIcon />); // eslint-disable-line enzyme-deprecation/no-mount
expect(wrapper.find("svg.react-datepicker__calendar-icon")).toHaveLength(1);
});
});
23 changes: 23 additions & 0 deletions test/calendar_test.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@
utils.registerLocale("fi", fi);

function getCalendar(extraProps) {
return shallow(

Check failure on line 29 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use shallow API
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm wondering if this is actually doing anything? According to the eslint docs eslint-disable-line goes next to the line it is disabling: https://eslint.org/docs/latest/use/configure/rules#disabling-rules

Same comment for the rest of the changes in this PR.

🔸 Clarify Intent (Important)

Image of Joey G Joey G

// eslint-disable-line enzyme-deprecation/no-shallow
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -174,7 +175,8 @@
it("should contain the correct class when using the weekDayClassName prop", () => {
const func = (date) => (isSunday(date) ? "sunday" : undefined);

const calendar = mount(

Check failure on line 178 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
dropdownMode="scroll"
Expand Down Expand Up @@ -658,7 +660,8 @@
});

it("should render custom header with show time select", () => {
const calendar = mount(

Check failure on line 663 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
renderCustomHeader={renderCustomHeader}
showTimeSelect
Expand Down Expand Up @@ -859,7 +862,8 @@
});

it("should track the currently hovered day", () => {
const calendar = mount(

Check failure on line 865 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
dropdownMode="scroll"
Expand All @@ -877,7 +881,8 @@
});

it("should clear the hovered day when the mouse leaves", () => {
const calendar = mount(

Check failure on line 884 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
dropdownMode="scroll"
Expand All @@ -894,7 +899,8 @@
});

it("uses weekdaysShort instead of weekdaysMin provided useWeekdaysShort prop is present", () => {
const calendarShort = mount(

Check failure on line 902 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
locale="en"
dateFormat={dateFormat}
Expand All @@ -903,7 +909,8 @@
useWeekdaysShort
/>,
);
const calendarMin = mount(

Check failure on line 912 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
locale="en"
dateFormat={dateFormat}
Expand Down Expand Up @@ -1022,7 +1029,8 @@

beforeEach(() => {
onMonthChangeSpy = jest.fn();
calendar = mount(

Check failure on line 1032 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1065,7 +1073,8 @@

beforeEach(() => {
onYearChangeSpy = jest.fn();
calendar = mount(

Check failure on line 1076 in test/calendar_test.test.js

View workflow job for this annotation

GitHub Actions / update (18.x) 

Enzyme is deprecated: do not use mount API
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1095,6 +1104,7 @@
onYearChangeSpy = jest.fn();
onMonthChangeSpy = jest.fn();
calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1140,6 +1150,7 @@
beforeEach(() => {
onDropdownFocusSpy = jest.fn();
calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1258,6 +1269,7 @@
describe("renderInputTimeSection", () => {
const renderCalendar = (props) =>
mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1287,6 +1299,7 @@
describe("renderYearPicker", () => {
it("should render YearPicker component", () => {
let calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down Expand Up @@ -1359,6 +1372,7 @@

describe("when showMonthYearPicker is enabled", () => {
let calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={DATE_FORMAT}
onSelect={() => {}}
Expand All @@ -1376,6 +1390,7 @@

it("should render custom next and previous labels", () => {
var calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={DATE_FORMAT}
onSelect={() => {}}
Expand Down Expand Up @@ -1424,6 +1439,7 @@

describe("when showQuarterYearPicker is enabled", () => {
let calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={DATE_FORMAT}
onSelect={() => {}}
Expand All @@ -1441,6 +1457,7 @@

it("should render custom next and previous labels", () => {
var calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={DATE_FORMAT}
onSelect={() => {}}
Expand Down Expand Up @@ -1490,6 +1507,7 @@
describe("using click outside", () => {
const clickOutsideSpy = jest.fn();
const calendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={DATE_FORMAT}
onSelect={() => {}}
Expand All @@ -1516,6 +1534,7 @@
it("should have a next-button with the provided aria-label for year", () => {
const ariaLabel = "A label in my native language for next year";
const shallowCalendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
nextYearAriaLabel={ariaLabel}
dateFormat={DATE_FORMAT}
Expand All @@ -1532,6 +1551,7 @@
it("should have a previous-button with the provided aria-label for year", () => {
const ariaLabel = "A label in my native language for previous year";
const shallowCalendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
previousYearAriaLabel={ariaLabel}
dateFormat={DATE_FORMAT}
Expand All @@ -1548,6 +1568,7 @@
it("should have a next-button with the provided aria-label for month", () => {
const ariaLabel = "A label in my native language for next month";
const shallowCalendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
nextMonthAriaLabel={ariaLabel}
dateFormat={DATE_FORMAT}
Expand All @@ -1563,6 +1584,7 @@
it("should have a previous-button with the provided aria-label for month", () => {
const ariaLabel = "A label in my native language for previous month";
const shallowCalendar = mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
previousMonthAriaLabel={ariaLabel}
dateFormat={DATE_FORMAT}
Expand Down Expand Up @@ -1700,6 +1722,7 @@
describe("renderChildren", () => {
const renderCalendar = (props) =>
mount(
// eslint-disable-line enzyme-deprecation/no-mount
<Calendar
dateFormat={dateFormat}
onSelect={() => {}}
Expand Down
Loading
Loading