diff --git a/src/Explorer/Tabs/DocumentsTabV2/DocumentsTableComponent.test.tsx b/src/Explorer/Tabs/DocumentsTabV2/DocumentsTableComponent.test.tsx new file mode 100644 index 000000000..da5d6be04 --- /dev/null +++ b/src/Explorer/Tabs/DocumentsTabV2/DocumentsTableComponent.test.tsx @@ -0,0 +1,84 @@ +import { TableRowId } from "@fluentui/react-components"; +import { ReactWrapper, mount } from "enzyme"; +import React from "react"; +import { DocumentsTableComponent, IDocumentsTableComponentProps } from "./DocumentsTableComponent"; + +const PARTITION_KEY_HEADER = "partitionKey"; +const ID_HEADER = "id"; + +describe("DocumentsTableComponent", () => { + + const createMockProps = (): IDocumentsTableComponentProps => ({ + items: [ + { [ID_HEADER]: "1", [PARTITION_KEY_HEADER]: "pk1" }, + { [ID_HEADER]: "2", [PARTITION_KEY_HEADER]: "pk2" }, + { [ID_HEADER]: "3", [PARTITION_KEY_HEADER]: "pk3" } + ], + onItemClicked: (index: number): void => { + index; + }, + onSelectedRowsChange: (selectedItemsIndices: Set): void => { + selectedItemsIndices; + }, + selectedRows: new Set(), + size: { + height: 0, + width: 0 + }, + columnHeaders: { + idHeader: ID_HEADER, + partitionKeyHeaders: [PARTITION_KEY_HEADER] + } + }); + + let wrapper: ReactWrapper; + describe("when rendered", () => { + beforeEach(() => { + const props: IDocumentsTableComponentProps = createMockProps(); + wrapper = mount(); + }); + + afterEach(() => { + wrapper.unmount(); + }); + + it("should show id and partition key(s) in header", () => { + expect(wrapper.find(".fui-TableHeader").findWhere(node => node.text() === ID_HEADER).exists()).toBeTruthy(); + expect(wrapper.find(".fui-TableHeader").findWhere(node => node.text() === PARTITION_KEY_HEADER).exists()).toBeTruthy(); + }); + + it("should show documents", () => { + const rows = wrapper.find(".fui-TableBody .fui-TableRow"); + expect(rows.length).toBe(3); + expect(rows.at(1).findWhere(node => node.text() === "2").exists()).toBeTruthy(); + expect(rows.at(1).findWhere(node => node.text() === "pk2").exists()).toBeTruthy(); + }); + }); + + describe("selection", () => { + afterEach(() => { + wrapper.unmount(); + }); + + it("should clear selection when clicking on row", () => { + const onSelectedRowsChange = jest.fn().mockName('onSelectedRowsChange'); + const onItemClicked = jest.fn().mockName('onItemClicked'); + + const props: IDocumentsTableComponentProps = { + ...createMockProps(), + selectedRows: new Set([1, 2]), + onSelectedRowsChange, + onItemClicked, + }; + wrapper = mount(); + const cell = wrapper.find(".fui-TableBody .fui-TableCell").findWhere(node => node.text() === "2"); + // const cell = wrapper.find(".fui-TableBody .fui-TableCell").findWhere(node => node.text() === "2" && node.type() === "function"); + // const cell = wrapper.find("[title~=\"2\"]"); + cell.at(4).simulate("click"); + + expect(onItemClicked).toHaveBeenCalledWith(2); + expect(onSelectedRowsChange).toHaveBeenCalledWith(new Set([2])); + }); + }); +}); +