m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Remove mountWithStore enzyme component wrapper (#9309)

Browse Source 
* Remove mountWithStore enzyme component wrapper in favor for renderWithProvider testing-library/react for tests

Change dropdown component tests to testing-library/react
This commit is contained in:
Thomas Huang 2020-08-26 15:55:24 -07:00 committed by GitHub
parent 885bd13160
commit 9e6ba089d9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
test/lib/render-helpers.js
View File

@ -6,13 +6,6 @@ import { MemoryRouter } from 'react-router-dom'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { LegacyI18nProvider } from '../../ui/app/contexts/i18n' import { LegacyI18nProvider } from '../../ui/app/contexts/i18n'
export function mountWithStore (component, store) {
const context = {
store,
}
return mount(component, { context })
}
export function mountWithRouter (component, store = {}, pathname = '/') { export function mountWithRouter (component, store = {}, pathname = '/') {
// Instantiate router context // Instantiate router context

69
test/unit/responsive/components/dropdown-test.js
View File

@ -1,26 +1,21 @@
import assert from 'assert' import assert from 'assert'
import React from 'react' import React from 'react'
import configureMockStore from 'redux-mock-store' import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk' import { fireEvent } from '@testing-library/react'
import sinon from 'sinon' import sinon from 'sinon'
import { mountWithStore } from '../../../lib/render-helpers' import { renderWithProvider } from '../../../lib/render-helpers'
import { Dropdown } from '../../../../ui/app/components/app/dropdowns/components/dropdown' import { Dropdown } from '../../../../ui/app/components/app/dropdowns/components/dropdown'
describe('Dropdown components', function () {
const mockState = { const mockState = {
metamask: { metamask: {},
},
} }
describe('Dropdown components', function () { const props = {
let onClickOutside
let onClick
const createMockStore = configureMockStore([thunk])
const dropdownComponentProps = {
isOpen: true, isOpen: true,
zIndex: 11, zIndex: 11,
onClickOutside, onClickOutside: sinon.spy(),
style: { style: {
position: 'absolute', position: 'absolute',
right: 0, right: 0,
@ -29,40 +24,22 @@ describe('Dropdown components', function () {
innerStyle: {}, innerStyle: {},
} }
let dropdownComponent
let store
let component
beforeEach(function () {
onClickOutside = sinon.spy()
onClick = sinon.spy()
store = createMockStore(mockState)
component = mountWithStore((
<Dropdown {...dropdownComponentProps}>
<style>
{
`
.drop-menu-item:hover { background:rgb(235, 235, 235); }
.drop-menu-item i { margin: 11px; }
`
}
</style>
<li onClick={onClick}>Item 1</li>
<li onClick={onClick}>Item 2</li>
</Dropdown>
), store)
dropdownComponent = component
})
it('can render two items', function () {
const items = dropdownComponent.find('li')
assert.equal(items.length, 2)
})
it('invokes click handler when item clicked', function () { it('invokes click handler when item clicked', function () {
const items = dropdownComponent.find('li') const store = configureMockStore()(mockState)
const node = items.at(0)
node.simulate('click') const onClickSpy = sinon.spy()
assert.ok(onClick.calledOnce)
const { getByText } = renderWithProvider(
<Dropdown {...props}>
<li onClick={onClickSpy}>Item 1</li>
<li onClick={onClickSpy}>Item 2</li>
</Dropdown>, store,
)
const item1 = getByText(/Item 1/u)
fireEvent.click(item1)
assert.ok(onClickSpy.calledOnce)
}) })
}) })