diff --git a/README.md b/README.md index 82b3703..af8a89f 100644 --- a/README.md +++ b/README.md @@ -21,7 +21,7 @@ let spy = sinon.spy() //Calling a prop -Test() //or shallow render Test(, {shallow: true}) +Test() .find('button') .simulate({method: 'click', element: 'button'}) .test(() => { @@ -112,6 +112,37 @@ Test() ~~~ +##DOM rendering +__Shallow__ -- uses React shallow rendering (no DOM) +~~~js +Test(, {shallow: true}) +.find('button') +.simulate({method: 'click', element: 'button'}) +.test(() => { + expect(spy.called).to.be.true +}) +~~~ + +__Normal__ -- React render into document fragment +~~~js +Test() +.find('button') +.simulate({method: 'click', element: 'button'}) +.test(() => { + expect(spy.called).to.be.true +}) +~~~ + +__fullDOM__ -- ReactDOM render into document.body.div of jsdom +~~~js +Test(
, {fullDOM: true}) +.test(function() { + expect(global.window.document.querySelector('section')) + .to.be.okay +}) +.clean() // restores the document.body to empty +~~~ + You can see more examples in the tests directory. ##Testing Alt Stores diff --git a/package.json b/package.json index a51b104..e55df02 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "legit-tests", - "version": "1.1.0", + "version": "1.1.1", "description": "a chainable testing library for React", "main": "legit-tests.js", "scripts": { diff --git a/src/middleware/find.js b/src/middleware/find.js index b10f65a..e0bc4df 100644 --- a/src/middleware/find.js +++ b/src/middleware/find.js @@ -36,11 +36,18 @@ export default function find(selector){ // data attribute case '[': + var attributeName = _.first( subselector.slice(1,-1).split('=') ) + var attributeValue = subselector.slice(1,-1).split('=').slice(1).join('=').replace(/^"(.*)"$/, '$1') + els = TestUtils.findAllInRenderedTree(self.instance, function(component){ if (component.getAttribute) { - return component.getAttribute(subselector.slice(1,-1)) + var val = component.getAttribute(attributeName) + if (val === attributeValue || (val === 'true' && attributeValue === '')){ + return true + } } }) + foundElements.push( Array.isArray(els) ? els : [els] ) break diff --git a/tests/components/component.jsx b/tests/components/component.jsx index f576506..8eefa00 100644 --- a/tests/components/component.jsx +++ b/tests/components/component.jsx @@ -23,6 +23,8 @@ export default class TestComponent extends Component { onClick={this.props.onClick}> Click Me + +
diff --git a/tests/find.jsx b/tests/find.jsx index 7ce57b0..b38ff8b 100644 --- a/tests/find.jsx +++ b/tests/find.jsx @@ -38,6 +38,16 @@ describe('Find middleware', () => { }) + it('should find an input with a name attribute that equals \'bob\'', ()=>{ + Test() + .find('input[name="bob"]') + .find('input[name]') + .test(function(){ + expect(this.elements['input[name="bob"]'].className).equal('bob') + expect(this.elements['input[name]'].className).equal('notbob') + }) + }) + it('should find a rendered component', () => { Test() .find(TinyComponent)