Тестирование контекста React с помощью Enzyme - PullRequest
1 голос
/ 19 марта 2019

Неудача в тестировании компонента React, который использует Context.Consumer в наборе тестов Enzyme.

Компонент SideWrapper:

      const SidebarWrapper = props => (
      <SidebarContext.Consumer>
        {({ sidebar: { Component, isOpen, close } }) => (
          <OnOutsideClick
            onClick={event => {
              /* this class is added to hamburger menu to avoid opening + closing at the same time */
              if (!event.target.className.includes("override-outside-click")) {
                close();
              }
            }}
          >
            <div className={classNames("sidebar", { "sidebar--open": isOpen })}>
              <Component />
            </div>
          </OnOutsideClick>
        )}
      </SidebarContext.Consumer>
    );

Голый минимум, чтобы показать проблему:

        describe("<SidebarWrapper />", () => {
        it("test", () => {
            const app = mount
            (
                <SidebarWrapper />
            );
            expect(app.find(".sidebar"));
        });
        });

Результатом является «Ошибка типа: невозможно прочитать свойство« Компонент »из неопределенного». Поставщик уже имеет компонент «Загрузка» по умолчанию, проблема не существует.

Также пытался использовать babel-rewire-plugin для насмешки SidebarContext с фиктивным компонентом, тогда я получаю ошибку:

Нарушение инварианта: недопустимый тип элемента: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получено: object.

В моем package.json есть:

"enzyme": "^3.6.0",
"enzyme-adapter-react-16": "^1.5.0",
"react": "^16.8.4",
"react-dom": "^16.8.4"

Есть идеи, как заставить это работать?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...