fix(chat): adjust bottom inset values and fallback delay for keyboard avoidance

This commit is contained in:
2026-07-16 16:48:28 +08:00
parent 514297f469
commit d84899fc82
4 changed files with 13 additions and 13 deletions
@@ -46,7 +46,7 @@ describe("resolveChatKeyboardInset", () => {
), ),
).toEqual({ ).toEqual({
keyboardVisible: true, keyboardVisible: true,
bottomInset: 308, bottomInset: 316,
source: "visual-viewport", source: "visual-viewport",
}); });
}); });
@@ -62,7 +62,7 @@ describe("resolveChatKeyboardInset", () => {
), ),
).toEqual({ ).toEqual({
keyboardVisible: true, keyboardVisible: true,
bottomInset: 328, bottomInset: 336,
source: "virtual-keyboard", source: "virtual-keyboard",
}); });
}); });
@@ -83,8 +83,8 @@ describe("resolveChatKeyboardInset", () => {
describe("resolveChatKeyboardFallbackInset", () => { describe("resolveChatKeyboardFallbackInset", () => {
it("scales with viewport height and remains bounded", () => { it("scales with viewport height and remains bounded", () => {
expect(resolveChatKeyboardFallbackInset(500)).toBe(268); expect(resolveChatKeyboardFallbackInset(500)).toBe(276);
expect(resolveChatKeyboardFallbackInset(800)).toBe(344); expect(resolveChatKeyboardFallbackInset(800)).toBe(352);
expect(resolveChatKeyboardFallbackInset(1_200)).toBe(388); expect(resolveChatKeyboardFallbackInset(1_200)).toBe(396);
}); });
}); });
@@ -98,7 +98,7 @@ describe("useChatKeyboardAvoidance", () => {
expect(getBottomInset(container)).toBe(""); expect(getBottomInset(container)).toBe("");
act(() => vi.advanceTimersByTime(1)); act(() => vi.advanceTimersByTime(1));
expect(getBottomInset(container)).toBe("344px"); expect(getBottomInset(container)).toBe("352px");
expect(intervalSpy).not.toHaveBeenCalled(); expect(intervalSpy).not.toHaveBeenCalled();
}); });
@@ -141,7 +141,7 @@ describe("useChatKeyboardAvoidance", () => {
visualViewport.dispatchEvent(new Event("resize")); visualViewport.dispatchEvent(new Event("resize"));
vi.advanceTimersByTime(0); vi.advanceTimersByTime(0);
}); });
expect(getBottomInset(container)).toBe("308px"); expect(getBottomInset(container)).toBe("316px");
visualViewport.height = 760; visualViewport.height = 760;
act(() => { act(() => {
@@ -161,7 +161,7 @@ describe("useChatKeyboardAvoidance", () => {
vi.advanceTimersByTime(0); vi.advanceTimersByTime(0);
}); });
expect(getBottomInset(container)).toBe("328px"); expect(getBottomInset(container)).toBe("336px");
}); });
it("does not add fallback when the layout viewport resized", () => { it("does not add fallback when the layout viewport resized", () => {
@@ -182,7 +182,7 @@ describe("useChatKeyboardAvoidance", () => {
renderHarness(root, false); renderHarness(root, false);
renderHarness(root, true); renderHarness(root, true);
act(() => vi.advanceTimersByTime(250)); act(() => vi.advanceTimersByTime(250));
expect(getBottomInset(container)).toBe("344px"); expect(getBottomInset(container)).toBe("352px");
visualViewport.height = 460; visualViewport.height = 460;
act(() => { act(() => {
@@ -190,14 +190,14 @@ describe("useChatKeyboardAvoidance", () => {
vi.advanceTimersByTime(0); vi.advanceTimersByTime(0);
}); });
expect(getBottomInset(container)).toBe("308px"); expect(getBottomInset(container)).toBe("316px");
}); });
it("removes the local inset when focus leaves", () => { it("removes the local inset when focus leaves", () => {
renderHarness(root, false); renderHarness(root, false);
renderHarness(root, true); renderHarness(root, true);
act(() => vi.advanceTimersByTime(250)); act(() => vi.advanceTimersByTime(250));
expect(getBottomInset(container)).toBe("344px"); expect(getBottomInset(container)).toBe("352px");
renderHarness(root, false); renderHarness(root, false);
+1 -1
View File
@@ -1,6 +1,6 @@
export const CHAT_KEYBOARD_VISIBLE_THRESHOLD_PX = 80; export const CHAT_KEYBOARD_VISIBLE_THRESHOLD_PX = 80;
export const CHAT_KEYBOARD_ZOOM_THRESHOLD = 1.05; export const CHAT_KEYBOARD_ZOOM_THRESHOLD = 1.05;
export const CHAT_KEYBOARD_TARGET_GAP_PX = 8; export const CHAT_KEYBOARD_TARGET_GAP_PX = 20;
export const CHAT_KEYBOARD_FALLBACK_RATIO = 0.42; export const CHAT_KEYBOARD_FALLBACK_RATIO = 0.42;
export const CHAT_KEYBOARD_FALLBACK_MIN_PX = 260; export const CHAT_KEYBOARD_FALLBACK_MIN_PX = 260;
export const CHAT_KEYBOARD_FALLBACK_MAX_PX = 380; export const CHAT_KEYBOARD_FALLBACK_MAX_PX = 380;
@@ -15,7 +15,7 @@ import {
} from "./chat-keyboard-geometry"; } from "./chat-keyboard-geometry";
const CHAT_KEYBOARD_BOTTOM_INSET_VAR = "--chat-keyboard-bottom-inset"; const CHAT_KEYBOARD_BOTTOM_INSET_VAR = "--chat-keyboard-bottom-inset";
const CHAT_KEYBOARD_FALLBACK_DELAY_MS = 250; const CHAT_KEYBOARD_FALLBACK_DELAY_MS = 150;
const log = new Logger("UseChatKeyboardAvoidance"); const log = new Logger("UseChatKeyboardAvoidance");