test(ui): strengthen disabled cursor assertions and fix linting
This commit is contained in:
@@ -23,9 +23,7 @@ describe("Button component", () => {
|
||||
render(<Button disabled>Disabled Button</Button>)
|
||||
const button = screen.getByRole("button", { name: /disabled button/i })
|
||||
expect(button).toBeDisabled()
|
||||
// It should have cursor-pointer but also disabled:pointer-events-none
|
||||
// which prevents the cursor from changing.
|
||||
// We can also add disabled:cursor-default for clarity.
|
||||
expect(button).toHaveClass("disabled:pointer-events-none")
|
||||
expect(button).toHaveClass("disabled:cursor-default")
|
||||
})
|
||||
})
|
||||
|
||||
@@ -2,7 +2,6 @@ import { render, screen } from "@testing-library/react"
|
||||
import { describe, expect, it } from "vitest"
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuTrigger,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSub,
|
||||
@@ -41,7 +40,7 @@ describe("DropdownMenu components", () => {
|
||||
expect(trigger).toHaveClass("cursor-pointer")
|
||||
})
|
||||
|
||||
it("DropdownMenuItem should not have cursor-pointer behavior when disabled", () => {
|
||||
it("DropdownMenuItem should show default cursor when disabled", () => {
|
||||
render(
|
||||
<DropdownMenu open={true}>
|
||||
<DropdownMenuContent>
|
||||
@@ -52,8 +51,24 @@ describe("DropdownMenu components", () => {
|
||||
const item = screen.getByText("Disabled Item")
|
||||
// Radix sets data-disabled attribute
|
||||
expect(item).toHaveAttribute("data-disabled")
|
||||
// If pointer-events-none is missing, we check for cursor class
|
||||
// We expect the final class to have disabled:cursor-default or similar,
|
||||
// or rely on pointer-events-none to block interactions.
|
||||
expect(item).toHaveClass("data-[disabled]:cursor-default")
|
||||
})
|
||||
|
||||
it("DropdownMenuSubTrigger should show default cursor when disabled", () => {
|
||||
render(
|
||||
<DropdownMenu open={true}>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuSub>
|
||||
<DropdownMenuSubTrigger disabled>Disabled Sub Trigger</DropdownMenuSubTrigger>
|
||||
<DropdownMenuPortal>
|
||||
<DropdownMenuSubContent />
|
||||
</DropdownMenuPortal>
|
||||
</DropdownMenuSub>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
)
|
||||
const trigger = screen.getByText("Disabled Sub Trigger")
|
||||
expect(trigger).toHaveAttribute("data-disabled")
|
||||
expect(trigger).toHaveClass("data-[disabled]:cursor-default")
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user