모카를 이용한 반응 테스트에 대한 불변의 위반

나는 일렉트론을 사용하여 반응 프로젝트를 설정하려고하고 있으며, 테스트 프레임 워크로 모카를 구성하기 시작했다.모카를 이용한 반응 테스트에 대한 불변의 위반

"test": "mocha -w --require babel-core/register --require ignore-styles ./app/test/helpers/browser.js ./app/**/*.spec.js --colors --growl"

내 사양 파일이 단순한를 설명하고 1 내가 시도하고 구성 요소를 반응 포함 할 때 문제가 발생 1.

에 해당된다는 주장했습니다

모든 내가 실행하면 잘 : 그는 내가 얕은가 마운트도 전에, 내 테스트에 포함되어

import style from './app.scss'; 
import React from 'react'; 
import {render} from 'react-dom'; 

export default class App extends React.Component { 

    render() { 
    return (
     <div> 
     <h1 className={style.title}> Hello World </h1> 
     </div> 
    ) 
    } 
} 

render(<App/>, document.getElementById('app'));

, 내가 얻을 :

Invariant Violation : _registerComponent (...) : 대상 컨테이너가 DOM 요소가 아닙니다.

나는 jsdom을 사용하고 같은 브라우저의 ENV를 설정 해요 :

import { jsdom } from 'jsdom' 

const exposedProperties = ['window', 'navigator', 'document']; 

global.document = jsdom(''); 
global.window = document.defaultView; 
Object.keys(document.defaultView).forEach((property) => { 
    if (typeof global[property] === 'undefined') { 
    exposedProperties.push(property); 
    global[property] = document.defaultView[property]; 
    } 
}); 

global.navigator = { 
    userAgent: 'node.js' 
};

출처

2016-08-28 Carlo

JSDom는 HTML 템플릿 걸릴 수 있으며 그래서 분명히 React.render 몰랐 하나를 제공하지 있었는지 요소 내 애플 리케이션을 렌더링합니다. 당신은 또한처럼 설정할 수 있습니다 워드 프로세서 당으로

global.document = jsdom("<!doctype html><html><body><div id='app'></div></body></html>");

는 jsdom.env에 설정 객체를 제공 할 수 JSDom을 설정할 때, 또는 내 경우에는 그냥 jsom()에 HTML 템플릿을 제공

을 템플릿이 URL에서 끌어

jsdom.env(
    "https://iojs.org/dist/", 
    ["http://code.jquery.com/jquery.js"], 
    function (err, window) { 
    console.log("there have been", window.$("a").length - 4, "io.js releases!"); 
    } 
);

, 또는 :

var jsdom = require("jsdom"); 

jsdom.env(
    '<p><a class="the-link" href="https://github.com/tmpvar/jsdom">jsdom!</a></p>', 
    ["http://code.jquery.com/jquery.js"], 
    function (err, window) { 
    console.log("contents of a.the-link:", window.$("a.the-link").text()); 
    } 
);

정적 HTML 사용.

는 또한 덜 자세한 방법, 내가 사용하는 일을 제공 : 마크 업이 단순히 일부 HTML입니다

var jsdom = require("jsdom").jsdom; 
var doc = jsdom(markup, options); 
var window = doc.defaultView;

출처

2016-08-28 14:16:25 Carlo

모카를 이용한 반응 테스트에 대한 불변의 위반

답변

관련 문제