Question

我一直试图找出如何使用Jasmine来测试在React组件的render()函数中定义的事件处理程序的结果。具体来说，我正在测试是否将无效参数传递到事件处理程序中，它应该引发错误。以下是一些示例代码：

        class App extends Component<{TestStore: any}, {}> {

          handleChangeDate = (increaseDate: boolean, typeOfDate: string) => {

            switch (typeOfDate) {

              case "day":

              currentTypeOfDate = store.returnDay;
              minBoundary = 1;
              maxBoundary = 31;
              break;

              case "month":

              currentTypeOfDate = store.returnMonth;
              minBoundary = 1;
              maxBoundary = 12;
              break;

              case "year":

              currentTypeOfDate = store.returnYear;
              minBoundary = 2000;
              maxBoundary = 2020;
              break;

              default:

              try {
                throw new TypeError("Incorrect typeOfdate given. Shoud be 'day', 'month', or 'year'");
              } catch (e) {
                console.log(e);
              }

            }
          }

      render() {

        const {TestStore} = this.props;

        return (
            <div className="background">
              <div id="top-arrow-container">
                <i id="month-up" className="up" onClick={e => this.handleChangeDate(true, "month")}></i>
                <i id="day-up" className="up" onClick={e => this.handleChangeDate(true, "day")}></i>
                <i id="year-up" className="up" onClick={e => this.handleChangeDate(true, "year")}></i>
              </div>
            </div>
        );

      }

    }

所以我正在尝试测试handleChangeDate(true, "test")，它应该返回TypeError。如何为此编写测试？从我所看到的，我是否使用酶的安装，茉莉花jQuery的setFixtures，React Test Utils的TestUtils.renderIntoDocument（）或其他东西？

在React组件的事件处理程序中测试错误结果

0 个答案: