enzyme

问题 I have a React component that I am trying to test using Enzyme/Jest. I am trying to figure out what the most appropriate test would be to ensure the component has rendered. My component has a prop shouldRender that, if false, will cause the component to not render. My component looks like this: import React from 'react'; const propTypes = { shouldRender: React.PropTypes.bool, }; class MyComponent extends React.Component { constructor(props) { super(props); this.state = { foo: 'bar', }; }

问题 I'm able to mock out the Alert to test that it's alert method is being called, but what I really want to test is pressing the ok button within the alert. import { Alert } from 'react-native'; it('Mocking Alert', () => { jest.mock('Alert', () => { return { alert: jest.fn() } }; }); const spy = jest.spyOn(Alert, 'alert'); const wrapper = shallow(<Search />); wrapper.findWhere(n => n.props().title == 'Submit').simulate('Press'); expect(spy).toHaveBeenCalled(); //passes }) I'm absolutely unsure

问题 Can anyone help me to test input.focus() in enzyme.I am writing the script with react.My code is below. public inputBox: any; componentDidUpdate = () => { setTimeout(() => { this.inputBox.focus(); }, 200); } render() { return ( <div> <input type = 'number' ref = {element => this.inputBox = element } /> </div> ); } 回答1: Other approach is to test if element gains focus, i.e. focus() is called on node element. To achieve this, focused element need to be referenced via ref tag like it takes place

问题 I have tried couple different ways of defining the mock function and all of my tries failed. When I try to define it as follow: jest.mock('../src/data/server', ()=> ({server: {report: jest.fn()}})); expect(server.report.mock).toBeCalledWith(id, data, () => {...}, () => {...}); I get the this error: expect(jest.fn())[.not].toBeCalledWith() jest.fn() value must be a mock function or spy. Received: undefined If I define the mock as : var spy = jest.mock('../src/data/server', ()=> ({server:

问题 I have searched this issue on stack-overflow, but couldn't find anything similar to me use case. I have container component like this. import React, { Component } from 'react'; import PropTypes from 'prop-types'; // API import BookingAPI from '../../../../api/BookingAPI'; class CustomerProfilePage extends Component { state = { list: [], totalRecords: 0, pageNo: 1, }; componentDidMount() { const { pageNo } = this.state; this.onGetBookingList({ pageNo }); } onGetBookingList = async ({ pageNo =

问题 I want to test a React class component. Let's say I have a method in my class that computes something based on the current state and props. import Component from './Component' const wrapper = enzyme.shallow(<Component {...props} />); it('does something', () => { expect(wrapper.instance().someInstanceMethod(input)).toBe(true); }); Typescript says Property 'someInstanceMethod' is not defined on type Component<any, any> . How can I tell Typscript how my class is looking and what methods it has?

问题 I have a component like that: <Parent> <Child/> </Parent> and <Child/> component have a method foo . I want test the foo method but I don't know how to access it. I tried: mount(<Parent><Child/></Parent>).props().children.foo or mount(<Parent><Child/></Parent>).children().foo but both them are undefined . I can't use .instance() because it's not root. I can't mount <Child/> only because the <Parent> add something (react-router's context.router ) on context and I need them when init <Child/> .

问题 I'm running unit tests using Jest and Enzyme for this very simple component render() : render() { return (<Input id='foo' ref={input => { this.refInput = input }} />) } it('should render Input', () => { wrapper = shallow(<Component />) expect(wrapper.find(Input)).toHaveLength(1) }) I'm also using the coverage option of Jest and there I see, that the line ref={input => { this.refInput = input }} is not covered by my test. What do I have to do to get a full covered unit test for this sample

问题 Hello I am trying to use Jest+Enzyme to test my react components. I am not using create react app so I find the error I am getting very strange. Does anybody know what I am doing wrong here? Here is the error: Out of the box, Create React App only supports overriding these Jest options: • collectCoverageFrom • coverageReporters • coverageThreshold • snapshotSerializers. These options in your package.json Jest configuration are not currently supported by Create React App: •

问题 I'm using the google script tag from their CDN (tried body and head) <script src="https://wikitags.com/js/googlecharts.min.js"></script> The Google Chart in my app works fine, however it's causing my Jest tests to fail... Inside of the <ChartComponent /> componentDidMount() { // Load the Visualization API and the corechart package. console.log('Chart mounted'); google.charts.load('current', { packages: ['corechart', 'line'] }); google.charts.setOnLoadCallback(this.getSocialData({ days: this