mirror of
https://github.com/nextui-org/nextui.git
synced 2025-12-08 19:26:11 +00:00
feat(dropdown): test cases (#2786)
* fix(popover): trigger disabled prop warning * chore(.changeset): fix typo * feat(dropdown): add @nextui-org/image * feat(dropdown): add more tests for custom trigger with isDisabled * feat(dropdown): make sure the menu can be open --------- Co-authored-by: Junior Garcia <jrgarciadev@gmail.com>
This commit is contained in:
parent
183a4a6cfd
commit
2bc1d1a58b
@ -4,4 +4,4 @@
|
||||
"@nextui-org/theme": patch
|
||||
---
|
||||
|
||||
Fix `isDisabled` prop warning on NextUI components that don't support this propterty, it is also fixed for non-NextUI components.
|
||||
Fix `isDisabled` prop warning on NextUI components that don't support this property, it is also fixed for non-NextUI components.
|
||||
|
||||
@ -3,6 +3,8 @@ import {act, render} from "@testing-library/react";
|
||||
import {Button} from "@nextui-org/button";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
import {User} from "@nextui-org/user";
|
||||
import {Image} from "@nextui-org/image";
|
||||
import {Avatar} from "@nextui-org/avatar";
|
||||
|
||||
import {Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, DropdownSection} from "../src";
|
||||
|
||||
@ -146,6 +148,10 @@ describe("Dropdown", () => {
|
||||
});
|
||||
|
||||
expect(spy).toBeCalledTimes(0);
|
||||
|
||||
let menu = wrapper.queryByRole("menu");
|
||||
|
||||
expect(menu).toBeTruthy();
|
||||
});
|
||||
|
||||
it("should work with single selection (controlled)", async () => {
|
||||
@ -455,14 +461,11 @@ describe("Dropdown", () => {
|
||||
expect(onSelectionChange).toBeCalledTimes(0);
|
||||
});
|
||||
|
||||
it("should render without error (custom trigger + isDisabled)", async () => {
|
||||
it("should render without error (custom trigger with isDisabled)", async () => {
|
||||
const spy = jest.spyOn(console, "error").mockImplementation(() => {});
|
||||
|
||||
render(
|
||||
<Dropdown isDisabled>
|
||||
<DropdownTrigger>
|
||||
<div>Trigger</div>
|
||||
</DropdownTrigger>
|
||||
const renderDropdownMenu = () => {
|
||||
return (
|
||||
<DropdownMenu aria-label="Actions" onAction={alert}>
|
||||
<DropdownItem key="new">New file</DropdownItem>
|
||||
<DropdownItem key="copy">Copy link</DropdownItem>
|
||||
@ -471,6 +474,16 @@ describe("Dropdown", () => {
|
||||
Delete file
|
||||
</DropdownItem>
|
||||
</DropdownMenu>
|
||||
);
|
||||
};
|
||||
|
||||
// Non Next UI Element in DropdownTrigger
|
||||
render(
|
||||
<Dropdown isDisabled>
|
||||
<DropdownTrigger>
|
||||
<div>Trigger</div>
|
||||
</DropdownTrigger>
|
||||
{renderDropdownMenu()}
|
||||
</Dropdown>,
|
||||
);
|
||||
|
||||
@ -478,19 +491,45 @@ describe("Dropdown", () => {
|
||||
|
||||
spy.mockRestore();
|
||||
|
||||
// Next UI Element in DropdownTrigger
|
||||
render(
|
||||
<Dropdown isDisabled>
|
||||
<DropdownTrigger>
|
||||
<User as="button" description="@tonyreichert" name="Tony Reichert" />
|
||||
</DropdownTrigger>
|
||||
<DropdownMenu aria-label="Actions" onAction={alert}>
|
||||
<DropdownItem key="new">New file</DropdownItem>
|
||||
<DropdownItem key="copy">Copy link</DropdownItem>
|
||||
<DropdownItem key="edit">Edit file</DropdownItem>
|
||||
<DropdownItem key="delete" color="danger">
|
||||
Delete file
|
||||
</DropdownItem>
|
||||
</DropdownMenu>
|
||||
{renderDropdownMenu()}
|
||||
</Dropdown>,
|
||||
);
|
||||
|
||||
expect(spy).toBeCalledTimes(0);
|
||||
|
||||
spy.mockRestore();
|
||||
|
||||
// NextUI Element that supports isDisabled prop in DropdownTrigger
|
||||
render(
|
||||
<Dropdown isDisabled>
|
||||
<DropdownTrigger>
|
||||
<Avatar isDisabled name="Marcus" />
|
||||
</DropdownTrigger>
|
||||
{renderDropdownMenu()}
|
||||
</Dropdown>,
|
||||
);
|
||||
|
||||
expect(spy).toBeCalledTimes(0);
|
||||
|
||||
spy.mockRestore();
|
||||
|
||||
// NextUI Element that doesn't support isDisabled prop in DropdownTrigger
|
||||
render(
|
||||
<Dropdown isDisabled>
|
||||
<DropdownTrigger>
|
||||
<Image
|
||||
alt="NextUI hero Image"
|
||||
src="https://nextui-docs-v2.vercel.app/images/hero-card-complete.jpeg"
|
||||
width={300}
|
||||
/>
|
||||
</DropdownTrigger>
|
||||
{renderDropdownMenu()}
|
||||
</Dropdown>,
|
||||
);
|
||||
|
||||
|
||||
@ -57,6 +57,7 @@
|
||||
"@nextui-org/button": "workspace:*",
|
||||
"@nextui-org/avatar": "workspace:*",
|
||||
"@nextui-org/user": "workspace:*",
|
||||
"@nextui-org/image": "workspace:*",
|
||||
"@nextui-org/shared-icons": "workspace:*",
|
||||
"framer-motion": "^11.0.22",
|
||||
"clean-package": "2.2.0",
|
||||
|
||||
26
pnpm-lock.yaml
generated
26
pnpm-lock.yaml
generated
@ -146,7 +146,7 @@ importers:
|
||||
version: 4.0.2(eslint@7.32.0)(webpack@5.91.0)
|
||||
eslint-plugin-import:
|
||||
specifier: ^2.26.0
|
||||
version: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
version: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
eslint-plugin-jest:
|
||||
specifier: ^24.3.6
|
||||
version: 24.7.0(@typescript-eslint/eslint-plugin@5.62.0)(eslint@7.32.0)(typescript@4.9.5)
|
||||
@ -1456,6 +1456,9 @@ importers:
|
||||
'@nextui-org/button':
|
||||
specifier: workspace:*
|
||||
version: link:../button
|
||||
'@nextui-org/image':
|
||||
specifier: workspace:*
|
||||
version: link:../image
|
||||
'@nextui-org/shared-icons':
|
||||
specifier: workspace:*
|
||||
version: link:../../utilities/shared-icons
|
||||
@ -5934,10 +5937,6 @@ packages:
|
||||
peerDependencies:
|
||||
'@effect-ts/otel-node': '*'
|
||||
peerDependenciesMeta:
|
||||
'@effect-ts/core':
|
||||
optional: true
|
||||
'@effect-ts/otel':
|
||||
optional: true
|
||||
'@effect-ts/otel-node':
|
||||
optional: true
|
||||
dependencies:
|
||||
@ -16011,7 +16010,7 @@ packages:
|
||||
dependencies:
|
||||
confusing-browser-globals: 1.0.11
|
||||
eslint: 7.32.0
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
object.assign: 4.1.5
|
||||
object.entries: 1.1.8
|
||||
dev: true
|
||||
@ -16044,7 +16043,7 @@ packages:
|
||||
dependencies:
|
||||
eslint: 7.32.0
|
||||
eslint-config-airbnb-base: 14.2.1(eslint-plugin-import@2.29.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
eslint-plugin-jsx-a11y: 6.8.0(eslint@7.32.0)
|
||||
eslint-plugin-react: 7.34.1(eslint@7.32.0)
|
||||
eslint-plugin-react-hooks: 4.6.0(eslint@7.32.0)
|
||||
@ -16067,7 +16066,7 @@ packages:
|
||||
eslint: 7.32.0
|
||||
eslint-import-resolver-node: 0.3.9
|
||||
eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
eslint-plugin-jsx-a11y: 6.8.0(eslint@7.32.0)
|
||||
eslint-plugin-react: 7.34.1(eslint@7.32.0)
|
||||
eslint-plugin-react-hooks: 4.6.0(eslint@7.32.0)
|
||||
@ -16116,7 +16115,7 @@ packages:
|
||||
confusing-browser-globals: 1.0.11
|
||||
eslint: 7.32.0
|
||||
eslint-plugin-flowtype: 5.10.0(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
eslint-plugin-jest: 24.7.0(@typescript-eslint/eslint-plugin@5.62.0)(eslint@7.32.0)(typescript@4.9.5)
|
||||
eslint-plugin-jsx-a11y: 6.8.0(eslint@7.32.0)
|
||||
eslint-plugin-react: 7.34.1(eslint@7.32.0)
|
||||
@ -16157,7 +16156,7 @@ packages:
|
||||
dependencies:
|
||||
debug: 4.3.4
|
||||
eslint: 7.32.0
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
glob: 7.2.3
|
||||
is-glob: 4.0.3
|
||||
resolve: 1.22.8
|
||||
@ -16177,7 +16176,7 @@ packages:
|
||||
enhanced-resolve: 5.16.0
|
||||
eslint: 7.32.0
|
||||
eslint-module-utils: 2.8.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0)
|
||||
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0)
|
||||
fast-glob: 3.3.2
|
||||
get-tsconfig: 4.7.3
|
||||
is-core-module: 2.13.1
|
||||
@ -16288,7 +16287,7 @@ packages:
|
||||
string-natural-compare: 3.0.1
|
||||
dev: true
|
||||
|
||||
/eslint-plugin-import@2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@3.6.1)(eslint@7.32.0):
|
||||
/eslint-plugin-import@2.29.1(@typescript-eslint/parser@5.62.0)(eslint-import-resolver-typescript@2.7.1)(eslint@7.32.0):
|
||||
resolution: {integrity: sha512-BbPC0cuExzhiMo4Ff1BTVwHpjjv28C5R+btTOGaCRC7UEz801up0JadwkeSk5Ued6TG34uaczuVuH6qyy5YUxw==}
|
||||
engines: {node: '>=4'}
|
||||
peerDependencies:
|
||||
@ -22431,9 +22430,6 @@ packages:
|
||||
resolution: {integrity: sha512-W+gxAq7aQ9dJIg/XLKGcRT0cvnStFAQHPaI0pvD0U2l6IVLueUAm3nwN7lkY62zZNmlvNx6jNtE4wlbS+CyqSg==}
|
||||
engines: {node: '>= 12.0.0'}
|
||||
hasBin: true
|
||||
peerDependenciesMeta:
|
||||
'@parcel/core':
|
||||
optional: true
|
||||
dependencies:
|
||||
'@parcel/config-default': 2.12.0(@parcel/core@2.12.0)(typescript@4.9.5)
|
||||
'@parcel/core': 2.12.0
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user