enzyme

问题 I am using UseHistory hook in react router v5.1.2 with typescript? When running unit test, I have got issue. TypeError: Cannot read property 'history' of undefined. import { mount } from 'enzyme'; import React from 'react'; import {Action} from 'history'; import * as router from 'react-router'; import { QuestionContainer } from './QuestionsContainer'; describe('My questions container', () => { beforeEach(() => { const historyHistory= { replace: jest.fn(), length: 0, location: { pathname: '',

问题 I am using jest and enzyme to test my react component. I am also using blueprint icons as one of the dependency in my react component. As part of my webpack config, following is added: config.resolve.alias = { blueprintIcons: path.resolve('./node_modules/@blueprintjs/icons'), blueprint: path.resolve('./node_modules/@blueprintjs/core') }; Following is added as part of jest config: rootDir: '.', roots: [ '<rootDir>/__test__/' ], transformIgnorePatterns: [ '<rootDir>/node_modules/' ], transform:

问题 I'm trying to shallow render a component to perform some basic unit tests. The component I am doing this on has two child components which are rendered several times each depending on the parents props. When querying the shallow rendered component, the child elements are being rendered -fully- also, meaning that the children's HTML elements are also accessible. I am using Karma, Browserify, Jasmine and Enzyme, and can post the configs for each if needed. Has anybody seen similar behaviour

问题 I'm trying to shallow render a component to perform some basic unit tests. The component I am doing this on has two child components which are rendered several times each depending on the parents props. When querying the shallow rendered component, the child elements are being rendered -fully- also, meaning that the children's HTML elements are also accessible. I am using Karma, Browserify, Jasmine and Enzyme, and can post the configs for each if needed. Has anybody seen similar behaviour

问题 I am trying to use Enzyme's shallow wrapper to get the instance of my component and calling my class function over it. It shows me this error: TypeError: tree.instance(...).onCampaignSelected is not a function class ToolbarPage extends Component { constructor(){ super(); this.onCampaignSelected = this.onCampaignSelected.bind(this); this.state = { item: null } } onCampaignSelected (item) { this.setState({item}) } render () { return ( <MyComponent onItemSelected={this.onCampaignSelected} /> ) }

问题 I have to write unit test cases for a PlayerList container and Player component. Writing test cases for branches and props is OK, but how do I test the component's methods and the logic inside them. My code coverage is incomplete because the methods are not tested. Scenario: Parent component passes a reference to its method onSelect as a callback to child component. The method is defined in PlayerList component, but Player is generating the onClick event that calls it. Parent Component

问题 I'm relatively new to Jest and testing in general. I have a component with an input element: import * as React from "react"; export interface inputProps{ placeholder: string; className: string; value: string; onSearch: (depID: string) => void; } onSearch(event: any){ event.preventDefault(); //the actual onclick event is in another Component this.props.onSearch(event.target.value.trim()); } export class InputBox extends React.Component<inputProps, searchState> { render() { return ( <input

问题 I'm relatively new to Jest and testing in general. I have a component with an input element: import * as React from "react"; export interface inputProps{ placeholder: string; className: string; value: string; onSearch: (depID: string) => void; } onSearch(event: any){ event.preventDefault(); //the actual onclick event is in another Component this.props.onSearch(event.target.value.trim()); } export class InputBox extends React.Component<inputProps, searchState> { render() { return ( <input

问题 The full error message: Invariant Violation: Could not find "store" in either the context or props of "Connect(Portfolio)". Either wrap the root component in a , or explicitly pass "store" as a prop to "Connect(Portfolio)". Not sure why I'm getting this error in my Jest tests as my app is working and I can change my state with dispatch actions. index.js import React from 'react' import ReactDOM from 'react-dom' import { createStore, applyMiddleware, compose } from 'redux' import { Provider }

问题 I have a form as follow: import React from 'react/lib/ReactWithAddons'; import { server } from '../data/server'; export const Report = React.createClass({ mixins: [React.addons.LinkedStateMixin], sendReport(event) { event.preventDefault(); var data = { ac: this.ab.checked, cp: this.cp.checked, nr: this.nr.checked, il: this.il.checked, message: this.message.value, name: this.name.value, affiliation: this.affiliation.value, email: this.email.value, address: this.address.value, city: this.city