Skip to content
Snippets Groups Projects
Commit b197ebea authored by Carl Valdemar Ebbesen's avatar Carl Valdemar Ebbesen
Browse files

added snapshot and component tests

parent dda9eb18
Branches
No related tags found
No related merge requests found
...@@ -63,6 +63,24 @@ ...@@ -63,6 +63,24 @@
] ]
}, },
"devDependencies": { "devDependencies": {
"@types/react-router-dom": "^5.1.9" "@types/enzyme": "^3.10.9",
"@types/enzyme-adapter-react-16": "^1.0.6",
"@types/react-router-dom": "^5.1.9",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.6",
"enzyme-to-json": "^3.6.2",
"react-test-renderer": "^17.0.2"
},
"jest": {
"snapshotSerializers": [
"enzyme-to-json/serializer"
],
"collectCoverageFrom": [
"src/**/*.js",
"!src/index.js"
],
"coverageReporters": [
"text"
]
} }
} }
import {Redirect, Route, Switch} from 'react-router'; import {Redirect, Route, Switch} from 'react-router';
import LandingPage from "./pages/landingPage/landingPage"; import LandingPage from "./pages/landingPage/landingPage";
import OverviewPage from "./pages/overviewPage/overview";
import { GlobalCommitContext } from './context/commitPageContext'; import { GlobalCommitContext } from './context/commitPageContext';
import { useState } from 'react'; import { useState } from 'react';
import IssuePage from './pages/issueListPage/issuePage'; import IssuePage from './pages/issueListPage/issuePage';
import { CommitPage } from './pages/commitGraphPage/CommitPage'; import { CommitPage } from './pages/commitGraphPage/CommitPage';
import { IssueGraphPage } from './pages/issueGraphPage/issueGraphPage'; import { IssueGraphPage } from './pages/issueGraphPage/issueGraphPage';
import CommitPageWrapper from "./pages/commitListPage/commitPageWrapper" import CommitPageWrapper from "./pages/commitListPage/commitPageWrapper"
import GobackButton from './components/goBack/goBackButton'; import OverviewPage from './pages/overviewPage/Overview';
function App() { function App() {
const [testContext, setTestContext] = useState<string>('Admin'); const [testContext, setTestContext] = useState<string>('Admin');
......
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders the App Component 1`] = `
<div
className="App"
>
<Switch>
<Route
exact={true}
path="/"
>
<LandingPage />
</Route>
<Route
exact={true}
path="/overview"
>
<OverviewPage />
</Route>
<Route
exact={true}
path="/issue"
>
<OverviewPage />
</Route>
<Route
exact={true}
path="/commit"
>
<OverviewPage />
</Route>
<Route
exact={true}
path="/issuelist"
>
<IssuePage />
</Route>
<Route
exact={true}
path="/issuegraph"
>
<IssueGraphPage />
</Route>
<Route
exact={true}
path="/commitlist"
>
<CommitPageWrapper />
</Route>
<Route
exact={true}
path="/commitgraph"
>
<ContextProvider
value={
Object {
"setTestContext": [Function],
"testContext": "Admin",
}
}
>
<CommitPage />
</ContextProvider>
</Route>
<Redirect
to="/"
/>
</Switch>
</div>
`;
exports[`renders the CommitGraphPage 1`] = `
<div
className="pageContainer"
>
<GobackButton />
<h1>
Charts for issues
</h1>
<BarChart
title="Commits per day"
/>
<PieChart
title="Commits per member"
/>
</div>
`;
exports[`renders the CommitListPage 1`] = `
<div>
<GobackButton />
<h1>
Commits
</h1>
<div
className="ArrowDiv"
>
<button
className="Button"
disabled={true}
onClick={[Function]}
>
<i
className="Arrow Left"
/>
</button>
<h4>
1
</h4>
<button
className="Button"
disabled={false}
onClick={[Function]}
>
<i
className="Arrow Right"
/>
</button>
</div>
<CommitComponent />
</div>
`;
exports[`renders the IssueGraphPage 1`] = `
<div
className="pageContainer"
>
<GobackButton />
<h1>
Charts for issues
</h1>
<BarChart
title="Issues authored per day"
/>
<PieChart
title="Issues authored per member"
/>
</div>
`;
exports[`renders the IssueListpage 1`] = `
<div
className="container"
>
<GobackButton />
<h1
className="headline"
>
Issues
</h1>
<IssuesListComponent />
</div>
`;
exports[`renders the LandingPage 1`] = `
<div
className="inputWrapper"
>
<img
alt="visualization"
src="gitlab.jpeg"
style={
Object {
"margin": "30px auto",
"width": "80%",
}
}
/>
<button
className="defaultButton"
onClick={[Function]}
>
set default values
</button>
<form
onSubmit={[Function]}
>
<input
className="inputField"
id="ProjektIDInput"
onChange={[Function]}
placeholder="ProjectId"
required={true}
type="Text"
value=""
/>
<input
className="inputField"
id="KeyInput"
onChange={[Function]}
placeholder="Key"
required={true}
type="Text"
value=""
/>
<button
className="submitButton"
disabled={true}
type="submit"
>
Use values
</button>
<ToastContainer
autoClose={3000}
closeButton={[Function]}
closeOnClick={true}
draggable={true}
draggableDirection="x"
draggablePercent={80}
hideProgressBar={false}
newestOnTop={false}
pauseOnFocusLoss={true}
pauseOnHover={true}
position="top-right"
role="alert"
rtl={false}
theme="light"
transition={[Function]}
/>
</form>
</div>
`;
exports[`renders the overviewPage 1`] = `
<div
className="wrapper"
>
<GobackButton />
<h2
style={
Object {
"marginTop": "30px",
}
}
>
Choose display form:
</h2>
<div
className="buttonWrapper"
>
<button
className="button"
onClick={[Function]}
>
Graph
</button>
<button
className="button"
onClick={[Function]}
>
List
</button>
</div>
</div>
`;
import { shallow } from "enzyme";
import GobackButton from "../components/goBack/goBackButton";
import Enzyme from 'enzyme';
import ReactSixteenAdapter from 'enzyme-adapter-react-16';
import OverviewPage from "../pages/overviewPage/Overview";
Enzyme.configure({ adapter: new ReactSixteenAdapter() });
const wrapped = shallow(<OverviewPage/>);
describe('OverviewPage', () => {
it('should render the OverviewPage', () => {
expect(wrapped.find(".buttonWrapper").children().length).toEqual(2);
expect(wrapped.find(".buttonWrapper").childAt(0).text()).toEqual("Graph");
expect(wrapped.find(".buttonWrapper").childAt(1).text()).toEqual("List");
expect(wrapped.find("h2").text()).toEqual("Choose display form:");
});
});
\ No newline at end of file
import { shallow } from 'enzyme';
import App from '../App';
import Enzyme from 'enzyme';
import ReactSixteenAdapter from 'enzyme-adapter-react-16';
import IssuePage from '../pages/issueListPage/issuePage';
import { IssueGraphPage } from '../pages/issueGraphPage/issueGraphPage';
import OverviewPage from '../pages/overviewPage/Overview';
import LandingPage from '../pages/landingPage/landingPage';
import CommitPageWrapper from '../pages/commitListPage/commitPageWrapper';
import { CommitPage } from '../pages/commitGraphPage/CommitPage';
Enzyme.configure({ adapter: new ReactSixteenAdapter() });
test('renders the App Component', () => {
const component = shallow(<App/>);
expect(component).toMatchSnapshot();
});
test('renders the IssueListpage', () => {
const component = shallow(<IssuePage/>);
expect(component).toMatchSnapshot();
});
test('renders the IssueGraphPage', () => {
const component = shallow(<IssueGraphPage/>);
expect(component).toMatchSnapshot();
});
test('renders the overviewPage', () => {
const component = shallow(<OverviewPage/>);
expect(component).toMatchSnapshot();
});
test('renders the LandingPage', () => {
const component = shallow(<LandingPage/>);
expect(component).toMatchSnapshot();
});
test('renders the CommitListPage', () => {
const component = shallow(<CommitPageWrapper/>);
expect(component).toMatchSnapshot();
});
test('renders the CommitGraphPage', () => {
const component = shallow(<CommitPage/>);
expect(component).toMatchSnapshot();
});
Source diff could not be displayed: it is too large. Options to address this: view the blob.
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment