mirror of
https://github.com/bytedance/deer-flow.git
synced 2026-11-15 15:50:35 +00:00
ba4e60dec4
The ConversationScrollButton component existed but was never mounted, so a conversation scrolled up had no way back to the latest messages. Mount it inside the Conversation container with an accessible name from the new common.scrollToBottom locale key, and lift it above the subagent card wrapper's relative z-1 so a card scrolled under the control cannot intercept its clicks. Cover the stacking behavior with a Playwright test that wheels the list up, asserts a card box paints across the button's center point, and clicks through; the existing message-list DOM tests that mock the conversation module stub the new import. Co-authored-by: Nan Gao <thunderggnn@gmail.com>
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { afterEach, describe, expect, it, rs } from "@rstest/core";
|
|
import { cleanup, fireEvent, render, screen } from "@testing-library/react";
|
|
|
|
import { ConversationScrollButton } from "@/components/ai-elements/conversation";
|
|
|
|
const stickToBottomContext = {
|
|
isAtBottom: true,
|
|
scrollToBottom: rs.fn(),
|
|
};
|
|
|
|
rs.mock("use-stick-to-bottom", () => ({
|
|
useStickToBottomContext: () => stickToBottomContext,
|
|
}));
|
|
|
|
describe("ConversationScrollButton", () => {
|
|
afterEach(() => {
|
|
cleanup();
|
|
stickToBottomContext.isAtBottom = true;
|
|
stickToBottomContext.scrollToBottom = rs.fn();
|
|
});
|
|
|
|
it("does not render when the conversation is at the bottom", () => {
|
|
render(<ConversationScrollButton />);
|
|
expect(screen.queryByRole("button")).toBeNull();
|
|
});
|
|
|
|
it("renders and scrolls to the bottom when the conversation is scrolled up", () => {
|
|
stickToBottomContext.isAtBottom = false;
|
|
render(<ConversationScrollButton />);
|
|
const button = screen.getByRole("button");
|
|
fireEvent.click(button);
|
|
expect(stickToBottomContext.scrollToBottom).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
it("passes an accessible name through to the button", () => {
|
|
stickToBottomContext.isAtBottom = false;
|
|
render(<ConversationScrollButton aria-label="Scroll to bottom" />);
|
|
expect(
|
|
screen.getByRole("button", { name: "Scroll to bottom" }),
|
|
).toBeDefined();
|
|
});
|
|
});
|