Mirrors/plane
1
0
Fork 0
mirror of https://github.com/makeplane/plane.git synced 2026-07-12 13:29:56 +02:00
Code Issues Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
Satish Gandham
2024-12-09 12:03:31 +05:30
parent 4a7e67dc3d
commit 678e06eb62
6 changed files with 71 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/ui-v2/src/components/DropdownMenu/DropdownMenu.test.ts
View File

@@ -1,10 +0,0 @@
import { it, expect, describe } from "vitest";
import { render, screen } from "@testing-library/react";
import { DropdownButton } from "./components/DropdownButton";
// describe("DropdownMenu", () => {
// it("should render the dropdown button", () => {
// render(<DropdownButton>Click me</DropdownButton>);
// expect(screen.getByText("Click me")).toBeInTheDocument();
// });
// });

36
packages/ui-v2/src/components/DropdownMenu/DropdownMenu.test.tsx Normal file
View File

@@ -0,0 +1,36 @@
import { it, expect, describe } from "vitest";
import { render, screen } from "@testing-library/react";
import "@testing-library/jest-dom";
import React from "react";
import { DropdownButton } from "./components/DropdownButton";
import { DropdownMenu } from "./DropdownMenu";
import { DropdownContent } from "./components/DropdownContent";
describe("DropdownMenu", () => {
it("should render the dropdown menu", () => {
render(
<DropdownMenu>
<DropdownButton>Click me</DropdownButton>
</DropdownMenu>
);
expect(screen.getByText("Click me")).toHaveTextContent("Click me");
});
it("should render the dropdown arrow", () => {
render(
<DropdownMenu>
<DropdownButton showIcon>Click me</DropdownButton>
</DropdownMenu>
);
expect(screen.getByTestId("dropdown-arrow")).toBeInTheDocument();
});
it("Should not render the dropdown arrow if showIcon is false", () => {
render(
<DropdownMenu>
<DropdownButton>Click me</DropdownButton>
</DropdownMenu>
);
expect(screen.queryByTestId("dropdown-arrow")).not.toBeInTheDocument();
});
});

12
packages/ui-v2/src/components/DropdownMenu/components/DropdownButton.test.tsx
View File

@@ -1,12 +0,0 @@
import { it, expect, describe } from "vitest";
import { render, screen } from "@testing-library/react";
import { DropdownButton } from "./DropdownButton";
import "@testing-library/jest-dom";
import React from "react";
describe("DropdownMenu", () => {
it("should render the dropdown button", () => {
render(<DropdownButton>Click me</DropdownButton>);
expect(screen.getByText("Click me")).toHaveTextContent("Click me");
});
});

2
packages/ui-v2/src/components/DropdownMenu/components/DropdownButton.tsx
View File

@@ -24,7 +24,7 @@ export const DropdownButton = ({
>
<button>
{children}
{showIcon && <ChevronDownIcon />}
{showIcon && <ChevronDownIcon data-testid="dropdown-arrow" />}
</button>
</RadixDropdownMenu.Trigger>
);

31
packages/ui-v2/src/components/DropdownMenu/components/DropdownContent.test.tsx Normal file
View File

@@ -0,0 +1,31 @@
import { it, expect, describe } from "vitest";
import { render, screen } from "@testing-library/react";
import "@testing-library/jest-dom";
import React from "react";
import { DropdownMenu } from "../DropdownMenu";
import { DropdownContent } from "./DropdownContent";
import { DropdownButton } from "./DropdownButton";
let portalRoot = document.getElementById("portal");
if (!portalRoot) {
portalRoot = document.createElement("div");
portalRoot.setAttribute("id", "portal");
document.body.appendChild(portalRoot);
}
describe("DropdownContent", () => {
it("should render the dropdown content", () => {
render(
<DropdownMenu open>
<DropdownButton>Click me</DropdownButton>
<DropdownContent
container={document.getElementById("portal") || undefined}
>
Content.........
</DropdownContent>
</DropdownMenu>
);
console.log(screen.debug());
// expect(screen.getByText("Content")).toHaveTextContent("Content");
});
});

4
packages/ui-v2/src/components/DropdownMenu/components/DropdownContent.tsx
View File

@@ -5,8 +5,10 @@ import { DropdownItem } from "./DropdownItem";
export const DropdownContent = ({
children,
container,
}: {
children?: React.ReactNode;
container?: HTMLElement;
}) => {
const { items, renderItem, onSelect } = useContext(DropdownMenuContext);
@@ -26,7 +28,7 @@ export const DropdownContent = ({
}, [open]);
return (
<RadixDropdownMenu.Portal>
<RadixDropdownMenu.Portal container={container}>
<RadixDropdownMenu.Content className="p-3 rounded-md bg-white border border-border-neutral">
{children}
{items &&