Files
simple-react-app-kit/packages/lexical/src/actions-view.test.tsx
T
Maofeng 0d817537be feat(lexical): add declarative rich text editor
Introduce @workspace/lexical with composable actions, toolbars, embeds, rich-text nodes, media uploads, selection utilities, HTML serialization, and theme styling.\n\nLocalize built-in controls through MessageDescriptor catalogs for English and Simplified Chinese, while providing an English I18nProvider fallback for standalone editor use. Include focused unit coverage for actions, controls, serialization, plugins, public API, and catalogs.
2026-07-31 15:07:09 +08:00

73 lines
2.0 KiB
TypeScript

// @vitest-environment jsdom
import { cleanup, render, screen } from "@testing-library/react"
import { afterEach, describe, expect, it } from "vitest"
import {
ActionGroup,
Bold,
Date,
LexicalActions,
LexicalBubbleToolbar,
LexicalContent,
LexicalFixedToolbar,
LexicalFooter,
LexicalRoot,
} from "."
afterEach(cleanup)
describe("declarative Lexical actions", () => {
it("renders actions only in their declared regions", () => {
render(
<LexicalRoot value="" onChange={() => undefined}>
<LexicalActions>
<Bold in={["toolbar", "bubble"]} />
<Date in="footer" />
</LexicalActions>
<LexicalFixedToolbar aria-label="fixed" />
<LexicalBubbleToolbar />
<LexicalContent />
<LexicalFooter aria-label="footer" />
</LexicalRoot>
)
expect(screen.getByRole("toolbar", { name: "fixed" })).not.toBeNull()
expect(screen.getByLabelText("footer")).not.toBeNull()
expect(screen.getByRole("button", { name: "Bold" })).not.toBeNull()
expect(screen.getByRole("button", { name: "Date" })).not.toBeNull()
})
it("supports menu groups", () => {
render(
<LexicalRoot value="" onChange={() => undefined}>
<LexicalActions>
<ActionGroup type="menu" label="格式">
<Bold />
</ActionGroup>
</LexicalActions>
<LexicalFixedToolbar />
<LexicalContent />
</LexicalRoot>
)
expect(screen.getByRole("button", { name: "格式" })).not.toBeNull()
})
it("does not render optional regions without matching actions", () => {
render(
<LexicalRoot value="" onChange={() => undefined}>
<LexicalActions>
<Bold />
</LexicalActions>
<LexicalBubbleToolbar aria-label="bubble" />
<LexicalFooter aria-label="footer" />
<LexicalContent />
</LexicalRoot>
)
expect(screen.queryByLabelText("bubble")).toBeNull()
expect(screen.queryByLabelText("footer")).toBeNull()
})
})