enzyme

问题 I'm building an app in React Native. We recently started using TypeScript in the app and my task is to migrate the unit tests. There is one test that is miracously failing. The app has a <LoginForm /> that uses Formik. //... imports export interface FormValues { email: string; password: string; } export interface Props { navigation: NavigationScreenProp<any, any>; } export default class LoginForm extends Component<Props, object> { handleSubmit = (values: FormValues, formikBag: FormikActions

问题 I have the following component: render() { return ( <textarea onChange={this.handlechange} value="initial value" /> ) } handlechange = (e) => { console.log(e.currentTarget.value); } and the corresponding test that's supposed to check if on change fired correctly or not: const TEST_PROPS = { OnChange: jest.fn() } it("Fires on change correctly", () => { const textArea = enzyme.mount(<TextArea {...TEST_PROPS} />); jest.resetAllMocks(); expect(textArea.find("textarea").simulate("change")); expect

问题 I'm currently testing a component that relies on a an external script with webpack externals. DBPanel.js: import React, { PureComponent } from 'react'; import $ from 'jquery'; And the webpack externals file looks like this: webpack.config.js: externals: { jquery: "jQuery", Materialize: "Materialize" } When I import the the file in my test import DBPanel from '../components/DBPanel'; I get this error: Error: Cannot find module 'jquery' 来源： https://stackoverflow.com/questions/45724728/enzyme

问题 I want to write the test cases using jest, enzyme for my react component which connected with the redux store. The test case simply checks whether there is any "div" tag in the component or not. I have created a class component and connected it to the redux store. I have tried writing a simple test case which should log the html of the component using wrapper.debug(). //Category component import React, { Component } from 'react'; import { connect } from "react-redux"; import { Link } from

问题 I am having a problem creating a snapshot test with Jest and Enzyme on a component using SVG sprites. I am using the package svg-sprite-loader: https://github.com/kisenka/svg-sprite-loader Here is the component that's giving it trouble: import React from 'react'; import dieIcons from '../../public/images/dieIcons.svg'; const DieIcon = (props) => ( <svg className={`die__icon icon-${props.name}`} onMouseDown={props.onMouseDown} onMouseUp={props.onMouseUp} onMouseOut={props.onMouseOut}> <use

问题 I'm trying to use Enzyme to test a component's method. I know the typical way to do this is to use Enzyme's instance() method. The thing is, this only work for root component and my component need to be wrapper in two Context provider to render (namely, react-router and apollo client). const wrapper = mount( <ApolloProvider client={client}> <MemoryRouter initialEntries={["/login"]}> <AuthFormContainer /> </MemoryRouter> </ApolloProvider> ); How can I test methodA of AuthFormContainer in that

问题 Any documentation on what's the purpose of adapter in enzyme testing library. import { configure } from 'enzyme'; import Adapter from 'enzyme-adapter-react-16'; configure({ adapter: new Adapter() }); 回答1: Any documentation on what's the purpose of adapter in enzyme testing library. The closest it gets is to say "You will need to install enzyme along with an Adapter corresponding to the version of react (or other UI Component library) you are using". The docs mostly just explain how to

问题 Alright I have a component called <TestButton /> . Inside the <TestButton /> there are two Semantic UI React component, <Button /> and <Header> . Basically, when the <Button> is clicked, it toggles display: none; to <Header> . I want to check (I want to learn) on how to assert <Header> 's display: none; when <Button> is clicked. TestButton.js const TestButton = (props) => { return ( <div id='test-button'> <Header id='please-hide-me' size='huge'>Please Hide Me</Header> <Button onClick={ () =>

问题 I have a react component that renders conditionally (renders if data is fetched otherwise returns null) and I want to test this with jest & enzyme . The problem that I'm having is I want to test one of the methods in the class but .instance() keeps returning null so it doesn't allow me to test the instance. my code looks something like this export default class MyComponent extends React.Component<Props, State> { componentDidMount() { this.props.fetchData.then(() => this.setState({ loaded:

问题 Created a simple app using create-react-app then updated my App.js and added redux/store. class App extends Component { render() { return ( <header className="header"> <h1>todos</h1> </header> ); } } function mapStateToProps(state) { return { data: state.data }; } function mapDispatchToProps(dispatch) { return bindActionCreators(ActionCreators, dispatch); } export default connect(mapStateToProps, mapDispatchToProps)(App); then trying to test my App on App.test.js using Enzyme and Jest. import