Question

我已经使用React-data-grid（link）创建了带有react的数据网格

我的代码如下：

data: Joi.when(
        'metadata.type', 
        { 
            is: 'setup', 
            then: trialIdRequired,
            otherwise: trialIdNotRequired
        })

我是编写单元测试的新手，最近一直在编写非常基本的单元测试。我想知道使用Jest / Enzyme来测试onGridSort方法的最佳方法是什么

在我的测试中，我目前有以下内容：

import React, { useState } from "react";
import ReactDataGrid from 'react-data-grid';

const ROW_COUNT = 20;
const MIN_WIDTH = 100;

const defaultColumnProperties = {
    resizable: true,
    sortable: true
};

const columns = [
    {
        key: "eventTypeNameI18n",
        name: "Type",
    },
    {
        key: "nameI18n",
        name: "Name",
        width: 160
    },
    {
        key: "dateCreated",
        name: "Time",
        width: 220
    },
    {
        key: "locationNameI18n",
        name: "Location",
        width: 200
    }
].map(col => ({...col, ...defaultColumnProperties}));

const sortRows = (initialRows, sortColumn, sortDirection) => rows => {
    const comparer = (a, b) => {
        if (sortDirection === "ASC") {
            return a[sortColumn] > b[sortColumn] ? 1 : -1;
        } 
        else if (sortDirection === "DESC") {
            return a[sortColumn] < b[sortColumn] ? 1 : -1;
        }
    };
    return sortDirection === "NONE" ? initialRows : [...rows].sort(comparer);
};

function DataGrid({initialRows}) {

    const [rows, setRows] = useState(initialRows);

    return (

        <ReactDataGrid
            id="EventDataGrid"
            columns={columns}
            rowGetter={i => rows[i]}
            rowsCount={ROW_COUNT}
            minColumnWidth={MIN_WIDTH}
            onGridSort={(sortColumn, sortDirection) =>
                setRows(sortRows(initialRows, sortColumn, sortDirection))
            }
        />

    );
}

export default DataGrid;

我要测试以确保网格正确排序（按升序/降序排列）

如何使用react-data-grid测试功能组件

0 个答案: