diff --git a/src/components/__tests__/FloatingActionBar.test.tsx b/src/components/__tests__/FloatingActionBar.test.tsx index 8053b7dd..991264d2 100644 --- a/src/components/__tests__/FloatingActionBar.test.tsx +++ b/src/components/__tests__/FloatingActionBar.test.tsx @@ -118,9 +118,9 @@ describe("FloatingActionBar", () => { await waitFor(() => { expect(screen.getByText("Image")).toBeInTheDocument(); - expect(screen.getByText("Annotate")).toBeInTheDocument(); expect(screen.getByText("Prompt")).toBeInTheDocument(); expect(screen.getByText("Output")).toBeInTheDocument(); + expect(screen.getByText("All nodes")).toBeInTheDocument(); }); }); @@ -179,23 +179,6 @@ describe("FloatingActionBar", () => { expect(mockAddNode).toHaveBeenCalledWith("imageInput", expect.any(Object)); }); - it("should call addNode when Annotate button is clicked", async () => { - render( - - - - ); - - await waitFor(() => { - expect(screen.getByText("Annotate")).toBeInTheDocument(); - }); - - const annotateButton = screen.getByText("Annotate"); - fireEvent.click(annotateButton); - - expect(mockAddNode).toHaveBeenCalledWith("annotation", expect.any(Object)); - }); - it("should call addNode when Prompt button is clicked", async () => { render( @@ -385,7 +368,7 @@ describe("FloatingActionBar", () => { }); describe("Browse Models Button", () => { - it("should render Browse models button", async () => { + it("should render All models button with Browse models title", async () => { render( @@ -394,10 +377,11 @@ describe("FloatingActionBar", () => { await waitFor(() => { expect(screen.getByTitle("Browse models")).toBeInTheDocument(); + expect(screen.getByText("All models")).toBeInTheDocument(); }); }); - it("should open ModelSearchDialog when Browse models button is clicked", async () => { + it("should open ModelSearchDialog when All models button is clicked", async () => { render( @@ -405,16 +389,91 @@ describe("FloatingActionBar", () => { ); await waitFor(() => { - expect(screen.getByTitle("Browse models")).toBeInTheDocument(); + expect(screen.getByText("All models")).toBeInTheDocument(); }); - const browseButton = screen.getByTitle("Browse models"); + const browseButton = screen.getByText("All models"); fireEvent.click(browseButton); expect(mockSetModelSearchOpen).toHaveBeenCalledWith(true); }); }); + describe("All Nodes Menu", () => { + it("should render All nodes button", async () => { + render( + + + + ); + + await waitFor(() => { + expect(screen.getByText("All nodes")).toBeInTheDocument(); + }); + }); + + it("should open All nodes dropdown when clicked", async () => { + render( + + + + ); + + await waitFor(() => { + expect(screen.getByText("All nodes")).toBeInTheDocument(); + }); + + fireEvent.click(screen.getByText("All nodes")); + + // Check representative items from different categories + expect(screen.getByText("Image Input")).toBeInTheDocument(); + expect(screen.getByText("Generate Image")).toBeInTheDocument(); + expect(screen.getByText("Router")).toBeInTheDocument(); + expect(screen.getByText("Output Gallery")).toBeInTheDocument(); + expect(screen.getByText("Annotate")).toBeInTheDocument(); + }); + + it("should call addNode when a node is selected from All nodes menu", async () => { + render( + + + + ); + + await waitFor(() => { + expect(screen.getByText("All nodes")).toBeInTheDocument(); + }); + + fireEvent.click(screen.getByText("All nodes")); + fireEvent.click(screen.getByText("Annotate")); + + expect(mockAddNode).toHaveBeenCalledWith("annotation", expect.any(Object)); + }); + + it("should close All nodes dropdown after selection", async () => { + render( + + + + ); + + await waitFor(() => { + expect(screen.getByText("All nodes")).toBeInTheDocument(); + }); + + fireEvent.click(screen.getByText("All nodes")); + + // Verify dropdown is open + expect(screen.getByText("Image Input")).toBeInTheDocument(); + + // Click an item + fireEvent.click(screen.getByText("Image Input")); + + // Dropdown should close - "Image Input" should no longer be visible + expect(screen.queryByText("Image Input")).not.toBeInTheDocument(); + }); + }); + describe("Edge Style Toggle", () => { it("should call setEdgeStyle with curved when currently angular", async () => { render(