P-RAD P-RAD - 3 months ago 39
React JSX Question

React with jest renderIntoDocument always returns null

I have been trying to test a react app using jest. but couldn't even move a step further. I have created a Simple Component and tried to test it with jest.

here is the component

import React from 'react'

export default class TestComponent extends React.Component{
render(){
return(
<h1>This is a Test Component</h1>
)
}
}


and the test

jest.dontMock('../src/components/TestComponent')

import TestComponent from '../src/components/TestComponent'
var React = require('react'),
TestUtils = require('react-addons-test-utils')

describe('TestComponent', () =>{

it('should Render Somehow',() => {
let testComponent = TestUtils.renderIntoDocument(
<TestComponent />
)
let com = TestUtils.scryRenderedDOMComponentsWithTag(testComponent, 'h1')
expect(com.length).toEqual(1);
console.log(com)
})
})


the output of testComponent is not really null it prints out something starting with 'Testcomponent{' but when I tried to find out anything from the testComponent using the scryRenderedDOMComponentsWithTag method this is a null always .

Thank you

Answer

the solution was to change

jest.dontMock('../src/components/TestComponent')

to

jest.unmock('../src/components/TestComponent')

link