-
Notifications
You must be signed in to change notification settings - Fork 85
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(ffe-accordion-react): Create ID only once
This commit rewrites the tests to use Jest instead of mocha. Also, it fixes a minor bug where the UUID passed down from an accordion to its children (accordion items) would change on every render. Ain't nobody got time fo dat.
- Loading branch information
Kristofer Selbekk
committed
Jan 3, 2018
1 parent
a9f4c5b
commit dc94925
Showing
7 changed files
with
152 additions
and
170 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
{ | ||
"overrides": [ | ||
{ | ||
"files": [ "src/**/*.spec.js"], | ||
"env": { | ||
"jest": true | ||
} | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
|
||
import { AccordionItem, WhiteAccordion, } from '.'; | ||
import { shallow } from 'enzyme'; | ||
import React from 'react'; | ||
|
||
const getWrapper = props => shallow( | ||
<WhiteAccordion {...props}> | ||
<AccordionItem>Foo</AccordionItem> | ||
<AccordionItem>Bar</AccordionItem> | ||
</WhiteAccordion> | ||
); | ||
|
||
describe('<Accordion />', () => { | ||
it('renders an unorderered list', () => { | ||
const wrapper = getWrapper(); | ||
expect(wrapper.is('ul')).toBe(true); | ||
}); | ||
it('provides type property to each child', () => { | ||
const wrapper = getWrapper({ type: 'blue' }); | ||
expect(wrapper.find('AccordionItem').everyWhere(item => item.prop('type') === 'blue')).toBe(true); | ||
}); | ||
it('provides the same uuid property to each child', () => { | ||
const wrapper = getWrapper(); | ||
const children = wrapper.find('AccordionItem'); | ||
expect(children.first().prop('uuid')).toBe(children.last().prop('uuid')); | ||
}); | ||
it('provides different uuids for each instance of the accordion', () => { | ||
const oneWrapper = getWrapper(); | ||
const anotherWrapper = getWrapper(); | ||
expect( | ||
oneWrapper.find('AccordionItem').first().prop('uuid') | ||
).not.toBe( | ||
anotherWrapper.find('AccordionItem').last().prop('uuid') | ||
); | ||
}); | ||
}); |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,63 @@ | ||
import React from 'react'; | ||
import { shallow } from 'enzyme'; | ||
import sinon from 'sinon'; | ||
|
||
import { AccordionItem } from '.'; | ||
|
||
const getWrapper = props => shallow(<AccordionItem {...props} />); | ||
|
||
describe('<AccordionItem />', () => { | ||
it('renders without exploding', () => { | ||
const wrapper = getWrapper(); | ||
expect(wrapper.exists()).toBe(true); | ||
}); | ||
|
||
describe('expanded content', () => { | ||
const getWrapperWithExpandedContent = props => | ||
getWrapper({ expandedContent: 'Expanded content', ...props }); | ||
it('is hidden by default', () => { | ||
const wrapper = getWrapperWithExpandedContent(); | ||
expect(wrapper.state('isOpen')).toBe(false); | ||
}); | ||
it('can be shown to begin with', () => { | ||
const wrapper = getWrapperWithExpandedContent({ isOpen: true }); | ||
expect(wrapper.state('isOpen')).toBe(true); | ||
}); | ||
it('it toggled by clicking', () => { | ||
const wrapper = getWrapperWithExpandedContent(); | ||
wrapper.find('.ffe-accordion-item__toggler').simulate('click', { target: { nodeName: 'div' } }); | ||
expect(wrapper.state('isOpen')).toBe(true); | ||
}); | ||
it('is not toggled when clicked item is included in ignoredNodeNames prop', () => { | ||
const wrapper = getWrapperWithExpandedContent({ ignoredNodeNames: ['button'] }); | ||
wrapper.find('.ffe-accordion-item__toggler').simulate('click', { target: { nodeName: 'button' } }); | ||
expect(wrapper.state('isOpen')).toBe(false); | ||
}); | ||
it('is toggled by enter or space', () => { | ||
const wrapper = getWrapperWithExpandedContent(); | ||
|
||
wrapper.find('.ffe-accordion-item__toggler') | ||
.simulate('keyup', { target: { nodeName: 'div' }, keyCode: 13 }); // enter | ||
expect(wrapper.state('isOpen')).toBe(true); | ||
|
||
wrapper.find('.ffe-accordion-item__toggler') | ||
.simulate('keyup', { target: { nodeName: 'div' }, keyCode: 32 }); // esc | ||
expect(wrapper.state('isOpen')).toBe(false); | ||
}); | ||
it('toggling triggers onOpen and onClose props', () => { | ||
const onOpenSpy = sinon.spy(); | ||
const onCloseSpy = sinon.spy(); | ||
|
||
const wrapper = getWrapperWithExpandedContent({ onOpen: onOpenSpy, onClose: onCloseSpy }); | ||
wrapper.find('.ffe-accordion-item__toggler').simulate('click', { target: { nodeName: 'div' } }); | ||
|
||
expect(onOpenSpy.callCount).toBe(1); | ||
expect(onCloseSpy.callCount).toBe(0); | ||
|
||
wrapper.find('.ffe-accordion-item__toggler').simulate('click', { target: { nodeName: 'div' } }); | ||
|
||
expect(onOpenSpy.callCount).toBe(1); | ||
expect(onCloseSpy.callCount).toBe(1); | ||
}); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
import Enzyme from 'enzyme'; | ||
import Adapter from 'enzyme-adapter-react-16'; | ||
|
||
Enzyme.configure({ adapter: new Adapter() }); |