enzyme

问题 Here is my test file // /imports/components/main.test.js import React from 'react' import { shallow, mount } from 'enzyme' import Main from './main' import TextInput from "/imports/ui/textInput" ... and the main.js has // /imports/components/main.js import { action1 } from "/imports/actions/myAction" but it throws an error when I run the test, saying Cannot find module '/imports/actions/myAction' from 'main.js' If I comment the import './main' , same thing happen with importing TextInput. I

问题 I want to test Input jsx element for maxLength . My element in react- const ValidatedInput = ({ name, labelName, value, onChange, disabled, maxLength = 10 }) => { return ( <div className="form-group"> <label className="form-control-label" htmlFor={name}> {labelName} </label> <Input className="form-control" type="text" id={name} name={name} value={value} autoComplete="off" onChange={onChange} disabled={disabled} maxLength={maxLength} /> </div> ) }; My test is it('should not content more that

问题 I am learning taking this testing course to test connected components by setting up a store factory test helper that 'creates a store for testing that matches the configuration of our store'. Below, you can see my connected sample component as well as the code used to setup tests, in which I create a connected, shallow enzyme wrapper of my sample component. However, it seems like the initial state I am passing to the sample component, in this case {jotto: 'foo'} is not getting passed to my

问题 I have this React component having Material UI Dialog Using Full screen dialog from here https://material-ui.com/demos/dialogs/ import React from 'react'; import PropTypes from 'prop-types'; import Button from '@material-ui/core/Button'; import Dialog from '@material-ui/core/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; import DialogContent from '@material-ui/core/DialogContent'; import DialogContentText from '@material-ui/core/DialogContentText'; import DialogTitle

问题 I have a react function which renders a component according to the value of props being passed. The function looks as shown below: getPhoneComp() { if (this.props.contactDetails.countPhone === 1) return (<PhoneComp contactDetails={this.props.contactDetails.phoneSet[0]} contactId={this.props.contactDetails.contactId} errorHandler={this.props.errorHandler} updateMobileNo={this.props.updateMobileNo} />); else if (this.props.contactDetails.countPhone === 2) { return ( <div> <div className=

问题 This question is similar to How would you mock 'onPress' within Alert? However, since the solution given there doesn't apply in this case, I am posting this new question. I am using an external library that provides similar functionality to react-native Alert.alert, and adds async support. The library is https://github.com/slorber/react-native-alert-async. I am trying to mock OK / cancel events on that async alert ( AlertAsync ), but, as wrote above, the solution for the 'standard' react

问题 I have written some test cases and everything seems fine except the following one. I am getting zero branch cover for one file. I have googled couple of blog and I came to understand if the statement cab be executed in multiple scenario that call branch coverage. But I don't find my code can be executed in multiple way. request.js import axios from 'axios'; export default async (request, httpService = axios) => { const { method, url, data, headers, } = request; return httpService.request({

问题 I have updated some of the dependencies today in my project, but it went through really smoothly. Now, when I'm about to push it, I started my tests. And boom. All of them throw: Your test suite must contain at least one test. My packages: "jest": "23.1.0", "jest-enzyme": "^6.0.1", "jest-webpack-alias": "^3.3.3", "jsdom": "^11.2.0", "jsdom-global": "^3.0.2", "enzyme": "3.3.0", "enzyme-adapter-react-16": "^1.1.0", "enzyme-to-json": "3.3.4", And that is how my sample test file looks like:

问题 I am building an app with React. I am hiding a file input element ( <input type="file"/> ) "behind" a react-bootstrap Button to be able to control styling. So, when the button is clicked I turn around and fire a synthetic click event on the text input element, as shown below. class OpenFileButton extends React.Component { ... clickHandler() { this.refs['input'].click(); } render() { return ( <ButtonGroup> <div> <input type="file" onChange={this.props.someCallback} ref="input" style={{display:

问题 I have a function say onClickOfCreateAccountButton which is being called from my Child Component on click of a button but the logic is written in the Parent Component. How do I simulate it? My code: onClickOfCreateAccountButton() { const el = document.getElementsByClassName('SignInSlider-loginSlider')[0]; const el1 = document.getElementsByClassName('SignInSlider-createAccountSlider')[0]; el.classList.add('SignInSlider-animate-show'); el.classList.remove('SignInSlider-animate-hide');