From 0f914e59e2e79170419f7fd324de8b2def24312b Mon Sep 17 00:00:00 2001 From: Aswin M Prabhu Date: Wed, 20 Mar 2019 22:52:27 +0530 Subject: [PATCH 1/7] feat: Add a testing framework --- jest.config.js | 10 + mocks/fileMock.js | 1 + package.json | 10 +- src/App.test.tsx | 9 - .../FixMeNavbar/FixMeNavbar.test.tsx | 9 + src/components/FixMeNavbar/FixMeNavbar.tsx | 15 +- src/setupTests.ts | 4 + yarn.lock | 1517 ++++++++++++++++- 8 files changed, 1526 insertions(+), 49 deletions(-) create mode 100644 jest.config.js create mode 100644 mocks/fileMock.js delete mode 100644 src/App.test.tsx create mode 100644 src/components/FixMeNavbar/FixMeNavbar.test.tsx create mode 100644 src/setupTests.ts diff --git a/jest.config.js b/jest.config.js new file mode 100644 index 0000000..55febc7 --- /dev/null +++ b/jest.config.js @@ -0,0 +1,10 @@ +module.exports = { + preset: "ts-jest", + testEnvironment: "node", + setupFiles: ["./src/setupTests.ts"], + moduleNameMapper: { + "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": + "/mocks/fileMock.js", + "\\.(css|less)$": "/mocks/fileMock.js" + } +}; diff --git a/mocks/fileMock.js b/mocks/fileMock.js new file mode 100644 index 0000000..38b08af --- /dev/null +++ b/mocks/fileMock.js @@ -0,0 +1 @@ +module.exports = ""; diff --git a/package.json b/package.json index 5971031..052ab7b 100644 --- a/package.json +++ b/package.json @@ -64,11 +64,19 @@ "utility-types": "^3.4.1" }, "devDependencies": { + "@types/enzyme": "^3.9.1", + "@types/enzyme-adapter-react-16": "^1.0.5", + "enzyme": "^3.9.0", + "enzyme-adapter-react-16": "^1.11.2", "husky": "^1.3.1", + "jest": "^24.5.0", + "jest-dom": "^3.1.3", "lint-staged": "^8.1.5", + "react-testing-library": "^6.0.1", "stylelint": "^9.10.1", "stylelint-config-recommended-scss": "^3.2.0", - "stylelint-scss": "^3.5.4" + "stylelint-scss": "^3.5.4", + "ts-jest": "^24.0.0" }, "husky": { "hooks": { diff --git a/src/App.test.tsx b/src/App.test.tsx deleted file mode 100644 index 23c181f..0000000 --- a/src/App.test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from "react"; -import ReactDOM from "react-dom"; -import App from "./App"; - -it("renders without crashing", () => { - const div = document.createElement("div"); - ReactDOM.render(, div); - ReactDOM.unmountComponentAtNode(div); -}); diff --git a/src/components/FixMeNavbar/FixMeNavbar.test.tsx b/src/components/FixMeNavbar/FixMeNavbar.test.tsx new file mode 100644 index 0000000..301037c --- /dev/null +++ b/src/components/FixMeNavbar/FixMeNavbar.test.tsx @@ -0,0 +1,9 @@ +import { shallow } from "enzyme"; +import React from "react"; +import FixmeNavbar from "./FixMeNavbar"; + +describe("", () => { + it("renders without errors", () => { + shallow(); + }); +}); diff --git a/src/components/FixMeNavbar/FixMeNavbar.tsx b/src/components/FixMeNavbar/FixMeNavbar.tsx index 47217e7..cb19432 100644 --- a/src/components/FixMeNavbar/FixMeNavbar.tsx +++ b/src/components/FixMeNavbar/FixMeNavbar.tsx @@ -1,6 +1,6 @@ import React from "react"; import { OutboundLink } from "react-ga"; -import { FaFacebook, FaGithub, FaTwitter } from 'react-icons/fa'; +import { FaFacebook, FaGithub, FaTwitter } from "react-icons/fa"; import { NavLink } from "react-router-dom"; import { Collapse, Nav, Navbar, NavbarToggler, NavItem } from "reactstrap"; import Logo from "./logo-fixme.svg"; @@ -12,7 +12,7 @@ export interface IFixMeNavbarState { export default class FixMeNavbar extends React.Component< { white?: boolean }, IFixMeNavbarState - > { +> { public readonly state = { isOpen: false }; @@ -30,11 +30,18 @@ export default class FixMeNavbar extends React.Component< FixMe - +