Fehler: Diese Methode ist nur gedacht, um ausgeführt werden auf die einzelnen Knoten. 0 statt gefunden

Teste ich eine Tastenbelegung Funktion in einer Komponente. Die Komponente ist ziemlich einfach, um Ereignis-listener für das keyup und feuert eine redux action, das wird ausblenden der Komponente.

Habe ich aufgeräumt, meinen code hier, um nur die relevanten Informationen. Ich bin in der Lage, um den test zu passieren, wenn ich gerade das Shop Versand, um die Aktion nennen, aber natürlich wird die Niederlage der Zweck dieses Tests. Ich bin mit Enzym zu simulieren, die keyup Ereignis mit dem entsprechenden event-Daten (keycode für esc), aber ich komme über die Fehlermeldung unten.

MyComponent.js

import React, {Component, PropTypes} from 'react';
import styles from './LoginForm.scss';
import {hideComponent} from '../../actions';
import {connect} from 'react-redux';

class MyComponent extends Component {
  static propTypes = {
      //props
  };

  componentDidMount() {
    window.addEventListener('keyup', this.keybindingClose);
  }

  componentWillUnmount() {
    window.removeEventListener('keyup', this.keybindingClose);
  }

  keybindingClose = (e) => {
    if (e.keyCode === 27) {
      this.toggleView();
    }
  };

  toggleView = () => {
    this.props.dispatch(hideComponent());
  };

  render() {
    return (
      <div className={styles.container}>
        //render code
      </div>
    );
  }
}

export default connect(state => ({
  //code
}))(MyComponent);

MyComponent-test.js

import React from 'react';
import chai, {expect} from 'chai';
import chaiEnzyme from 'chai-enzyme';
import configureStore from 'redux-mock-store';
import {mount} from 'enzyme';
import {Provider} from 'react-redux';
import thunk from 'redux-thunk';
import {MyComponent} from '../../common/components';
import styles from '../../common/components/MyComponent/MyComponent.scss';

const mockStore = configureStore([thunk]);
let store;
chai.use(chaiEnzyme());

describe.only('<MyComponent/>', () => {
  beforeEach(() => {
    store = mockStore({});
  });

  afterEach(() => {
    store.clearActions();
  });

  it('when esc is pressed HIDE_COMPONENT action reducer is returned', () => {
    const props = {
      //required props for MyComponent
    };
    const expectedAction = {
      type: require('../../common/constants/action-types').HIDE_COMPONENT
    };
    const wrapper = mount(
      <Provider store={store} key="provider">
        <LoginForm {...props}/>
      </Provider>
      );
    //the dispatch function below will make the test pass but of course it is not testing the keybinding as I wish to do so
    //store.dispatch(require('../../common/actions').hideComponent());
    wrapper.find(styles.container).simulate('keyup', {keyCode: 27});
    expect(store.getActions()[0]).to.deep.equal(expectedAction);
  });
});

Fehler: Diese Methode ist nur gedacht, um ausgeführt werden auf die einzelnen Knoten. 0 statt gefunden.

in ReactWrapper.single (/Users/[name]/repos/[repoName]/webpack/test.config.js:5454:18 <- webpack:///~/Enzym/build/ReactWrapper.js:1099:0)

in ReactWrapper.simulieren (/Benutzer/[name]/repos/[repoName]/webpack/test.config.js:4886:15 <- webpack:///~/Enzym/build/ReactWrapper.js:531:0)

im Kontext. (/Users/[name]/repos/[repoName]/webpack/test.config.js:162808:55 <- webpack:///src/test/Komponenten/MyComponent-test.js:39:40)

Schreibe einen Kommentar