376 lines
13 KiB
JavaScript
376 lines
13 KiB
JavaScript
import React from 'react'
|
|
import { ReservedTokensInputBlock } from '../../../src/components/Common/ReservedTokensInputBlock'
|
|
import { VALIDATION_TYPES } from '../../../src/utils/constants'
|
|
import Adapter from 'enzyme-adapter-react-15'
|
|
import { configure, mount } from 'enzyme'
|
|
import { reservedTokenStore, tokenStore } from '../../../src/stores'
|
|
|
|
const { VALID, INVALID } = VALIDATION_TYPES
|
|
const stores = { reservedTokenStore, tokenStore }
|
|
|
|
configure({ adapter: new Adapter() })
|
|
jest.mock('react-dropzone', () => () => <span>Dropzone</span>)
|
|
|
|
describe('ReservedTokensInputBlock', () => {
|
|
describe('render', () => {
|
|
it(`should render the component for tokens`, () => {
|
|
// Given
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
|
|
// When
|
|
wrapper.find('#tokens').simulate('change')
|
|
|
|
// Then
|
|
expect(wrapper).toMatchSnapshot('tokens')
|
|
})
|
|
|
|
it(`should render the component for percentage`, () => {
|
|
// Given
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
|
|
// When
|
|
wrapper.find('#percentage').simulate('change')
|
|
|
|
// Then
|
|
expect(wrapper).toMatchSnapshot('percentage')
|
|
})
|
|
})
|
|
|
|
describe('Address field', () => {
|
|
const testCases = [
|
|
{ value: '0x123', expected: false },
|
|
{ value: '0x90F8bF6A479f320EAD074411A4B0E7944EA8C9C1', expected: false },
|
|
{ value: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1', expected: true },
|
|
{ value: '0X90f8bf6a479f320ead074411a4b0e7944ea8c9c1', expected: true },
|
|
{ value: '0x90F8BF6A479F320EAD074411A4B0E7944EA8C9C1', expected: true },
|
|
{ value: '0X90F8BF6A479F320EAD074411A4B0E7944EA8C9C1', expected: true }
|
|
]
|
|
testCases.forEach(testCase => {
|
|
const action = testCase.expected ? 'pass' : 'fail'
|
|
const validity = testCase.expected ? VALID : INVALID
|
|
|
|
it(`Should ${action} for '${testCase.value}'`, () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const handleAddressChange = jest.spyOn(componentInstance, 'handleAddressChange')
|
|
|
|
wrapper.update()
|
|
|
|
wrapper
|
|
.find('input[type="text"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value } })
|
|
expect(handleAddressChange).toHaveBeenCalledTimes(1)
|
|
expect(handleAddressChange).toHaveBeenCalledWith(testCase.value)
|
|
expect(componentInstance.state.validation.address.pristine).toBeFalsy()
|
|
expect(componentInstance.state.validation.address.valid).toBe(validity)
|
|
})
|
|
})
|
|
})
|
|
|
|
describe('Dimension selection', () => {
|
|
it('Should set "tokens" as selected dimension', () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const updateReservedTokenInput = jest.spyOn(componentInstance, 'updateReservedTokenInput')
|
|
|
|
wrapper.update()
|
|
|
|
wrapper.find('#tokens').simulate('change')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledWith('tokens', 'dim')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledTimes(1)
|
|
expect(componentInstance.state.dim).toBe('tokens')
|
|
})
|
|
|
|
it('Should set "percentage" as selected dimension', () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const updateReservedTokenInput = jest.spyOn(componentInstance, 'updateReservedTokenInput')
|
|
|
|
wrapper.update()
|
|
|
|
wrapper.find('#percentage').simulate('change')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledWith('percentage', 'dim')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledTimes(1)
|
|
expect(componentInstance.state.dim).toBe('percentage')
|
|
})
|
|
|
|
it('Should set "tokens" as selected dimension after selecting percentage', () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const updateReservedTokenInput = jest.spyOn(componentInstance, 'updateReservedTokenInput')
|
|
|
|
wrapper.update()
|
|
|
|
wrapper.find('#percentage').simulate('change')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledWith('percentage', 'dim')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledTimes(1)
|
|
expect(componentInstance.state.dim).toBe('percentage')
|
|
|
|
wrapper.find('#tokens').simulate('change')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledWith('tokens', 'dim')
|
|
expect(updateReservedTokenInput).toHaveBeenCalledTimes(2)
|
|
expect(componentInstance.state.dim).toBe('tokens')
|
|
})
|
|
})
|
|
|
|
describe('Value field', () => {
|
|
describe('tokens', () => {
|
|
const testCases = [
|
|
{ value: '0', expected: false },
|
|
{ value: '-10', expected: false },
|
|
{ value: -10, expected: false },
|
|
{ value: 123.1234, expected: false },
|
|
{ value: '10', expected: true },
|
|
{ value: 10, expected: true },
|
|
{ value: '0.1', expected: true },
|
|
{ value: '1e-3', expected: true },
|
|
{ value: '1.3', expected: true }
|
|
]
|
|
|
|
testCases.forEach(testCase => {
|
|
const action = testCase.expected ? 'pass' : 'fail'
|
|
const validity = testCase.expected ? VALID : INVALID
|
|
const calledWith = {
|
|
value: testCase.value,
|
|
pristine: false,
|
|
valid: validity
|
|
}
|
|
|
|
it(`Should ${action} for '${testCase.value}' with ${tokenStore.decimals} decimals`, () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} decimals={3} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const handleValueChange = jest.spyOn(componentInstance, 'handleValueChange')
|
|
|
|
wrapper.update()
|
|
wrapper.find('#tokens').simulate('change')
|
|
wrapper
|
|
.find('input[type="number"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value } })
|
|
|
|
expect(handleValueChange).toHaveBeenCalledTimes(1)
|
|
expect(handleValueChange).toHaveBeenCalledWith(calledWith)
|
|
})
|
|
})
|
|
})
|
|
|
|
describe('percentage', () => {
|
|
const testCases = [
|
|
{ value: '0', expected: false },
|
|
{ value: '-10', expected: false },
|
|
{ value: -10, expected: false },
|
|
{ value: '10', expected: true },
|
|
{ value: 10, expected: true },
|
|
{ value: '0.1', expected: true },
|
|
{ value: '1e-3', expected: true },
|
|
{ value: '1.3', expected: true },
|
|
{ value: 123.1234, expected: true }
|
|
]
|
|
testCases.forEach(testCase => {
|
|
const action = testCase.expected ? 'pass' : 'fail'
|
|
const validity = testCase.expected ? VALID : INVALID
|
|
const calledWith = {
|
|
value: testCase.value,
|
|
pristine: false,
|
|
valid: validity
|
|
}
|
|
|
|
it(`Should ${action} for '${testCase.value}'`, () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const componentInstance = wrapper.find(ReservedTokensInputBlock).instance().wrappedInstance
|
|
const handleValueChange = jest.spyOn(componentInstance, 'handleValueChange')
|
|
|
|
wrapper.update()
|
|
wrapper.find('#percentage').simulate('change')
|
|
wrapper
|
|
.find('input[type="number"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value } })
|
|
|
|
expect(handleValueChange).toHaveBeenCalledTimes(2)
|
|
expect(handleValueChange).toHaveBeenCalledWith({ value: '', pristine: true, valid: VALID })
|
|
expect(handleValueChange).toHaveBeenCalledWith(calledWith)
|
|
})
|
|
})
|
|
})
|
|
})
|
|
|
|
describe('Callbacks', () => {
|
|
describe('addReservedTokensItem', () => {
|
|
const testCases = [
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'tokens',
|
|
val: '120'
|
|
},
|
|
expected: true
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x0000000000000000000000000000000000000001',
|
|
dim: 'tokens',
|
|
val: '0.001'
|
|
},
|
|
expected: true
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'tokens',
|
|
val: ''
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'tokens',
|
|
val: '0'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'tokens',
|
|
val: '120.1234'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '',
|
|
dim: 'tokens',
|
|
val: '120'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a4',
|
|
dim: 'tokens',
|
|
val: '120'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c10x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'tokens',
|
|
val: '120'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'percentage',
|
|
val: '120'
|
|
},
|
|
expected: true
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x0000000000000000000000000000000000000012',
|
|
dim: 'percentage',
|
|
val: '120.123'
|
|
},
|
|
expected: true
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'percentage',
|
|
val: ''
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '',
|
|
dim: 'percentage',
|
|
val: '120.123'
|
|
},
|
|
expected: false
|
|
},
|
|
{
|
|
value: {
|
|
addr: '0x90f8bf6a479f320ead074411a4b0e7944ea8c9c1',
|
|
dim: 'percentage',
|
|
val: '0'
|
|
},
|
|
expected: false
|
|
}
|
|
]
|
|
|
|
testCases.forEach(testCase => {
|
|
const action = testCase.expected ? 'call' : 'not call'
|
|
|
|
it(`Should ${action} addReservedTokensItem callback for: ${JSON.stringify(testCase.value)}`, () => {
|
|
const { tokens } = reservedTokenStore
|
|
const storedTokens = testCase.expected ? tokens.length + 1 : tokens.length
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} decimals={3} />)
|
|
|
|
wrapper.find(`#${testCase.value.dim}`).simulate('change')
|
|
wrapper
|
|
.find('input[type="text"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value.addr } })
|
|
wrapper
|
|
.find('input[type="number"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value.val } })
|
|
|
|
wrapper.find('ButtonPlus').simulate('click')
|
|
|
|
const { value } = testCase
|
|
value.val = testCase.value.val === '' ? '' : parseFloat(testCase.value.val)
|
|
|
|
expect(reservedTokenStore.tokens.length).toBe(storedTokens)
|
|
})
|
|
})
|
|
})
|
|
|
|
describe('clearAll', () => {
|
|
afterEach(() => {
|
|
reservedTokenStore.clearAll()
|
|
})
|
|
|
|
it('Should show the "Clear all" button if there are tokens"', () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
const testCase = {
|
|
value: {
|
|
addr: '0x0000000000000000000000000000000000000012',
|
|
dim: 'percentage',
|
|
val: '120.123'
|
|
}
|
|
}
|
|
|
|
wrapper.find(`#${testCase.value.dim}`).simulate('change')
|
|
wrapper
|
|
.find('input[type="text"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value.addr } })
|
|
wrapper
|
|
.find('input[type="number"]')
|
|
.at(0)
|
|
.simulate('change', { target: { value: testCase.value.val } })
|
|
|
|
wrapper.find('ButtonPlus').simulate('click')
|
|
|
|
const clearAllButton = wrapper.find('ButtonCSV').find('.sw-ButtonCSV-clearall')
|
|
expect(clearAllButton).toHaveLength(1)
|
|
})
|
|
|
|
it('Should not show the "Clear all" button if there are no tokens"', () => {
|
|
const wrapper = mount(<ReservedTokensInputBlock {...stores} />)
|
|
|
|
const clearAllButton = wrapper.find('.sw-ReservedTokensListControls_Button-clearall')
|
|
expect(clearAllButton).toHaveLength(0)
|
|
})
|
|
})
|
|
})
|
|
})
|