Как spyOn метод внутри prop передается компоненту с помощью Jest? - PullRequest
Новая
       50

Как spyOn метод внутри prop передается компоненту с помощью Jest?

0 голосов
/ 11 октября 2018

Фон:

Мой тестовый фреймворк - Jest and Enzyme.У меня есть компонент с именем Lazyload, который связан с LazyloadProvider с помощью React.ContextAPI.Я хотел бы написать тест, который гарантирует, что на componentDidMount из Lazyload Component inner prop метод this.props.lazyload.add() был вызван.Используя Jest Spy, я хотел бы ожидать, что hasBeenCalledWith(this.lazyRef) является действительным

Я получил шутку, чтобы иметь возможность шпионить за методом register Lazyload;Однако я не могу понять, как шпионить за методом внутреннего реквизита this.props.lazyload.add.

Вопрос:

Как мне написать шпионский шпион на this.props.lazyload.add и убедиться, что он вызывается с this.lazyRef? 

class Lazyload extends Component<LazyloadProps, LazyloadState> {
  lazyRef: ReactRef;

  constructor(props) {
    super(props);
    this.lazyRef = createRef();
  }

  componentDidMount() {
   this.register()
  }

  register() { // not spy on this.
    this.props.lazyload.add(this.lazyRef); // spyOn this
  }
}

Тест: 

describe('lazyload', () => {
  let provider;
  beforeEach(() => {
    provider = shallow(
      <LazyloadProvider>
        <p>Wow</p>
      </LazyloadProvider>
    ).instance();
  });

  it('should register a lazyloader with add', () => {
    const spy = jest.spyOn(Lazyload.prototype, 'register');

    const wrapper = shallow(
      <Lazyload lazyload={provider.engine}>
        <p>doge</p>
      </Lazyload>
    ).instance();

    expect(spy).toHaveBeenCalled(); // this works however it's a better test to spy on the this.prop.lazyload.add method.. but how?
  });
})

1 Ответ

0 голосов
/ 12 октября 2018

Вы можете передать заглушку add в lazyload проп и проверить с помощью toHaveBeenCalledWith соответствия, если он принимает instance () s lazyref: 

describe('lazyload', () => {

  it('should add ref', () => {
    const lazyloadStub = {
        add: jest.fn();
    };

    const wrapper = shallow(
      <Lazyload lazyload={lazyloadStub}>
        <p>doge</p>
      </Lazyload>
    );

    expect(lazyloadStub.add).toHaveBeenCalledWith(wrapper.instance().lazyRef); 
  });
})
...