github.com/tilt-dev/tilt@v0.33.15-0.20240515162809-0a22ed45d8a0/web/src/OverviewTableBulkActions.test.tsx (about) 1 import { 2 render, 3 screen, 4 waitForElementToBeRemoved, 5 } from "@testing-library/react" 6 import userEvent from "@testing-library/user-event" 7 import React from "react" 8 import { 9 cleanupMockAnalyticsCalls, 10 mockAnalyticsCalls, 11 } from "./analytics_test_helpers" 12 import { buttonsByComponent } from "./ApiButton" 13 import { mockUIButtonUpdates } from "./ApiButton.testhelpers" 14 import Features, { FeaturesTestProvider } from "./feature" 15 import { 16 BulkAction, 17 buttonsByAction, 18 OverviewTableBulkActions, 19 } from "./OverviewTableBulkActions" 20 import { ResourceSelectionProvider } from "./ResourceSelectionContext" 21 import { disableButton, oneUIButton } from "./testdata" 22 23 const TEST_SELECTIONS = ["frontend", "backend"] 24 25 const TEST_UIBUTTONS = [ 26 oneUIButton({ componentID: "database" }), 27 disableButton("frontend", true), 28 oneUIButton({ componentID: "frontend" }), 29 disableButton("backend", false), 30 ] 31 32 const OverviewTableBulkActionsTestWrapper = (props: { 33 resourceSelections: string[] 34 }) => { 35 const { resourceSelections } = props 36 const features = new Features(null) 37 return ( 38 <FeaturesTestProvider value={features}> 39 <ResourceSelectionProvider initialValuesForTesting={resourceSelections}> 40 <OverviewTableBulkActions uiButtons={TEST_UIBUTTONS} /> 41 </ResourceSelectionProvider> 42 </FeaturesTestProvider> 43 ) 44 } 45 46 describe("OverviewTableBulkActions", () => { 47 beforeEach(() => { 48 mockAnalyticsCalls() 49 mockUIButtonUpdates() 50 }) 51 52 afterEach(() => { 53 cleanupMockAnalyticsCalls() 54 }) 55 56 describe("when there are NO resources selected", () => { 57 it("does NOT display", () => { 58 render(<OverviewTableBulkActionsTestWrapper resourceSelections={[]} />) 59 60 expect(screen.queryByLabelText("Bulk resource actions")).toBeNull() 61 }) 62 }) 63 64 describe("when there are resources selected", () => { 65 beforeEach(() => { 66 render( 67 <OverviewTableBulkActionsTestWrapper 68 resourceSelections={TEST_SELECTIONS} 69 /> 70 ) 71 }) 72 73 it("does display", () => { 74 expect(screen.queryByLabelText("Bulk resource actions")).not.toBeNull() 75 }) 76 77 it("displays the selected resource count", () => { 78 expect( 79 screen.queryByText(`${TEST_SELECTIONS.length} selected`) 80 ).not.toBeNull() 81 }) 82 83 it("renders an 'Enable' button that does NOT require confirmation", async () => { 84 const enableButton = screen.queryByLabelText("Trigger Enable") 85 expect(enableButton).toBeTruthy() 86 87 // Clicking the button should NOT bring up a confirmation step 88 userEvent.click(enableButton as HTMLElement) 89 90 // Clicking an action button will remove the selected resources 91 // and the bulk action bar will no longer appear 92 await waitForElementToBeRemoved(screen.queryByLabelText("Trigger Enable")) 93 }) 94 95 it("renders a 'Disable' button that does require confirmation", () => { 96 const disableButton = screen.queryByLabelText("Trigger Disable") 97 expect(disableButton).toBeTruthy() 98 99 // Clicking the button should bring up a confirmation step 100 userEvent.click(disableButton as HTMLElement) 101 102 expect(screen.queryByLabelText("Confirm Disable")).toBeTruthy() 103 expect(screen.queryByLabelText("Cancel Disable")).toBeTruthy() 104 }) 105 106 it("clears the selected resources after a button has been clicked", async () => { 107 const enableButton = screen.queryByLabelText("Trigger Enable") 108 expect(enableButton).toBeTruthy() 109 110 // Click the enable button, since there's not the extra confirmation step 111 userEvent.click(enableButton as HTMLElement) 112 113 // Expect that the component doesn't appear any more since there are no selections 114 await waitForElementToBeRemoved( 115 screen.queryByLabelText("Bulk resource actions") 116 ) 117 }) 118 }) 119 120 describe("buttonsByAction", () => { 121 it("groups UIButtons by the bulk action they perform", () => { 122 const componentButtons = buttonsByComponent(TEST_UIBUTTONS) 123 const actionButtons = buttonsByAction( 124 componentButtons, 125 new Set(TEST_SELECTIONS) 126 ) 127 128 expect(actionButtons).toStrictEqual({ 129 [BulkAction.Disable]: [TEST_UIBUTTONS[1], TEST_UIBUTTONS[3]], 130 }) 131 }) 132 }) 133 })