Skip to content

GitLab

Commit 005331fb authored by Mickaël Bourgier's avatar Mickaël Bourgier
Browse files

🔥 Remove snapshot testing

parent 8f14c499
Expand all Hide whitespace changes
Inline Side-by-side
src/AppBar/AppBar.test.js deleted 100644 → 0
View file @ 8f14c499
import React from 'react';
import renderer from 'react-test-renderer';
import { SheetsRegistry } from 'react-jss';
import wrapToTest from '../utils/wrapToTest';
import AppBar from './AppBar';
describe('<AppBar />', () => {
let componentToTest;
let sheets;
beforeEach(() => {
componentToTest = null;
sheets = null;
});
afterEach(() => {
if (componentToTest !== null) {
const options = sheets === null ? {} : { sheets };
const component = renderer.create(wrapToTest(options)(componentToTest));
expect(component.toJSON()).toMatchSnapshot();
if (sheets !== null) {
expect(sheets.toString()).toMatchSnapshot();
}
}
});
test('Render without props', () => {
componentToTest = <AppBar />;
sheets = new SheetsRegistry();
});
test('Render with children', () => {
componentToTest = (
<AppBar>
Hello <strong>you</strong>
</AppBar>
);
});
test('Should include className and other props', () => {
componentToTest = (
<AppBar className='my-custom-class' myCustomProp='value' />
);
});
test('Render with color', () => {
componentToTest = <AppBar color='success' />;
});
test('Render as fixed', () => {
componentToTest = <AppBar fixed />;
});
});
src/AppBar/__snapshots__/AppBar.test.js.snap deleted 100644 → 0
View file @ 8f14c499
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<AppBar /> Render as fixed 1`] = `
<header
className="Paper-root-0-1-11 Paper-elevation4-0-1-16 AppBar-root-0-1-1 AppBar-primaryColor-0-1-3 AppBar-fixed-0-1-2"
/>
`;
exports[`<AppBar /> Render with children 1`] = `
<header
className="Paper-root-0-1-11 Paper-elevation4-0-1-16 AppBar-root-0-1-1 AppBar-primaryColor-0-1-3"
>
Hello
<strong>
you
</strong>
</header>
`;
exports[`<AppBar /> Render with color 1`] = `
<header
className="Paper-root-0-1-11 Paper-elevation4-0-1-16 AppBar-root-0-1-1 AppBar-successColor-0-1-5"
/>
`;
exports[`<AppBar /> Render without props 1`] = `
<header
className="Paper-root-0-1-11 Paper-elevation4-0-1-16 AppBar-root-0-1-1 AppBar-primaryColor-0-1-3"
/>
`;
exports[`<AppBar /> Render without props 2`] = `
".Paper-root-0-1-11 {
background-color: #ffffff;
}
.Paper-elevation0-0-1-12 {
box-shadow: none;
}
.Paper-elevation1-0-1-13 {
box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 2px 1px -1px rgba(0, 0, 0, 0.12);
}
.Paper-elevation2-0-1-14 {
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 3px 1px -2px rgba(0, 0, 0, 0.12);
}
.Paper-elevation3-0-1-15 {
box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.2),0px 3px 4px 0px rgba(0, 0, 0, 0.14),0px 3px 3px -2px rgba(0, 0, 0, 0.12);
}
.Paper-elevation4-0-1-16 {
box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2),0px 4px 5px 0px rgba(0, 0, 0, 0.14),0px 1px 10px 0px rgba(0, 0, 0, 0.12);
}
.Paper-elevation5-0-1-17 {
box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 5px 8px 0px rgba(0, 0, 0, 0.14),0px 1px 14px 0px rgba(0, 0, 0, 0.12);
}
.Paper-elevation6-0-1-18 {
box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2),0px 6px 10px 0px rgba(0, 0, 0, 0.14),0px 1px 18px 0px rgba(0, 0, 0, 0.12);
}
.Paper-elevation7-0-1-19 {
box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2),0px 7px 10px 1px rgba(0, 0, 0, 0.14),0px 2px 16px 1px rgba(0, 0, 0, 0.12);
}
.Paper-elevation8-0-1-20 {
box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2),0px 8px 10px 1px rgba(0, 0, 0, 0.14),0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.Paper-elevation9-0-1-21 {
box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2),0px 9px 12px 1px rgba(0, 0, 0, 0.14),0px 3px 16px 2px rgba(0, 0, 0, 0.12);
}
.Paper-elevation10-0-1-22 {
box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2),0px 10px 14px 1px rgba(0, 0, 0, 0.14),0px 4px 18px 3px rgba(0, 0, 0, 0.12);
}
.Paper-elevation11-0-1-23 {
box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2),0px 11px 15px 1px rgba(0, 0, 0, 0.14),0px 4px 20px 3px rgba(0, 0, 0, 0.12);
}
.Paper-elevation12-0-1-24 {
box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2),0px 12px 17px 2px rgba(0, 0, 0, 0.14),0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.Paper-elevation13-0-1-25 {
box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2),0px 13px 19px 2px rgba(0, 0, 0, 0.14),0px 5px 24px 4px rgba(0, 0, 0, 0.12);
}
.Paper-elevation14-0-1-26 {
box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2),0px 14px 21px 2px rgba(0, 0, 0, 0.14),0px 5px 26px 4px rgba(0, 0, 0, 0.12);
}
.Paper-elevation15-0-1-27 {
box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2),0px 15px 22px 2px rgba(0, 0, 0, 0.14),0px 6px 28px 5px rgba(0, 0, 0, 0.12);
}
.Paper-elevation16-0-1-28 {
box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2),0px 16px 24px 2px rgba(0, 0, 0, 0.14),0px 6px 30px 5px rgba(0, 0, 0, 0.12);
}
.Paper-elevation17-0-1-29 {
box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2),0px 17px 26px 2px rgba(0, 0, 0, 0.14),0px 6px 32px 5px rgba(0, 0, 0, 0.12);
}
.Paper-elevation18-0-1-30 {
box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2),0px 18px 28px 2px rgba(0, 0, 0, 0.14),0px 7px 34px 6px rgba(0, 0, 0, 0.12);
}
.Paper-elevation19-0-1-31 {
box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2),0px 19px 29px 2px rgba(0, 0, 0, 0.14),0px 7px 36px 6px rgba(0, 0, 0, 0.12);
}
.Paper-elevation20-0-1-32 {
box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2),0px 20px 31px 3px rgba(0, 0, 0, 0.14),0px 8px 38px 7px rgba(0, 0, 0, 0.12);
}
.Paper-elevation21-0-1-33 {
box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2),0px 21px 33px 3px rgba(0, 0, 0, 0.14),0px 8px 40px 7px rgba(0, 0, 0, 0.12);
}
.Paper-elevation22-0-1-34 {
box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2),0px 22px 35px 3px rgba(0, 0, 0, 0.14),0px 8px 42px 7px rgba(0, 0, 0, 0.12);
}
.Paper-elevation23-0-1-35 {
box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2),0px 23px 36px 3px rgba(0, 0, 0, 0.14),0px 9px 44px 8px rgba(0, 0, 0, 0.12);
}
.Paper-elevation24-0-1-36 {
box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2),0px 24px 38px 3px rgba(0, 0, 0, 0.14),0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
.Paper-rounded-0-1-37 {
border-radius: 4px;
}
.AppBar-root-0-1-1 {
width: 100%;
display: flex;
z-index: 1000;
flex-direction: column;
}
.AppBar-fixed-0-1-2 {
position: fixed;
}
.AppBar-primaryColor-0-1-3 {
color: white;
background-color: #3796e2;
}
.AppBar-secondaryColor-0-1-4 {
color: white;
background-color: #ea4c88;
}
.AppBar-successColor-0-1-5 {
color: white;
background-color: #66bb6a;
}
.AppBar-infoColor-0-1-6 {
color: white;
background-color: #4dbbe2;
}
.AppBar-warningColor-0-1-7 {
color: rgba(0, 0, 0, 0.8);
background-color: #f6b74d;
}
.AppBar-dangerColor-0-1-8 {
color: white;
background-color: #ed5655;
}
.AppBar-lightColor-0-1-9 {
color: rgba(0, 0, 0, 0.8);
background-color: #f0f3f8;
}
.AppBar-darkColor-0-1-10 {
color: white;
background-color: #555555;
}"
`;
exports[`<AppBar /> Should include className and other props 1`] = `
<header
className="Paper-root-0-1-11 Paper-elevation4-0-1-16 AppBar-root-0-1-1 AppBar-primaryColor-0-1-3 my-custom-class"
myCustomProp="value"
/>
`;
src/Checkbox/Checkbox.test.js deleted 100644 → 0
View file @ 8f14c499
import React from 'react';
import renderer from 'react-test-renderer';
import { SheetsRegistry } from 'react-jss';
import wrapToTest from '../utils/wrapToTest';
import Checkbox from './Checkbox';
describe('<Checkbox />', () => {
let componentToTest;
let sheets;
let theme;
beforeEach(() => {
componentToTest = null;
sheets = null;
theme = null;
});
afterEach(() => {
if (componentToTest !== null) {
const options = {
...(sheets !== null ? { sheets } : {}),
...(theme !== null ? { theme } : {}),
};
const component = renderer.create(wrapToTest(options)(componentToTest));
expect(component.toJSON()).toMatchSnapshot();
if (sheets !== null) {
expect(sheets.toString()).toMatchSnapshot();
}
}
});
test('Render with prop `id` as `fez`', () => {
componentToTest = <Checkbox id={'fez'} />;
sheets = new SheetsRegistry();
});
test('Render with prop `id` as `fez` and children', () => {
componentToTest = <Checkbox id={'fez'}>Clique-moi !</Checkbox>;
});
test('Render with prop `id` as `fez` and `checked` as `true`', () => {
componentToTest = <Checkbox id={'fez'} checked />;
});
test('Render with prop `id` as `fez` and `disabled` as `true`', () => {
componentToTest = <Checkbox id={'fez'} disabled />;
});
test('Should include className and other props', () => {
componentToTest = (
<Checkbox id={'fez'} className={'my-custom-class'} otherProp={'fez'} />
);
});
});
src/Checkbox/__snapshots__/Checkbox.test.js.snap deleted 100644 → 0
View file @ 8f14c499
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<Checkbox /> Render with prop \`id\` as \`fez\` 1`] = `
<span
className="ToggleInput-root-0-1-1"
>
<input
autoComplete="off"
checked={false}
className="ToggleInput-hidden-0-1-3"
disabled={false}
id="fez"
onChange={[Function]}
type="checkbox"
/>
<span
className=""
onClick={[Function]}
>
<span
className="ToggleInput-span-0-1-4"
>
<svg
className="ToggleInput-icon-0-1-5 ToggleInput-icon-0-1-6"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
Object {
"color": undefined,
}
}
viewBox="0 0 448 512"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z"
/>
</svg>
</span>
</span>
</span>
`;
exports[`<Checkbox /> Render with prop \`id\` as \`fez\` 2`] = `
".ToggleInput-root-0-1-1 {
cursor: pointer;
display: flex;
opacity: 1;
align-items: center;
}
.ToggleInput-disabled-0-1-2 {
cursor: not-allowed;
opacity: 0.3;
}
.ToggleInput-hidden-0-1-3 {
display: none !important;
}
.ToggleInput-span-0-1-4 {
display: flex;
align-items: center;
justify-content: center;
}
.ToggleInput-icon-0-1-6 {
margin-right: 0;
}"
`;
exports[`<Checkbox /> Render with prop \`id\` as \`fez\` and \`checked\` as \`true\` 1`] = `
<span
className="ToggleInput-root-0-1-1"
>
<input
autoComplete="off"
checked={true}
className="ToggleInput-hidden-0-1-3"
disabled={false}
id="fez"
onChange={[Function]}
type="checkbox"
/>
<span
className=""
onClick={[Function]}
>
<span
className="ToggleInput-span-0-1-4"
>
<svg
className="ToggleInput-icon-0-1-5 ToggleInput-icon-0-1-6"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
Object {
"color": undefined,
}
}
viewBox="0 0 448 512"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M400 480H48c-26.51 0-48-21.49-48-48V80c0-26.51 21.49-48 48-48h352c26.51 0 48 21.49 48 48v352c0 26.51-21.49 48-48 48zm-204.686-98.059l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.248-16.379-6.249-22.628 0L184 302.745l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.25 16.379 6.25 22.628.001z"
/>
</svg>
</span>
</span>
</span>
`;
exports[`<Checkbox /> Render with prop \`id\` as \`fez\` and \`disabled\` as \`true\` 1`] = `
<span
className="ToggleInput-root-0-1-1 ToggleInput-disabled-0-1-2"
>
<input
autoComplete="off"
checked={false}
className="ToggleInput-hidden-0-1-3"
disabled={true}
id="fez"
onChange={[Function]}
type="checkbox"
/>
<span
className=""
onClick={[Function]}
>
<span
className="ToggleInput-span-0-1-4"
>
<svg
className="ToggleInput-icon-0-1-5 ToggleInput-icon-0-1-6"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
Object {
"color": undefined,
}
}
viewBox="0 0 448 512"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z"
/>
</svg>
</span>
</span>
</span>
`;
exports[`<Checkbox /> Render with prop \`id\` as \`fez\` and children 1`] = `
<span
className="ToggleInput-root-0-1-1"
>
<input
autoComplete="off"
checked={false}
className="ToggleInput-hidden-0-1-3"
disabled={false}
id="fez"
onChange={[Function]}
type="checkbox"
/>
<span
className=""
onClick={[Function]}
>
<span
className="ToggleInput-span-0-1-4"
>
<svg
className="ToggleInput-icon-0-1-5 ToggleInput-icon-0-1-6"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
Object {
"color": undefined,
}
}
viewBox="0 0 448 512"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z"
/>
</svg>
Clique-moi !
</span>
</span>
</span>
`;
exports[`<Checkbox /> Should include className and other props 1`] = `
<span
className="ToggleInput-root-0-1-1"
>
<input
autoComplete="off"
checked={false}
className="ToggleInput-hidden-0-1-3"
disabled={false}
id="fez"
onChange={[Function]}
otherProp="fez"
type="checkbox"
/>
<span
className="my-custom-class"
onClick={[Function]}
>
<span
className="ToggleInput-span-0-1-4"
>
<svg
className="ToggleInput-icon-0-1-5 ToggleInput-icon-0-1-6"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
Object {
"color": undefined,
}
}
viewBox="0 0 448 512"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z"
/>
</svg>
</span>
</span>
</span>
`;
src/Col/Col.test.js deleted 100644 → 0
View file @ 8f14c499
import React from 'react';
import renderer from 'react-test-renderer';
import { SheetsRegistry } from 'react-jss';
import { createTheme } from '../styles';
import wrapToTest from '../utils/wrapToTest';
import Col from './Col';
describe('<Col />', () => {
let componentToTest;
let sheets;
let theme;
beforeEach(() => {
componentToTest = null;
sheets = null;
theme = null;
});
afterEach(() => {
if (componentToTest !== null) {
const options = {
...(sheets !== null ? { sheets } : {}),
...(theme !== null ? { theme } : {}),
};
const component = renderer.create(wrapToTest(options)(componentToTest));
expect(component.toJSON()).toMatchSnapshot();
if (sheets !== null) {
expect(sheets.toString()).toMatchSnapshot();
}
}
});
test('Render without props', () => {
componentToTest = <Col />;
sheets = new SheetsRegistry();
});
test('Could render a custom component', () => {
componentToTest = <Col component='p' />;
});
test('Render with children', () => {
componentToTest = (
<Col>
Hello <strong>you</strong>
</Col>
);
});
test('Should include className and other props', () => {
componentToTest = <Col className='my-custom-class' myCustomProp='value' />;
});
test('Render with `sm` prop as `6`, `md` as `4`, `lg` as `true` and `xl` as `auto`', () => {
componentToTest = <Col sm={6} md={4} lg xl='auto' />;
});
test('Render with `xs` prop as `3`, `md` as `true`, `offsetLg` as `2` and `offsetXl` as `0`', () => {
componentToTest = <Col xs={3} md offsetLg={2} offsetXl={0} />;
});
test('Render with `order` prop as `first`', () => {
componentToTest = <Col order='first' />;
});
test('Render with `orderSm` prop as `6`', () => {
componentToTest = <Col orderSm={6} />;
});
test('Render with `order` prop as `10`, `orderMd` as `2` and `orderLg` as `last`', () => {
componentToTest = <Col order={10} orderMd={2} orderLg='last' />;
});
test('Render with `alignSelf` prop as `end`', () => {
componentToTest = <Col alignSelf='end' />;
});
test('Render with `alignSelf` prop as `center`, `alignSelfMd` as `baseline` and `alignSelfLg` as `start`', () => {
componentToTest = (
<Col alignSelf='center' alignSelfMd='baseline' alignSelfLg='start' />
);
});
test('Render with custom gutters in containerContext', () => {
componentToTest = <Col containerContext={{ gutter: 42 }} />;
sheets = new SheetsRegistry();
});
test('Render with vertical gutters in containerContext', () => {
componentToTest = <Col containerContext={{ verticalGutters: true }} />;
sheets = new SheetsRegistry();
});