Problem with TestUtils.renderIntoDoucment

[rzuniga64]

So I ran your Mocha/Chai tests and they failed. I kept getting this error:

 TypeError: document.createElement is not a function
  at Object.renderIntoDocument (node_modules\react-dom\lib\ReactTestUtils.js:85:24)
  at renderComponent (C:/User/Owner/mocha-chai/test/test_helper.js:29:46)
  at Context.<anonymous> (C:/User/Owner/mocha-chai/test/components/app_test.js:14:21)

So I looked at the React docs for renderIntoDocument and it states:

**renderIntoDocument(element) Render a React element into a detached DOM node in the document. This function requires a DOM.

Note: You will need to have window, window.document and window.document.createElement globally available before you import React. Otherwise React will think it can't access the DOM and methods like setState won't work.**

So if you look at the note you are not doing what it states in your tests. I tried to set window, window.document and window.document.createElement directly but I'm a noob at React so I used a solution from StackOverFlow:.

1. install jsdomify.
2. import jsdomify from 'jsdomify' into your test file.
3. Set jsdomify.creat() before calling React in beforeEeach method.
4. Do this for all test files. You have to do this for each "beforeEach". Then all tests passed.

so app_test.js will look like this:

import { renderComponent, expect } from '../test_helper'; import App from '../../src/components/app'; import {beforeEach} from 'mocha'; import jsdomify from 'jsdomify';

let React;

// Use 'describe' to group together similar tests describe('App', () => {

let component;

beforeEach(() => {
    jsdomify.create();
    React = require('react');
    component = renderComponent(App);
});

it('shows a comment box', () => {
    expect(component.find('.comment-box')).to.exist;
});

it('shows a comment list', () => {
    expect(component.find('.comment-list')).to.exist;
});

});