Содержимое Reactstrap Modal не видно для шутки - PullRequest
Новая
       17

Содержимое Reactstrap Modal не видно для шутки

0 голосов
/ 17 декабря 2018

Я собрал компонент в реаги, основанный на реактивном ремне, а затем использовал шут и фермент. Я не могу проверить содержание модального соединения.Давайте посмотрим, что я пробовал до сих пор: 

import React from 'react';
 import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';

    class ModalExample extends React.Component {
      constructor(props) {
        super(props);
        this.state = {
          modal: false
        };

        this.toggle = this.toggle.bind(this);
      }

      toggle() {
        this.setState({
          modal: !this.state.modal
        });
      }

      render() {
        return (
          <div className="modal-testing">
            <Button color="danger" onClick={this.toggle}>{this.props.buttonLabel}</Button>
            <Modal isOpen={this.state.modal} toggle={this.toggle} className={this.props.className}>
              <ModalHeader toggle={this.toggle}>Modal title</ModalHeader>
              <ModalBody className="inside">
                I just want this to show up in unit test
                Name: <input type="text" />
              </ModalBody>
              <ModalFooter>
                <Button color="primary" onClick={this.toggle}>Do Something</Button>{' '}
                <Button color="secondary" onClick={this.toggle}>Cancel</Button>
              </ModalFooter>
            </Modal>
          </div>
        );
      }
    }

    export default ModalExample;

И у меня есть свои юнит-тесты следующим образом: 

import React from 'react';
import {mount, ReactWrapper} from "enzyme";
import ModalExample from "./ModalExample";

const wrapper = mount(
    <ModalExample isOpen={isOpen} toggle={toggle} />
);
const button = wrapper.find('Button').at(0);
button.simulate('click');
// What I have tried
expect(wrapper.text()).toBe('I just want this to show up in unit test');
expect(wrapper.find('input')).toHaveLength(1); // it gets failed

Кстати, я уже пробовал этот метод, но это не такне работает:

Аналогичная проблема опубликована в stackoverflow

Но я не знаю, что я делаю неправильно, кто-нибудь может обнаружить какую-либо ошибку или исправить меня, если что-то не такв правильном направлении?

Ответы [ 2 ]

0 голосов
/ 18 декабря 2018

После долгих исследований я обнаружил, что это на самом деле responsestrap проблема с библиотекой, так как я использовал старую версию, например "Reactionstrap": "5.0.0-beta", поэтому я только что обновил actstrap Библиотека до последней версии: "Reactionstrap": "^ 6.5.0", и она сработала.

Спасибо @Herman за ваше время.

0 голосов
/ 18 декабря 2018

Ваш ModalExample не отображает его children проп, поэтому <p>Hello world</p> по существу игнорируется.Почему вы это передаете?

...