2015-09-29 114 views
1

我一直在學習反應,我試圖讓一個笑話測試與shallowRender但總是shallowRenderer.getRenderOutput()返回null陣營開玩笑shallowRender getRenderOutput返回null

MyComponent.react.js

import React from 'react'; 

export default class MyComponent extends React.Component { 
    render() { 
    return <div>Hello World!</div>; 
    } 
} 

__test __/MyComponent.react.js

jest.dontMock('../MyComponent.react.js'); 

import React from 'react/addons'; 
import MyComponent from '../MyComponent.react.js'; 

var TestUtils = React.addons.TestUtils; 

describe('MyComponent',() => { 

    it('test',() => { 
    let shallowRenderer = TestUtils.createRenderer(); 
    shallowRenderer.render(<MyComponent/>); 
    let vdom = shallowRenderer.getRenderOutput(); 

    console.log(vdom); 
    expect(1).toEqual(1); 
    }); 
}); 

NPM測試

> [email protected] test /home/bruno/Stuffs/jest-test 
> jest 

Using Jest CLI v0.5.8 
PASS __tests__/MyComponent.js (0.897s) 
null 
1 test passed (1 total) 
Run time: 1.189s 

的package.json

{ 
    ... 
    "scripts": { 
    "test": "jest" 
    }, 
    "devDependencies": { 
    "babel": "^5.8.23", 
    "babel-jest": "^5.3.0", 
    "jest-cli": "^0.5.8", 
    "react": "^0.13.3", 
    "skin-deep": "^0.6.1" 
    }, 
    "jest": { 
    "scriptPreprocessor": "<rootDir>/node_modules/babel-jest", 
    "testFileExtensions": [ 
     "es6", 
     "js" 
    ], 
    "unmockedModulePathPatterns": [ 
     "<rootDir>/node_modules/react" 
    ], 
    "moduleFileExtensions": [ 
     "js", 
     "json", 
     "es6" 
    ] 
    } 
} 

回答

0

的automocking功能不與ES2015進口這樣的工作,如果你有require聲明更改MyComponent進口,你的代碼應該是工作。

這是Github issue

jest.dontMock('../MyComponent.react.js'); 

import React from 'react/addons'; 
const MyComponent require('../MyComponent.react.js'); // This is the important line!! 

var TestUtils = React.addons.TestUtils; 

describe('MyComponent',() => { 

    it('test',() => { 
    let shallowRenderer = TestUtils.createRenderer(); 
    shallowRenderer.render(<MyComponent/>); 
    let vdom = shallowRenderer.getRenderOutput(); 

    console.log(vdom); 
    expect(1).toEqual(1); 
    }); 
}); 
+0

試過了,對我來說它會拋出錯誤「TypeError:Component is a function」 –