The full error text is Invariant Violation: dangerouslyRenderMarkup(...): Cannot render markup in a worker thread. Make sure window
and document
are available globally before requiring React when unit testing or use ReactDOMServer.renderToString for server rendering.
I have searched this issue but all solutions are connected with jsdom set up. My jsdom set up is here :
import jsdom from 'jsdom';
import jquery from 'jquery';
import TestUtils from 'react-addons-test-utils';
import ReactDOM from 'react-dom';
import chai, { expect } from 'chai';
import React from 'react';
import chaiJquery from 'chai-jquery';
// Set up testing environment to run like a browser in the command line
global.document = jsdom.jsdom('<!doctype html><html><body></body></html>');
global.window = global.document.defaultView;
global.navigator = global.window.navigator;
const $ = jquery(global.window);
// build 'renderComponent' helper that should render a given react class
function renderComponent(ComponentClass, props, state) {
const componentInstance = TestUtils.renderIntoDocument(
<ComponentClass {...props} />
);
return $(ReactDOM.findDOMNode(componentInstance)); // produces HTML
}
// Build helper for simulating events
$.fn.simulate = function(eventName, value) {
if (value) {
this.val(value);
}
TestUtils.Simulate[eventName](this[0]);
}
// Set up chai-jquery
chaiJquery(chai, chai.util, $);
export { renderComponent, expect };
p.s. i don't use renderComponent function. I use enzyme mount instead
here is example of my test code
'use strict';
import React from 'react';
import { shallow, mount } from 'enzyme';
import sinon from 'sinon';
import chai, { expect } from 'chai';
import Profile_Store from '../profile.store';
import Signup from '../components/signup.component';
describe('__Signup__', ()=> {
let signup_stub, spySubmit, spyCloseHint, wrap, context, email, pssword, passwordConfirm, submit, form_hint, input__hint;
beforeEach(() => {
spySubmit = sinon.spy(Signup.prototype, 'handleSubmit');
signup_stub = sinon.stub(Profile_Store.prototype, 'signup');
spyCloseHint = sinon.spy(Profile_Store.prototype, 'clearErrorMessage');
context = {
profile: new Profile_Store()
};
wrap = mount(<Signup />, {context});
email = wrap.find('input[type="email"]');
pssword = wrap.find('input[type="password"]');
submit = wrap.find('button[type="submit"]');
input__hint = wrap.find('.input__hint');
form_hint = wrap.find('.form__hint');
});
afterEach(() => {
spySubmit.restore();
spyCloseHint.restore();
signup_stub.restore();
});
it("contains all inputs, button and validation hints", function() {
expect(email).to.have.length(1);
expect(pssword).to.have.length(2);
expect(submit).to.have.length(1);
expect(form_hint).to.have.length(1);
expect(input__hint).to.have.length(3);
});
it("validation messages are hidden by default", function() {
expect(form_hint.hasClass('hidden')).to.equal(true);
input__hint.forEach((hint) => {
expect(hint.hasClass('hidden')).to.equal(true);
});
});
it("validation messages are visible if error", function() {
context = {profile: new Profile_Store()};
wrap = mount(<Signup />, {context});
wrap.context().profile.errorMessage = 'registration failed';
expect(wrap.find('.form__hint').hasClass('visible')).to.equal(true);
expect(wrap.find('.form__hint > span').at(0).text()).to.equal('registration failed');
});
it("validation messages are hidden while click close hint", function() {
context.profile.errorMessage = 'registration failed';
wrap = shallow(<Signup />, {context});
wrap.find('.form__closeHint').simulate('click');
expect(context.profile.errorMessage).to.equal('');
wrap = shallow(<Signup />, {context});
expect(wrap.find('.form__hint').hasClass('visible')).to.equal(false);
sinon.assert.calledOnce(spyCloseHint);
});
it('form work correctly', () => {
const event = {target: {value: 'cats'}};
wrap.ref('email').simulate('change', event);
wrap.simulate('submit', { preventDefault() {} });
chai.assert.equal(spySubmit.callCount, 1);
sinon.assert.calledOnce(signup_stub);
});
it('don\'t handle Submit with empty values', () => {
wrap.setState({
validEmail: null,
validPassword: null,
validPasswordConfirm: false
});
wrap.simulate('submit', { preventDefault() {} });
sinon.assert.notCalled(signup_stub);
});
});
Aucun commentaire:
Enregistrer un commentaire