Насмешка от HO C в реакции на моментальные снимки - PullRequest
Новая
       55

Насмешка от HO C в реакции на моментальные снимки

0 голосов
/ 26 января 2020

Я пытаюсь правильно смоделировать реквизит для простого компонента кнопки выхода. Единственная опора в этом компоненте - это firebase опора, которая исходит от компонента высшего порядка (HO C), называемого withFirebase. 

import React from 'react';
import { withFirebase } from '../Firebase';

const SignOutButton = ({ firebase }) => (
  <button type="button" onClick={firebase.doSignOut}>
    Sign Out
  </button>
);

export default withFirebase(SignOutButton);
export { SignOutButton as SignOutButtonTest };

Я думал, что я мог бы экспортировать функциональный компонент без HO C и непосредственно смоделируйте опору firebase и передайте ее компоненту для теста моментального снимка. 

import React from 'react';
import renderer from 'react-test-renderer';
import SignOutButtonTest from '../SignOutButton';

describe('SignOutButton Tests', () => {
    it('renders with some data', () => {
        const props = {
            firebase: {
                doSignOut: () => {},
            }
        };
        const tree = renderer.create(
            <SignOutButtonTest {...props} />
        ).toJSON();
        expect(tree).toMatchSnapshot();
    });
});

Однако, когда я запускаю этот тест, я получаю следующий TypeError. Любые мысли о том, как правильно издеваться над этой firebase опорой для теста снимка? 

  ● SignOutButton Tests › renders with some data

    TypeError: Cannot read property 'doSignOut' of null

      3 | 
      4 | const SignOutButton = ({ firebase }) => (
    > 5 |   <button type="button" onClick={firebase.doSignOut}>
        |                                           ^
      6 |     Sign Out
      7 |   </button>
      8 | );

1 Ответ

0 голосов
/ 26 января 2020

Использовать именованный экспорт вместо экспорта по умолчанию. Здесь: 

import SignOutButtonTest from '../SignOutButton';

вы все еще импортируете версию HO C.

Это должно быть: 

import { SignOutButtonTest } from '../SignOutButton';
...