Передача свойства динамически реагирующему компоненту не распознается тестом кармы - PullRequest
Новая
       31

Передача свойства динамически реагирующему компоненту не распознается тестом кармы

0 голосов
/ 03 мая 2018

Я пытаюсь проверить, получает ли свойство, которое передается реагирующему компоненту, правильное значение, но, похоже, оно не работает, потому что (я думаю) свойство получает свое значение динамически, зависит от состояния родительского компонента. Вот код (кратко): 

import React from 'react';
import InfiniteScroll from 'react-infinite-scroller';

class myClass extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      ....
      inputChanged: 0
      ....
  };

  ...

  render() {
    let items = [];

  ... code that retrieve items ...


    return (
        <InfiniteScroll
          pageStart={this.state.inputChanged ? 1 : 0} // page start is changed according to this.state.inputChanged value
          loadMore={this.loadMore.bind(this)}
          hasMore={this.state.hasMoreItems}
          loader={<div className="loader" key={0}>Loading ...</div>}
          threshold={200}
        >
          <div className="container-fluid">
            <div className="row">
              {items}
            </div>
          </div>
        </InfiniteScroll>
    );
  }
}

И в моем spec-файле: 

import React from 'react';
import {mount} from 'enzyme';
import {expect} from 'chai';

describe('myClass', () => {
    let wrapper;

      beforeEach(() => {
        wrapper = mount(
          <myClass/>,
          {attachTo: document.createElement('div')}
        );
      });

    it('set correct pageStart', done => {
        const InfiniteScroll = wrapper.find('InfiniteScroll');
        wrapper.setState({
          inputChanged: 1
        });
        expect(InfiniteScroll.props().pageStart).to.equal(1);
        done();
      });
}

Но, несмотря ни на что, InfinteScroll.props().pageStart равно 0, и тест не пройден. Насколько я понимаю, он должен был измениться с учетом wrapper.state().inputChanged, но это не так. Есть идеи почему?

Заранее спасибо!

1 Ответ

0 голосов
/ 04 мая 2018

Вы держите ссылку InfiniteScroll перед вызовом setState. Вам нужно переместить код, чтобы получить ссылку InfiniteScroll после setState. Вот обновленный тест. 

it('set correct pageStart', done => {
    wrapper.setState({
        inputChanged: 1
    });
    const InfiniteScroll = wrapper.find('InfiniteScroll');
    expect(InfiniteScroll.props().pageStart).to.equal(1);
    done();
});
...