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.

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

feat(demo) add a test #512

Merged
merged 2 commits into from
Jan 22, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
340 changes: 264 additions & 76 deletions examples/demo/package-lock.json

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions examples/demo/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@
"@storybook/addon-actions": "^5.3.6",
"@storybook/addon-knobs": "^5.3.6",
"@storybook/react": "^5.3.6",
"@testing-library/react": "^9.4.0",
"babel-loader": "^8.0.6",
"concurrently": "^4.1.2",
"express": "^4.17.1",
Expand Down
8 changes: 2 additions & 6 deletions examples/demo/src/Home/Home.container.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,6 @@ import fetchDevis from './Home.service';
import React, {useEffect, useReducer} from 'react';
import withCustomFetch from '../withCustomFetch';
import withLoader from '../withLoader';
import compose from '../compose';
import {withRouter} from 'react-router-dom';
import {computeNumberPages, filterPaging, getItemsSorted} from "./Home.filters";

const HomeWithLoader = withLoader(Home);
Expand Down Expand Up @@ -95,7 +93,7 @@ const useHome = fetch => {
return { state, onChangePaging, onChangeFilter };
};

const HomeContainer = ({ fetch }) => {
export const HomeContainer = ({ fetch }) => {
const { state, onChangePaging, onChangeFilter } = useHome(fetch);
const itemsSorted = getItemsSorted(state.items, state.filters.columns);
const numberPages = computeNumberPages(itemsSorted, state.filters.paging.numberItemsByPage);
Expand All @@ -113,6 +111,4 @@ const HomeContainer = ({ fetch }) => {
return (<HomeWithLoader {...state} numberItemsTotal={state.items.length} items={items} filters={filters} onChangePaging={onChangePaging} onChangeFilter={onChangeFilter} />);
};

export default compose(
withCustomFetch(fetch),
withRouter)(HomeContainer);
export default withCustomFetch(fetch)(HomeContainer);
30 changes: 30 additions & 0 deletions examples/demo/src/Home/Home.container.spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@

import '@testing-library/jest-dom/extend-expect';
import React from 'react';
import { render, waitForElement, getByText } from '@testing-library/react';
import { HomeContainer } from './Home.container';
import {BrowserRouter as Router} from "react-router-dom";

const fetch = () => Promise.resolve([{
id: "0001",
firstname: "Olivier",
lastname: "Youf",
type: "auto",
agent: "Guillaume Chervet",
birthdate: "02/03/1984",
begin: "04/04/2011"
}]);

describe('Home.container', () => {

it('HomeContainer render correctly', async () => {
const { asFragment, getByText } = render(<Router><HomeContainer fetch={fetch} /></Router>);
const messageEl = await waitForElement(() => getByText('Olivier Youf'));
expect(messageEl).toHaveTextContent(
'Olivier Youf'
);
expect(asFragment()).toMatchSnapshot();
});

});

2 changes: 1 addition & 1 deletion examples/demo/src/Home/Home.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
Expand Down Expand Up @@ -84,6 +83,7 @@ const Home = ({ items, numberItemsTotal, filters, loaderMode, onChangePaging, on
numberItems={filters.paging.numberItemsByPage}
numberPages={filters.paging.numberPages}
currentPage={filters.paging.currentPage}
id="home_paging"
/>
</Loader>
</div>
Expand Down
316 changes: 316 additions & 0 deletions examples/demo/src/Home/__snapshots__/Home.container.spec.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,316 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Home.container HomeContainer render correctly 1`] = `
<DocumentFragment>
<div
class="af-title-bar"
>
<div
class="container-fluid container af-title-bar__wrapper"
>
<h1
class="af-title-bar__title"
>
Page d'accueil
</h1>
</div>
</div>
<div
class="af-home container"
>
<a
class="btn af-btn af-btn--quote"
href="/quote/new"
>
<span
class="af-btn__text"
>
Nouveau devis
</span>
</a>
<h1
class="af-title--content"
>
Vos devis en cours (1)
</h1>
<div
style="min-height: 94px; position: relative;"
>
<table
class="af-table"
>
<thead
class="af-table-thead"
>
<tr
class="af-table__tr"
>
<th
class="af-table__th af-table__th--sortable"
>
<span
class="af-table__th-content"
>
<button
class="af-btn af-btn--table-sorting"
>
<span
class="af-btn__text"
>
Nom prénom
</span>
<i
class="glyphicon glyphicon-sorting"
/>
</button>
</span>
</th>
<th
class="af-table__th af-table__th--sortable"
>
<span
class="af-table__th-content"
>
<button
class="af-btn af-btn--table-sorting"
>
<span
class="af-btn__text"
>
Type
</span>
<i
class="glyphicon glyphicon-sorting"
/>
</button>
</span>
</th>
<th
class="af-table__th af-table__th--sortable"
>
<span
class="af-table__th-content"
>
<button
class="af-btn af-btn--table-sorting"
>
<span
class="af-btn__text"
>
Agent
</span>
<i
class="glyphicon glyphicon-sorting"
/>
</button>
</span>
</th>
<th
class="af-table__th"
>
Date de naissance
</th>
<th
class="af-table__th af-table__th--sortable"
>
<span
class="af-table__th-content"
>
<button
class="af-btn af-btn--table-sorting"
>
<span
class="af-btn__text"
>
Date d'entrée
</span>
<i
class="glyphicon glyphicon-sorting"
/>
</button>
</span>
</th>
<th
class="af-table__th"
>
Action
</th>
</tr>
</thead>
<tbody
class="af-table__body"
>
<tr
class="af-table__tr"
>
<td
class="af-table__cell"
>
Olivier Youf
</td>
<td
class="af-table__cell"
>
auto
</td>
<td
class="af-table__cell"
>
Guillaume Chervet
</td>
<td
class="af-table__cell"
>
02/03/1984
</td>
<td
class="af-table__cell"
>
2011-5-4
</td>
<td
class="af-table__cell"
>
<a
class="btn af-btn--circle"
href="#"
id="id"
role="button"
tabindex="0"
title="Editer"
>
<i
class="glyphicon glyphicon-edit"
/>
</a>
</td>
</tr>
</tbody>
</table>
<div
class="af-paging"
>
<div
class="af-paging__limit"
>
<div
class="af-paging__limit"
>
<form
class="af-paging__form"
>
<div
class="af-form__group"
>
<div
class="col col-sm-2 col-md-2 col-lg-2 col-xl-2"
>
<label
class="af-form__group-label"
for="home_paging"
>
Afficher
</label>
</div>
<div
class="col col-sm-10 col-md-10 col-lg-10 col-xl-10"
>
<div
class="af-form__select"
>
<div
class="af-form__select-container"
>
<select
class="af-form__input-select"
id="home_paging"
>
<option
value="5"
>
5
</option>
<option
value="10"
>
10
</option>
<option
value="25"
>
25
</option>
<option
value="50"
>
50
</option>
<option
value="100"
>
100
</option>
</select>
<span
class="glyphicon glyphicon-menu-down"
/>
</div>
<span
class="af-form__input-cmplt"
>
éléments
</span>
</div>
</div>
</div>
</form>
</div>
</div>
<div
class="af-paging__pager"
>
<nav
class="af-pager"
>
<ul
class="af-pager__pagination"
>
<li
class="af-pager__item af-pager__item--disabled"
>
<span
class="af-pager__item-nolink"
>
« Précédent
</span>
</li>
<li
class="af-pager__item af-pager__item--active"
>
<a
class="af-pager__item-link"
href="#"
>
<span>
1
</span>
</a>
</li>
<li
class="af-pager__item af-pager__item--disabled"
>
<span
class="af-pager__item-nolink"
>
Suivant »
</span>
</li>
</ul>
</nav>
</div>
</div>

</div>
</div>
</DocumentFragment>
`;
Loading