Add jest snapshot testing to Nav.jsx
This commit is contained in:
Sepand Ansari
sepans
parent
e1ef323e9b
commit
189cc586c6
3 changed files with 536 additions and 0 deletions
|
|
@ -1,6 +1,7 @@
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { shallow } from 'enzyme';
|
import { shallow } from 'enzyme';
|
||||||
|
import renderer from 'react-test-renderer';
|
||||||
|
|
||||||
import Nav from './../Nav';
|
import Nav from './../Nav';
|
||||||
|
|
||||||
|
|
@ -44,4 +45,11 @@ describe('Nav', () => {
|
||||||
const nav = getWrapper();
|
const nav = getWrapper();
|
||||||
expect(nav.exists('.nav')).toEqual(true);
|
expect(nav.exists('.nav')).toEqual(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('renders correctly', () => {
|
||||||
|
const tree = renderer
|
||||||
|
.create(<Nav {...props} />)
|
||||||
|
.toJSON();
|
||||||
|
expect(tree).toMatchSnapshot();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
527
client/components/__test__/__snapshots__/Nav.test.jsx.snap
Normal file
527
client/components/__test__/__snapshots__/Nav.test.jsx.snap
Normal file
|
|
@ -0,0 +1,527 @@
|
||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`Nav renders correctly 1`] = `
|
||||||
|
<nav
|
||||||
|
className="nav"
|
||||||
|
title="main-navigation"
|
||||||
|
>
|
||||||
|
<ul
|
||||||
|
className="nav__items-left"
|
||||||
|
title="project-menu"
|
||||||
|
>
|
||||||
|
<li
|
||||||
|
className="nav__item-logo"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="nav__item-header"
|
||||||
|
>
|
||||||
|
File
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading nav__item-header-triangle"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<ul
|
||||||
|
className="nav__dropdown"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__dropdown-heading"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
File
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
New
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
Ctrl
|
||||||
|
+s
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Duplicate
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Share
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Download
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
Open
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
Examples
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="nav__item-header"
|
||||||
|
>
|
||||||
|
Edit
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading nav__item-header-triangle"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<ul
|
||||||
|
className="nav__dropdown"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__dropdown-heading"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Edit
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Tidy Code
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
⇧
|
||||||
|
+Tab
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Find
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
Ctrl
|
||||||
|
+F
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Find Next
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
Ctrl
|
||||||
|
+G
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Find Previous
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
⇧
|
||||||
|
+
|
||||||
|
Ctrl
|
||||||
|
+G
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="nav__item-header"
|
||||||
|
>
|
||||||
|
Sketch
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading nav__item-header-triangle"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<ul
|
||||||
|
className="nav__dropdown"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__dropdown-heading"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Sketch
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Run
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
Ctrl
|
||||||
|
+Enter
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Stop
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
⇧
|
||||||
|
+
|
||||||
|
Ctrl
|
||||||
|
+Enter
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Start Accessible
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
⇧
|
||||||
|
+
|
||||||
|
Ctrl
|
||||||
|
+1
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Stop Accessible
|
||||||
|
<span
|
||||||
|
className="nav__keyboard-shortcut"
|
||||||
|
>
|
||||||
|
⇧
|
||||||
|
+
|
||||||
|
Ctrl
|
||||||
|
+2
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className="nav__item-header"
|
||||||
|
>
|
||||||
|
Help & Feedback
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading nav__item-header-triangle"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<ul
|
||||||
|
className="nav__dropdown"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__dropdown-heading"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Help & Feedback
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Keyboard Shortcuts
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href="https://p5js.org/reference/"
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
Reference
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
About
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
Feedback
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<ul
|
||||||
|
className="nav__items-right"
|
||||||
|
title="user-menu"
|
||||||
|
>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Hello,
|
||||||
|
new-user
|
||||||
|
!
|
||||||
|
</span>
|
||||||
|
</li>
|
||||||
|
<span
|
||||||
|
className="nav__item-spacer"
|
||||||
|
>
|
||||||
|
|
|
||||||
|
</span>
|
||||||
|
<li
|
||||||
|
className="nav__item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__item-header"
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
My Account
|
||||||
|
</button>
|
||||||
|
<span
|
||||||
|
className="isvg loading nav__item-header-triangle"
|
||||||
|
/>
|
||||||
|
<ul
|
||||||
|
className="nav__dropdown"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
className="nav__dropdown-heading"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
My Account
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="isvg loading"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
My sketches
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
My assets
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
style={Object {}}
|
||||||
|
>
|
||||||
|
Settings
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
className="nav__dropdown-item"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
onBlur={[Function]}
|
||||||
|
onClick={[Function]}
|
||||||
|
onFocus={[Function]}
|
||||||
|
>
|
||||||
|
Log out
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
`;
|
||||||
|
|
@ -68,6 +68,7 @@
|
||||||
"sass-loader": "^6.0.7",
|
"sass-loader": "^6.0.7",
|
||||||
"style-loader": "^0.13.2",
|
"style-loader": "^0.13.2",
|
||||||
"webpack-manifest-plugin": "^2.0.4",
|
"webpack-manifest-plugin": "^2.0.4",
|
||||||
|
"react-test-renderer": "^16.6.0",
|
||||||
"webpack-node-externals": "^1.7.2"
|
"webpack-node-externals": "^1.7.2"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue