dom 환경이 효소에 대해로드되도록 보장

Jest의 React 앱을 명령 줄에서 테스트하는 동안 Enzyme의 mount 함수를 사용할 때 다음 오류가 발생합니다. DOM 환경이로드되지 않는다고 말하면서 JSDOM을 설정해야한다고 생각합니다. 그러나, 그것은 농담에 대한 페이 스북의 문서에 따르면 JSDOM ships with Jest and is preconfigured 나타납니다. 여기에 내 테스트입니다 :dom 환경이 효소에 대해로드되도록 보장

import React from 'react' 
import MyComponent from '../src/components/MyComponent' 
import { configure } from 'enzyme' 
import Adapter from 'enzyme-adapter-react-16' 
import { mount, shallow } from 'enzyme' 
import { Menu, Dropdown, Modal } from 'semantic-ui-react' 
import renderer from 'react-test-renderer'; 

configure({ adapter: new Adapter() }) 

test('it works',() => { 
    const wrapper = mount(
     <MyComponent /> 
    ) 
    expect(wrapper.contains('foobar')).toEqual(true) 
});

그리고 여기에 오류 발생 :

Enzyme's mount expects a DOM environment to be loaded, but found none 

    at assertDomAvailable (node_modules/enzyme-adapter-utils/build/Utils.js:107:11) 
    at ReactSixteenAdapter.createMountRenderer (node_modules/enzyme-adapter-react-16/build/ReactSixteenAdapter.js:203:52) 
    at ReactSixteenAdapter.createRenderer (node_modules/enzyme-adapter-react-16/build/ReactSixteenAdapter.js:384:25) 
    at new ReactWrapper (node_modules/enzyme/build/ReactWrapper.js:96:54) 
    at mount (node_modules/enzyme/build/mount.js:19:10) 
    at Object.<anonymous> (test/LinesheetModal.test.js:12:37) 
     at new Promise (<anonymous>)

효소 어댑터-반응-16과 관련된 것으로 보인다. 어떤 생각이 잘못 될 수 있습니까?

출처

2017-10-23 Kimberly

테스트를 어떻게 실행합니까? – Akhil

'npm test'는 package.json에서 정의 된 명령으로, 옵션없이'jest'를 실행합니다. – Kimberly

JSDOM과 효소가 제대로 설정되지 않은 것 같습니다. 사전로드 된 파일로이 파일을 추가하면 그것을 해결 농담하기 :

import Adapter from 'enzyme-adapter-react-16' 
import { configure } from 'enzyme' 
import jsdom from 'jsdom' 

function setUpDomEnvironment() { 
    const { JSDOM } = jsdom; 
    const dom = new JSDOM('<!doctype html><html><body></body></html>', {url: 'http://localhost/'}); 
    const { window } = dom; 

    global.window = window; 
    global.document = window.document; 
    global.navigator = { 
     userAgent: 'node.js', 
    }; 
    copyProps(window, global); 
} 

function copyProps(src, target) { 
    const props = Object.getOwnPropertyNames(src) 
     .filter(prop => typeof target[prop] === 'undefined') 
     .map(prop => Object.getOwnPropertyDescriptor(src, prop)); 
    Object.defineProperties(target, props); 
} 

setUpDomEnvironment(); 

configure({ adapter: new Adapter() })

출처

2017-10-23 20:02:30 Kimberly

농담이 상자 밖으로 JSDom로 구성되어 제공, 당신은 당신의 구성에서 testEnvironment: jsdom을 사용할 수 있는지 확인해야합니다.

출처

2018-02-11 10:29:52 SimenB

dom 환경이 효소에 대해로드되도록 보장

답변

관련 문제