X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/616395646c46f90c46ad97bd9a335ab326e5a040..02fa1acae263e5cf28e95a36801cb578be941307:/src/components/data-table/data-table.test.tsx diff --git a/src/components/data-table/data-table.test.tsx b/src/components/data-table/data-table.test.tsx index 77979af6..1201dcb0 100644 --- a/src/components/data-table/data-table.test.tsx +++ b/src/components/data-table/data-table.test.tsx @@ -6,179 +6,199 @@ import * as React from "react"; import { mount, configure } from "enzyme"; import { TableHead, TableCell, Typography, TableBody, Button, TableSortLabel } from "@material-ui/core"; import * as Adapter from "enzyme-adapter-react-16"; -import DataTable, { DataColumns } from "./data-table"; -import DataTableFilters from "../data-table-filters/data-table-filters"; +import { DataTable, DataColumns } from "./data-table"; +import { DataTableFilters } from "../data-table-filters/data-table-filters"; +import { SortDirection, createDataColumn } from "./data-column"; configure({ adapter: new Adapter() }); describe("", () => { it("shows only selected columns", () => { const columns: DataColumns = [ - { + createDataColumn({ name: "Column 1", render: () => , - selected: true - }, - { + selected: true, + configurable: true + }), + createDataColumn({ name: "Column 2", render: () => , - selected: true - }, - { + selected: true, + configurable: true + }), + createDataColumn({ name: "Column 3", render: () => , - selected: false - } + selected: false, + configurable: true + }), ]; const dataTable = mount(); expect(dataTable.find(TableHead).find(TableCell)).toHaveLength(2); }); it("renders column name", () => { const columns: DataColumns = [ - { + createDataColumn({ name: "Column 1", render: () => , - selected: true - } + selected: true, + configurable: true + }), ]; const dataTable = mount(); expect(dataTable.find(TableHead).find(TableCell).text()).toBe("Column 1"); }); it("uses renderHeader instead of name prop", () => { const columns: DataColumns = [ - { + createDataColumn({ name: "Column 1", renderHeader: () => Column Header, render: () => , - selected: true - } + selected: true, + configurable: true + }), ]; const dataTable = mount(); expect(dataTable.find(TableHead).find(TableCell).text()).toBe("Column Header"); }); it("passes column key prop to corresponding cells", () => { const columns: DataColumns = [ - { + createDataColumn({ name: "Column 1", key: "column-1-key", render: () => , - selected: true - } + selected: true, + configurable: true + }) ]; const dataTable = mount(); expect(dataTable.find(TableHead).find(TableCell).key()).toBe("column-1-key"); expect(dataTable.find(TableBody).find(TableCell).key()).toBe("column-1-key"); }); - it("shows information that items array is empty", () => { - const columns: DataColumns = [ - { - name: "Column 1", - render: () => , - selected: true - } - ]; - const dataTable = mount(); - expect(dataTable.find(Typography).text()).toBe("No items"); - }); - it("renders items", () => { const columns: DataColumns = [ - { + createDataColumn({ name: "Column 1", render: (item) => {item}, - selected: true - }, - { + selected: true, + configurable: true + }), + createDataColumn({ name: "Column 2", render: (item) => , - selected: true - } + selected: true, + configurable: true + }) ]; - const dataTable = mount(); expect(dataTable.find(TableBody).find(Typography).text()).toBe("item 1"); expect(dataTable.find(TableBody).find(Button).text()).toBe("item 1"); }); it("passes sorting props to ", () => { - const columns: DataColumns = [{ + const columns: DataColumns = [ + createDataColumn({ name: "Column 1", - sortDirection: "asc", + sortDirection: SortDirection.ASC, selected: true, + configurable: true, render: (item) => {item} - }]; + })]; const onSortToggle = jest.fn(); - const dataTable = mount(); + onRowDoubleClick={jest.fn()} + onContextMenu={jest.fn()} + onSortToggle={onSortToggle} />); expect(dataTable.find(TableSortLabel).prop("active")).toBeTruthy(); dataTable.find(TableSortLabel).at(0).simulate("click"); expect(onSortToggle).toHaveBeenCalledWith(columns[0]); }); + it("does not display if there is no filters provided", () => { + const columns: DataColumns = [{ + name: "Column 1", + sortDirection: SortDirection.ASC, + selected: true, + configurable: true, + filters: [], + render: (item) => {item} + }]; + const onFiltersChange = jest.fn(); + const dataTable = mount(); + expect(dataTable.find(DataTableFilters)).toHaveLength(0); + }); + it("passes filter props to ", () => { const columns: DataColumns = [{ name: "Column 1", - sortDirection: "asc", + sortDirection: SortDirection.ASC, selected: true, - filters: [{name: "Filter 1", selected: true}], + configurable: true, + filters: [{ name: "Filter 1", selected: true }], render: (item) => {item} }]; const onFiltersChange = jest.fn(); - const dataTable = mount(); + onRowDoubleClick={jest.fn()} + onSortToggle={jest.fn()} + onContextMenu={jest.fn()} />); expect(dataTable.find(DataTableFilters).prop("filters")).toBe(columns[0].filters); dataTable.find(DataTableFilters).prop("onChange")([]); expect(onFiltersChange).toHaveBeenCalledWith([], columns[0]); }); - - -}); \ No newline at end of file +});