From 9ca4b66c82ab9ec46c6599778df7b661e927edfa Mon Sep 17 00:00:00 2001 From: Sara Reynolds Date: Wed, 25 Jul 2018 11:57:41 -0700 Subject: [PATCH 1/3] Add tests for Confirm Detail Row --- .../confirm-detail-row.component.test.js | 64 +++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js diff --git a/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js new file mode 100644 index 000000000..334ec4497 --- /dev/null +++ b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js @@ -0,0 +1,64 @@ +import React from 'react' +import assert from 'assert' +import { shallow } from 'enzyme' +import ConfirmDetailRow from '../confirm-detail-row.component.js' +import sinon from 'sinon' + +const propsMethodSpies = { + onHeaderClick: sinon.spy(), +} + +describe('Confirm Detail Row Component', function () { + let wrapper + + beforeEach(() => { + wrapper = shallow() + }) + + describe('render', () => { + it('should render a div with a confirm-detail-row class', () => { + assert.equal(wrapper.find('div.confirm-detail-row').length, 1) + }) + + it('should render the label as a child of the confirm-detail-row__label', () => { + assert.equal(wrapper.find('.confirm-detail-row > .confirm-detail-row__label').childAt(0).text(), 'mockLabel') + }) + + it('should render the headerText as a child of the confirm-detail-row__header-text', () => { + assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__header-text').childAt(0).text(), 'mockHeaderText') + }) + + it('should render the fiatText as a child of the confirm-detail-row__fiat', () => { + assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__fiat').childAt(0).text(), 'mockFiatFee') + }) + + it('should render the ethText as a child of the confirm-detail-row__eth', () => { + assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__eth').childAt(0).text(), '♦ mockEthFee') + }) + + it('should set the fiatTextColor on confirm-detail-row__fiat', () => { + assert.equal(wrapper.find('.confirm-detail-row__fiat').props().style.color, 'mockColor') + }) + + it('should assure the confirm-detail-row__header-text classname is correct', () => { + assert.equal(wrapper.find('.confirm-detail-row__header-text').props().className, 'confirm-detail-row__header-text mockHeaderClass') + }) + + it('should call onHeaderClick when headerText div gets clicked', () => { + wrapper.find('.confirm-detail-row__header-text').props().onClick() + assert.equal(assert.equal(propsMethodSpies.onHeaderClick.callCount, 1)) + }) + + + }) +}) From 6eadf5b22b9ffac4fe41be0e690e95f825e700ea Mon Sep 17 00:00:00 2001 From: Sara Reynolds Date: Wed, 25 Jul 2018 16:26:30 -0700 Subject: [PATCH 2/3] Update prop names --- .../tests/confirm-detail-row.component.test.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js index 334ec4497..fb5cff1c1 100644 --- a/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js +++ b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js @@ -8,7 +8,7 @@ const propsMethodSpies = { onHeaderClick: sinon.spy(), } -describe('Confirm Detail Row Component', function () { +describe.only('Confirm Detail Row Component', function () { let wrapper beforeEach(() => { @@ -16,16 +16,16 @@ describe('Confirm Detail Row Component', function () { errorType={'mockErrorType'} label={'mockLabel'} showError={false} - fiatFee = {'mockFiatFee'} - ethFee = {'mockEthFee'} - fiatFeeColor= {'mockColor'} + fiatText = {'mockFiatText'} + ethText = {'mockEthText'} + fiatTextColor= {'mockColor'} onHeaderClick= {propsMethodSpies.onHeaderClick} headerText = {'mockHeaderText'} headerTextClassName = {'mockHeaderClass'} />) }) - describe('render', () => { + describe.only('render', () => { it('should render a div with a confirm-detail-row class', () => { assert.equal(wrapper.find('div.confirm-detail-row').length, 1) }) @@ -39,11 +39,11 @@ describe('Confirm Detail Row Component', function () { }) it('should render the fiatText as a child of the confirm-detail-row__fiat', () => { - assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__fiat').childAt(0).text(), 'mockFiatFee') + assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__fiat').childAt(0).text(), 'mockFiatText') }) it('should render the ethText as a child of the confirm-detail-row__eth', () => { - assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__eth').childAt(0).text(), '♦ mockEthFee') + assert.equal(wrapper.find('.confirm-detail-row__details > .confirm-detail-row__eth').childAt(0).text(), 'mockEthText') }) it('should set the fiatTextColor on confirm-detail-row__fiat', () => { From 9934690bd976b74cadd3211ab492022d1ff00a20 Mon Sep 17 00:00:00 2001 From: Sara Reynolds Date: Wed, 25 Jul 2018 16:31:33 -0700 Subject: [PATCH 3/3] lint fix --- .../tests/confirm-detail-row.component.test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js index fb5cff1c1..6f2489071 100644 --- a/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js +++ b/ui/app/components/confirm-page-container/confirm-detail-row/tests/confirm-detail-row.component.test.js @@ -8,7 +8,7 @@ const propsMethodSpies = { onHeaderClick: sinon.spy(), } -describe.only('Confirm Detail Row Component', function () { +describe('Confirm Detail Row Component', function () { let wrapper beforeEach(() => { @@ -25,7 +25,7 @@ describe.only('Confirm Detail Row Component', function () { />) }) - describe.only('render', () => { + describe('render', () => { it('should render a div with a confirm-detail-row class', () => { assert.equal(wrapper.find('div.confirm-detail-row').length, 1) })