src/components/data-table-filters/data-table-filters.test.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from "react";
   6 import { mount, configure } from "enzyme";
   7 import DataTableFilter, { DataTableFilterItem } from "./data-table-filters";
   8
   9 import * as Adapter from 'enzyme-adapter-react-16';
  10 import { Checkbox, ButtonBase, ListItem, Button, ListItemText } from "@material-ui/core";
  11 import dataTableFilters from "./data-table-filters";
  12
  13 configure({ adapter: new Adapter() });
  14
  15 describe("<DataTableFilter />", () => {
  16     it("renders filters according to their state", () => {
  17         const filters = [{
  18             name: "Filter 1",
  19             selected: true
  20         }, {
  21             name: "Filter 2",
  22             selected: false
  23         }];
  24         const dataTableFilter = mount(<DataTableFilter name="" filters={filters} />);
  25         dataTableFilter.find(ButtonBase).simulate("click");
  26         expect(dataTableFilter.find(Checkbox).at(0).prop("checked")).toBeTruthy();
  27         expect(dataTableFilter.find(Checkbox).at(1).prop("checked")).toBeFalsy();
  28     });
  29
  30     it("updates filters after filters prop change", () => {
  31         const filters = [{
  32             name: "Filter 1",
  33             selected: true
  34         }];
  35         const updatedFilters = [, {
  36             name: "Filter 2",
  37             selected: true
  38         }];
  39         const dataTableFilter = mount(<DataTableFilter name="" filters={filters} />);
  40         dataTableFilter.find(ButtonBase).simulate("click");
  41         expect(dataTableFilter.find(Checkbox).prop("checked")).toBeTruthy();
  42         dataTableFilter.find(ListItem).simulate("click");
  43         expect(dataTableFilter.find(Checkbox).prop("checked")).toBeFalsy();
  44         dataTableFilter.setProps({filters: updatedFilters});
  45         expect(dataTableFilter.find(Checkbox).prop("checked")).toBeTruthy();
  46         expect(dataTableFilter.find(ListItemText).text()).toBe("Filter 2");
  47     });
  48
  49     it("calls onChange with modified list of filters", () => {
  50         const filters = [{
  51             name: "Filter 1",
  52             selected: true
  53         }, {
  54             name: "Filter 2",
  55             selected: false
  56         }];
  57         const onChange = jest.fn();
  58         const dataTableFilter = mount(<DataTableFilter name="" filters={filters} onChange={onChange} />);
  59         dataTableFilter.find(ButtonBase).simulate("click");
  60         dataTableFilter.find(ListItem).at(1).simulate("click");
  61         dataTableFilter.find(Button).at(0).simulate("click");
  62         expect(onChange).toHaveBeenCalledWith([{
  63             name: "Filter 1",
  64             selected: true
  65         }, {
  66             name: "Filter 2",
  67             selected: true
  68         }]);
  69     });
  70 });