Question

有谁知道如何使用Jest / Enzyme测试AgGridReact？我正在尝试模拟应该自动调用的onGridReady回调，但它似乎没有被触发。这是我的测试的简化版本：

import React from "react";
import { mount} from "enzyme";

const AgGridReact =
  typeof window === "undefined"
    ? () => null
    : require("ag-grid-react").AgGridReact;

var spy = jest.fn();

// Grid.prototype.onGridReady = spy;
var columnDefs = [
  { headerName: "Make", field: "make" },
  { headerName: "Model", field: "model" },
  { headerName: "Price", field: "price" }
];

// specify the data
var rowData = [
  { make: "Toyota", model: "Celica", price: 35000 },
  { make: "Ford", model: "Mondeo", price: 32000 },
  { make: "Porsche", model: "Boxter", price: 72000 }
];

// let the grid know which columns and what data to use
var gridOptions = {
  columnDefs: columnDefs,
  rowData: rowData,
  onGridReady: spy
};

mount(<AgGridReact id="myGrid" {...gridOptions} />);

expect(spy).toHaveBeenCalledTimes(1);

任何想法/建议将不胜感激。谢谢！

Answer 1

而不是mount，你应该使用浅。酶浅层方法将暴露所有自定义事件，您可以轻松地模拟它们。

    //AgGridReact is wrapped inside Grid component
    const wrapper = shallow(<Grid/>)

    const agGridReact = wrapper.find(AgGridReact)

    agGridReact.simulate('gridReady')

Answer 2

函数onGridReady被异步调用，因此您无法在安装调用之后立即检查它。而是将其包装为Promise或在Jest中使用done函数。

如何使用Jest / Enzyme

2 个答案: