Commit c769d08e authored by Martin Fahl's avatar Martin Fahl

adds tests

parent aff58867
......@@ -3,9 +3,12 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"react": "^16.4.1",
"react-dom": "^16.4.1",
"react-scripts": "1.1.4"
"react-scripts": "1.1.4",
"react-test-renderer": "^16.4.1"
},
"scripts": {
"start": "react-scripts start",
......@@ -13,4 +16,4 @@
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
\ No newline at end of file
}
......@@ -33,5 +33,5 @@ export class InventoryList extends Component {
}
}
InventoryList.propTypes = {
productList: PropTypes.array
itemList: PropTypes.array
};
import React from "react";
import { InventoryList } from "./InventoryList";
import renderer from "react-test-renderer";
import { shallow } from "enzyme";
jest.mock("../../presentational/Filter/Filter", () => ({
Filter: () => <div name="Filter" />
}));
jest.mock("../Item/Item", () => ({
Item: () => <div name="Item" />
}));
describe("InventoryList", () => {
it("should render as expected", () => {
const itemList = ["just", "a", "test"];
const inventoryListComponent = renderer
.create(<InventoryList itemList={itemList} />)
.toJSON();
expect(inventoryListComponent).toMatchSnapshot();
});
it("should hold a filter in state. Initial with value === ''", () => {
const itemList = ["just", "a", "test"];
const inventoryListComponent = shallow(
<InventoryList itemList={itemList} />
);
expect(inventoryListComponent.state("filterTerm")).toEqual("");
});
it("should update the filterTerm in state when updateFilter is called.", () => {
const itemList = ["just", "a", "test"];
const inventoryListComponent = shallow(
<InventoryList itemList={itemList} />
);
const newFilterTerm = "new filter term";
expect(inventoryListComponent.state("filterTerm")).toEqual("");
inventoryListComponent
.instance()
.updateFilter({ target: { value: newFilterTerm } });
expect(inventoryListComponent.state("filterTerm")).toEqual(newFilterTerm);
});
});
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`InventoryList should render as expected 1`] = `
Array [
<div
name="Filter"
/>,
<div
name="Item"
/>,
<div
name="Item"
/>,
<div
name="Item"
/>,
]
`;
import React from "react";
import { Item } from "./Item";
import renderer from "react-test-renderer";
describe("Item", () => {
it("should render as expected", () => {
const name = "Water";
const emptyCallback = () => {};
const itemComponent = renderer
.create(<Item name={name} />)
.toJSON();
expect(itemComponent).toMatchSnapshot();
});
});
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Item should render as expected 1`] = `
<div
className="row"
>
Water
</div>
`;
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { App } from './App';
import renderer from "react-test-renderer";
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(<App />, div);
ReactDOM.unmountComponentAtNode(div);
jest.mock("../../container/InventoryList/InventoryList.js", () => ({
InventoryList: () => <div name="InventoryList" />
}));
describe("App", () => {
it("should render without crashing", () => {
const div = document.createElement("div");
ReactDOM.render(<App />, div);
});
it("should render as expected", () => {
const appContainer = renderer.create(<App />).toJSON();
expect(appContainer).toMatchSnapshot();
});
});
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`App should render as expected 1`] = `
<div
className="App"
>
<div
className="App-header"
>
<h2>
Inventory
</h2>
</div>
<div
className="container"
>
<div
name="InventoryList"
/>
</div>
</div>
`;
import React from "react";
import { Filter } from "./Filter";
import renderer from "react-test-renderer";
import { shallow } from "enzyme";
describe("Filter", () => {
it("should render as expected", () => {
const filterComponent = renderer
.create(<Filter filterTerm="filter" updateFilter={() => {}} />)
.toJSON();
expect(filterComponent).toMatchSnapshot();
});
it("should call 'updateFilter' when the input fields changes", () => {
const updateFilter = jest.fn();
const filterComponent = shallow(
<Filter filterTerm="filter" updateFilter={updateFilter} />
);
filterComponent.find("input").simulate("change");
expect(updateFilter.mock.calls.length).toBe(1);
});
});
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Filter should render as expected 1`] = `
<div
className="row"
>
<div
className="col-md-2"
>
Filter
</div>
<div
className="col-md-3"
>
<input
onChange={[Function]}
type="text"
value="filter"
/>
</div>
</div>
`;
import Enzyme from "enzyme";
import Adapter from "enzyme-adapter-react-16";
Enzyme.configure({ adapter: new Adapter() });
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment