aboutsummaryrefslogtreecommitdiffstats
path: root/test/unit/responsive/components/dropdown-test.js
diff options
context:
space:
mode:
Diffstat (limited to 'test/unit/responsive/components/dropdown-test.js')
-rw-r--r--test/unit/responsive/components/dropdown-test.js116
1 files changed, 41 insertions, 75 deletions
diff --git a/test/unit/responsive/components/dropdown-test.js b/test/unit/responsive/components/dropdown-test.js
index 3ad2c390e..982d8c6ec 100644
--- a/test/unit/responsive/components/dropdown-test.js
+++ b/test/unit/responsive/components/dropdown-test.js
@@ -1,40 +1,45 @@
-var assert = require('assert');
+const assert = require('assert');
-const additions = require('react-testutils-additions');
const h = require('react-hyperscript');
-const ReactTestUtils = require('react-addons-test-utils');
const sinon = require('sinon');
const path = require('path');
-const Dropdown = require(path.join(__dirname, '..', '..', '..', '..', 'ui', 'app', 'components', 'dropdown.js')).Dropdown;
-const DropdownMenuItem = require(path.join(__dirname, '..', '..', '..', '..', 'ui', 'app', 'components', 'dropdown.js')).DropdownMenuItem;
+const Dropdown = require(path.join(__dirname, '..', '..', '..', '..', 'ui', 'app', 'components', 'dropdowns', 'index.js')).Dropdown;
+
+const { createMockStore } = require('redux-test-utils')
+const { mountWithStore } = require('../../../lib/shallow-with-store')
+
+const mockState = {
+ metamask: {
+ }
+}
describe('Dropdown components', function () {
let onClickOutside;
let closeMenu;
let onClick;
- let dropdownComponentProps;
- const renderer = ReactTestUtils.createRenderer()
+ let dropdownComponentProps = {
+ isOpen: true,
+ zIndex: 11,
+ onClickOutside,
+ style: {
+ position: 'absolute',
+ right: 0,
+ top: '36px',
+ },
+ innerStyle: {},
+ }
+
+ let dropdownComponent
+ let store
+ let component
beforeEach(function () {
onClickOutside = sinon.spy();
closeMenu = sinon.spy();
onClick = sinon.spy();
- dropdownComponentProps = {
- isOpen: true,
- zIndex: 11,
- onClickOutside,
- style: {
- position: 'absolute',
- right: 0,
- top: '36px',
- },
- innerStyle: {},
- }
- });
-
- it('can render two items', function () {
- const dropdownComponent = h(
+ store = createMockStore(mockState)
+ component = mountWithStore(h(
Dropdown,
dropdownComponentProps,
[
@@ -42,74 +47,35 @@ describe('Dropdown components', function () {
.drop-menu-item:hover { background:rgb(235, 235, 235); }
.drop-menu-item i { margin: 11px; }
`),
- h(DropdownMenuItem, {
+ h('li', {
closeMenu,
onClick,
}, 'Item 1'),
- h(DropdownMenuItem, {
+ h('li', {
closeMenu,
onClick,
}, 'Item 2'),
]
- )
+ ), store)
+ dropdownComponent = component
+ })
- const component = additions.renderIntoDocument(dropdownComponent);
- renderer.render(dropdownComponent);
- const items = additions.find(component, 'li');
+ it('can render two items', function () {
+ const items = dropdownComponent.find('li');
assert.equal(items.length, 2);
});
it('closes when item clicked', function() {
- const dropdownComponent = h(
- Dropdown,
- dropdownComponentProps,
- [
- h('style', `
- .drop-menu-item:hover { background:rgb(235, 235, 235); }
- .drop-menu-item i { margin: 11px; }
- `),
- h(DropdownMenuItem, {
- closeMenu,
- onClick,
- }, 'Item 1'),
- h(DropdownMenuItem, {
- closeMenu,
- onClick,
- }, 'Item 2'),
- ]
- )
- const component = additions.renderIntoDocument(dropdownComponent);
- renderer.render(dropdownComponent);
- const items = additions.find(component, 'li');
- const node = items[0];
- ReactTestUtils.Simulate.click(node);
- assert.equal(closeMenu.calledOnce, true);
+ const items = dropdownComponent.find('li');
+ const node = items.at(0);
+ node.simulate('click');
+ assert.equal(node.props().closeMenu, closeMenu);
});
it('invokes click handler when item clicked', function() {
- const dropdownComponent = h(
- Dropdown,
- dropdownComponentProps,
- [
- h('style', `
- .drop-menu-item:hover { background:rgb(235, 235, 235); }
- .drop-menu-item i { margin: 11px; }
- `),
- h(DropdownMenuItem, {
- closeMenu,
- onClick,
- }, 'Item 1'),
- h(DropdownMenuItem, {
- closeMenu,
- onClick,
- }, 'Item 2'),
- ]
- )
- const component = additions.renderIntoDocument(dropdownComponent);
- renderer.render(dropdownComponent);
- const items = additions.find(component, 'li');
- const node = items[0];
- ReactTestUtils.Simulate.click(node);
+ const items = dropdownComponent.find('li');
+ const node = items.at(0);
+ node.simulate('click');
assert.equal(onClick.calledOnce, true);
});
});