diff --git a/src/board-item/__tests__/board-item.test.tsx b/src/board-item/__tests__/board-item.test.tsx index e543808c..4e617155 100644 --- a/src/board-item/__tests__/board-item.test.tsx +++ b/src/board-item/__tests__/board-item.test.tsx @@ -1,11 +1,16 @@ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved. // SPDX-License-Identifier: Apache-2.0 + import { ReactElement } from "react"; import { cleanup, render as libRender } from "@testing-library/react"; import { afterEach, describe, expect, test } from "vitest"; +import Button from "@cloudscape-design/components/button"; import Container from "@cloudscape-design/components/container"; +import ExpandableSection from "@cloudscape-design/components/expandable-section"; +import Header from "@cloudscape-design/components/header"; +import "@cloudscape-design/components/test-utils/dom"; import BoardItem from "../../../lib/components/board-item"; import createWrapper from "../../../lib/components/test-utils/dom"; import { ItemContextWrapper } from "./board-item-wrapper"; @@ -32,16 +37,22 @@ describe("WidgetContainer", () => { Container content - - Content + Header} + footer={Footer expandable content} + settings={ , ); + const itemWrapper = createWrapper().findBoardItem()!; - expect(itemWrapper.findHeader()!.getElement().textContent).toBe("Header"); - expect(itemWrapper.findContent().getElement().textContent).toBe("Content"); - expect(itemWrapper.findFooter()!.getElement().textContent).toBe("Footer"); - expect(itemWrapper.findSettings()!.getElement().textContent).toBe("Settings"); + expect(itemWrapper.findHeader()!.findHeader()!.getElement()).toHaveTextContent("Header"); + expect(itemWrapper.findContent()!.findButton()!.getElement()).toHaveTextContent("Action"); + expect(itemWrapper.findFooter()!.findExpandableSection()!.findHeader()!.getElement()).toHaveTextContent("Footer"); + expect(itemWrapper.findSettings()!.findButton()!.getElement()).toHaveAccessibleName("Settings"); }); test("renders handle aria labels", () => { diff --git a/src/test-utils/dom/board-item/index.ts b/src/test-utils/dom/board-item/index.ts index c691366a..9b2d1995 100644 --- a/src/test-utils/dom/board-item/index.ts +++ b/src/test-utils/dom/board-item/index.ts @@ -1,7 +1,8 @@ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved. // SPDX-License-Identifier: Apache-2.0 + import componentsWrapper from "@cloudscape-design/components/test-utils/dom"; -import { ComponentWrapper } from "@cloudscape-design/test-utils-core/dom"; +import { ComponentWrapper, ElementWrapper } from "@cloudscape-design/test-utils-core/dom"; import itemStyles from "../../../board-item/styles.selectors.js"; import dragHandleStyles from "../../../internal/drag-handle/styles.selectors.js"; @@ -18,21 +19,21 @@ export default class BoardItemWrapper extends ComponentWrapper { return this.findByClassName(resizeHandleStyles.handle)!; } - findSettings(): null | ComponentWrapper { + findSettings(): null | ElementWrapper { return this.findByClassName(itemStyles.settings); } // @cloudscape-design/components/container methods - findHeader(): null | ComponentWrapper { + findHeader(): null | ElementWrapper { return this.findByClassName(itemStyles["header-content"]); } - findContent(): ComponentWrapper { + findContent(): ElementWrapper { return componentsWrapper(this.getElement()).findContainer()!.findContent(); } - findFooter(): null | ComponentWrapper { + findFooter(): null | ElementWrapper { return componentsWrapper(this.getElement()).findContainer()!.findFooter(); } }