diff options
author | Chi Kei Chan <chikeichan@gmail.com> | 2019-04-18 03:15:13 +0800 |
---|---|---|
committer | Dan J Miller <danjm.com@gmail.com> | 2019-04-18 03:15:13 +0800 |
commit | 931aaeb7003f175374a06eb949cd47a12ebc8bbf (patch) | |
tree | fe67bd73faf453f5f06ebae1987da5a2338f2e41 /ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js | |
parent | a844eb20da700b832003f63b83fc42ba74392d6c (diff) | |
download | tangerine-wallet-browser-931aaeb7003f175374a06eb949cd47a12ebc8bbf.tar.gz tangerine-wallet-browser-931aaeb7003f175374a06eb949cd47a12ebc8bbf.tar.zst tangerine-wallet-browser-931aaeb7003f175374a06eb949cd47a12ebc8bbf.zip |
Add token selection to the send screen (#6445)
* Move send to pages/
* Fix unit tests
* Finish UI
* Integrate asset dropdown to send actions
* Remove console.log
* Hide asset change during edit
* Enable switch from send token to seand eth
* Enable switching from token to eth when editing
* Fix linter
* Fixing test
* Fix unit tests
* Fix linter
* Fix react warning; remove console.log
* fix flat test
* Add metrics
* Address code review comments
* Consistent spacing between send screen form rows.
* Reduce height of gas buttons on send screen.
* Make send screen gas button height dependent on size of contents.
Diffstat (limited to 'ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js')
-rw-r--r-- | ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js | 105 |
1 files changed, 105 insertions, 0 deletions
diff --git a/ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js b/ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js new file mode 100644 index 000000000..b92dd4dfe --- /dev/null +++ b/ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js @@ -0,0 +1,105 @@ +import React from 'react' +import assert from 'assert' +import { shallow } from 'enzyme' +import sinon from 'sinon' +import SendDropdownList from '../send-dropdown-list.component.js' + +import AccountListItem from '../../../account-list-item/account-list-item.container' + +const propsMethodSpies = { + closeDropdown: sinon.spy(), + onSelect: sinon.spy(), +} + +sinon.spy(SendDropdownList.prototype, 'getListItemIcon') + +describe('SendDropdownList Component', function () { + let wrapper + + beforeEach(() => { + wrapper = shallow(<SendDropdownList + accounts={[ + { address: 'mockAccount0' }, + { address: 'mockAccount1' }, + { address: 'mockAccount2' }, + ]} + closeDropdown={propsMethodSpies.closeDropdown} + onSelect={propsMethodSpies.onSelect} + activeAddress={'mockAddress2'} + />, { context: { t: str => str + '_t' } }) + }) + + afterEach(() => { + propsMethodSpies.closeDropdown.resetHistory() + propsMethodSpies.onSelect.resetHistory() + SendDropdownList.prototype.getListItemIcon.resetHistory() + }) + + describe('getListItemIcon', () => { + it('should return check icon if the passed addresses are the same', () => { + assert.deepEqual( + wrapper.instance().getListItemIcon('mockAccount0', 'mockAccount0'), + <i className={`fa fa-check fa-lg`} style={ { color: '#02c9b1' } }/> + ) + }) + + it('should return null if the passed addresses are different', () => { + assert.equal( + wrapper.instance().getListItemIcon('mockAccount0', 'mockAccount1'), + null + ) + }) + }) + + describe('render', () => { + it('should render a single div with two children', () => { + assert(wrapper.is('div')) + assert.equal(wrapper.children().length, 2) + }) + + it('should render the children with the correct classes', () => { + assert(wrapper.childAt(0).hasClass('send-v2__from-dropdown__close-area')) + assert(wrapper.childAt(1).hasClass('send-v2__from-dropdown__list')) + }) + + it('should call closeDropdown onClick of the send-v2__from-dropdown__close-area', () => { + assert.equal(propsMethodSpies.closeDropdown.callCount, 0) + wrapper.childAt(0).props().onClick() + assert.equal(propsMethodSpies.closeDropdown.callCount, 1) + }) + + it('should render an AccountListItem for each item in accounts', () => { + assert.equal(wrapper.childAt(1).children().length, 3) + assert(wrapper.childAt(1).children().every(AccountListItem)) + }) + + it('should pass the correct props to the AccountListItem', () => { + wrapper.childAt(1).children().forEach((accountListItem, index) => { + const { + account, + className, + handleClick, + } = accountListItem.props() + assert.deepEqual(account, { address: 'mockAccount' + index }) + assert.equal(className, 'account-list-item__dropdown') + assert.equal(propsMethodSpies.onSelect.callCount, 0) + handleClick() + assert.equal(propsMethodSpies.onSelect.callCount, 1) + assert.deepEqual(propsMethodSpies.onSelect.getCall(0).args[0], { address: 'mockAccount' + index }) + propsMethodSpies.onSelect.resetHistory() + propsMethodSpies.closeDropdown.resetHistory() + assert.equal(propsMethodSpies.closeDropdown.callCount, 0) + handleClick() + assert.equal(propsMethodSpies.closeDropdown.callCount, 1) + propsMethodSpies.onSelect.resetHistory() + propsMethodSpies.closeDropdown.resetHistory() + }) + }) + + it('should call this.getListItemIcon for each AccountListItem', () => { + assert.equal(SendDropdownList.prototype.getListItemIcon.callCount, 3) + const getListItemIconCalls = SendDropdownList.prototype.getListItemIcon.getCalls() + assert(getListItemIconCalls.every(({ args }, index) => args[0] === 'mockAccount' + index)) + }) + }) +}) |