Migrate enzyme tests to testing-library

package.json

@@ -19,7 +19,7 @@
     "src/index.d.ts"
   ],
   "scripts": {
-    "lint": "eslint ./src ./examples",
+    "lint": "eslint ./src ./tests ./examples",
     "test": "yarn lint && yarn test:only",
     "test:only": "jest --no-cache --verbose --coverage",
     "test:dev": "jest --watchAll --no-cache --verbose --coverage",

tests/actions.test.js

@@ -6,12 +6,12 @@ let eventObj = {};
 
 describe('actions test', () => {
     beforeAll(() => {
-        showCallback = jest.fn(e => {
+        showCallback = jest.fn((e) => {
             eventObj = e;
         });
         window.addEventListener(MENU_SHOW, showCallback);
 
-        hideCallback = jest.fn(e => {
+        hideCallback = jest.fn((e) => {
             eventObj = e;
         });
         window.addEventListener(MENU_HIDE, hideCallback);

tests/sub-menu-test.js

@@ -1,51 +1,51 @@
-"use strict";
 
-import React from "react";
-import { shallow, mount } from "enzyme";
-import { expect } from "chai";
 
-import SubMenu from "../src/submenu";
+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import { expect } from 'chai';
 
-describe("<SubMenu/>", () => {
-    it("should have `react-context-menu-item` & `submenu` classes", () => {
-        const wrapper = shallow(<SubMenu title="foo"/>);
+import SubMenu from '../src/submenu';
 
-        expect(wrapper).to.have.className("react-context-menu-item");
-        expect(wrapper).to.have.className("submenu");
+describe('<SubMenu/>', () => {
+    it('should have `react-context-menu-item` & `submenu` classes', () => {
+        const wrapper = shallow(<SubMenu title='foo' />);
+
+        expect(wrapper).to.have.className('react-context-menu-item');
+        expect(wrapper).to.have.className('submenu');
     });
 
-    it("<a/> should have `react-context-menu-link` class", () => {
-        const wrapper = shallow(<SubMenu title="foo"/>);
+    it('<a/> should have `react-context-menu-link` class', () => {
+        const wrapper = shallow(<SubMenu title='foo' />);
 
-        expect(wrapper.find("a")).to.have.className("react-context-menu-link");
-        expect(wrapper.find("a")).to.not.have.className("disabled");
+        expect(wrapper.find('a')).to.have.className('react-context-menu-link');
+        expect(wrapper.find('a')).to.not.have.className('disabled');
     });
 
-    it("<a/> should have `disabled` class when disabled", () => {
-        const wrapper = shallow(<SubMenu title="foo" disabled/>);
+    it('<a/> should have `disabled` class when disabled', () => {
+        const wrapper = shallow(<SubMenu title='foo' disabled />);
 
-        expect(wrapper.find("a")).to.have.className("react-context-menu-link");
-        expect(wrapper.find("a")).to.have.className("disabled");
+        expect(wrapper.find('a')).to.have.className('react-context-menu-link');
+        expect(wrapper.find('a')).to.have.className('disabled');
     });
 
-    it("should render `title` inside `<a/>`", () => {
-        const title = Math.random().toString(36),
-            wrapper = shallow(<SubMenu title={title} disabled/>);
+    it('should render `title` inside `<a/>`', () => {
+        const title = Math.random().toString(36);
+        const wrapper = shallow(<SubMenu title={title} disabled />);
 
-        expect(wrapper.find("a")).to.have.text(title);
+        expect(wrapper.find('a')).to.have.text(title);
     });
 
-    xit("should open submenu `onMouseEnter`", function() {
-        const wrapper = mount(<SubMenu title="foo" hoverDelay={0}/>);
+    xit('should open submenu `onMouseEnter`', function () {
+        const wrapper = mount(<SubMenu title='foo' hoverDelay={0} />);
 
-        wrapper.find(".submenu").simulate("mouseEnter");
-        expect(wrapper).to.have.state("visible", true);
+        wrapper.find('.submenu').simulate('mouseEnter');
+        expect(wrapper).to.have.state('visible', true);
     });
 
-    xit("should not open submenu `onMouseEnter` when disabled", function() {
-        const wrapper = mount(<SubMenu title="foo" hoverDelay={0} disabled/>);
+    xit('should not open submenu `onMouseEnter` when disabled', function () {
+        const wrapper = mount(<SubMenu title='foo' hoverDelay={0} disabled />);
 
-        wrapper.simulate("mouseenter");
-        expect(wrapper).to.have.state("visible", false);
+        wrapper.simulate('mouseenter');
+        expect(wrapper).to.have.state('visible', false);
     });
 });

tests/sub-menu-wrapper-test.js

@@ -1,29 +1,29 @@
-"use strict";
 
-import React from "react";
-import { shallow, mount } from "enzyme";
+
+import React from 'react';
+import { shallow, mount } from 'enzyme';
 // import sinon from "sinon";
-import { expect } from "chai";
+import { expect } from 'chai';
 
-import SubMenuWrapper from "../src/submenu/wrapper";
+import SubMenuWrapper from '../src/submenu/wrapper';
 // import monitor from "../src/monitor";
 
-describe("<SubMenuWrapper/>", () => {
-    it("should have `react-context-menu` class", () => {
-        const wrapper = shallow(<SubMenuWrapper/>);
+describe('<SubMenuWrapper/>', () => {
+    it('should have `react-context-menu` class', () => {
+        const wrapper = shallow(<SubMenuWrapper />);
 
-        expect(wrapper.hasClass("react-context-menu")).to.equal(true);
+        expect(wrapper.hasClass('react-context-menu')).to.equal(true);
     });
 
-    it("should be invisible by default", () => {
-        const wrapper = mount(<SubMenuWrapper/>);
+    it('should be invisible by default', () => {
+        const wrapper = mount(<SubMenuWrapper />);
 
-        expect(wrapper.find("nav")).to.have.style("display", "none");
+        expect(wrapper.find('nav')).to.have.style('display', 'none');
     });
 
-    it("should be visible when `visible` is passed", () => {
-        const wrapper = mount(<SubMenuWrapper visible/>);
+    it('should be visible when `visible` is passed', () => {
+        const wrapper = mount(<SubMenuWrapper visible />);
 
-        expect(wrapper.find("nav")).to.have.style("display", "block");
+        expect(wrapper.find('nav')).to.have.style('display', 'block');
     });
 });