7e5d908efa
Keep the task Activity view selector visible without blanking the mobile tab strip. - Portal the Activity view menu to the document body and clamp its fixed position to the visual viewport. - Close and refocus the menu safely across task changes, scrolling, resizing, keyboard selection, and outside clicks. - Add regression coverage for mobile clipping, tab-strip preservation, and the changeset release note. Files changed: .changeset/fn-7375-activity-dropdown-overlay.md | 7 + .../dashboard/app/components/TaskDetailModal.css | 15 +- .../dashboard/app/components/TaskDetailModal.tsx | 186 ++++++++++++++++++--- .../__tests__/TaskDetailModal.css.test.ts | 7 +- ...etailModal.responsive-and-dependencies.test.tsx | 12 +- .../TaskDetailModal.task-activity-chat.test.tsx | 61 +++++++ 6 files changed, 254 insertions(+), 34 deletions(-) Fusion-Task-Id: FN-7375 Fusion-Task-Lineage: 5999507a-edd3-4485-935a-885f7c143ed4 Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
35 lines
1.8 KiB
TypeScript
35 lines
1.8 KiB
TypeScript
import { describe, expect, it } from "vitest";
|
|
import { loadAllAppCssBaseOnly } from "../../test/cssFixture";
|
|
|
|
describe("TaskDetailModal CSS contract", () => {
|
|
it("FN-4183 keeps detail source headers top-aligned so the disclosure toggle stays on the first row", async () => {
|
|
const css = await loadAllAppCssBaseOnly();
|
|
|
|
expect(css).toMatch(/\.detail-source-header\s*\{[^}]*align-items\s*:\s*flex-start\s*;/);
|
|
});
|
|
|
|
it("FN-5879/FN-6864 keeps the base detail tab strip horizontally scrollable and touch-pannable without shrinking tabs", async () => {
|
|
const css = await loadAllAppCssBaseOnly();
|
|
|
|
expect(css).toMatch(/\.detail-tabs\s*\{[^}]*overflow-x\s*:\s*auto\s*;/);
|
|
expect(css).toMatch(/\.detail-tabs\s*\{[^}]*touch-action\s*:\s*pan-x\s+pan-y\s*;/);
|
|
expect(css).toMatch(/\.detail-tab\s*\{[^}]*flex-shrink\s*:\s*0\s*;/);
|
|
});
|
|
|
|
it("FN-7351/FN-7375 keeps the Activity tab dropdown portal-safe on narrow task-detail surfaces", async () => {
|
|
const css = await loadAllAppCssBaseOnly();
|
|
|
|
expect(css).toMatch(/\.detail-tab-dropdown\s*\{[^}]*flex-shrink\s*:\s*0\s*;/);
|
|
expect(css).toMatch(/\.detail-tab--activity\s*\{[^}]*display\s*:\s*inline-flex\s*;/);
|
|
expect(css).toMatch(/\.activity-view-menu\s*\{[^}]*position\s*:\s*fixed\s*;/);
|
|
expect(css).toMatch(/\.activity-view-menu\s*\{[^}]*overflow-y\s*:\s*auto\s*;/);
|
|
expect(css).not.toMatch(/\.activity-view-menu\s*\{[^}]*position\s*:\s*absolute\s*;/);
|
|
expect(css).not.toMatch(/\.activity-view-menu\s*\{[^}]*min-inline-size\s*:\s*100%\s*;/);
|
|
expect(css).not.toContain(".activity-view-select");
|
|
expect(css).not.toContain(".activity-segmented-control");
|
|
expect(css).not.toContain(".activity-segment");
|
|
expect(css).not.toContain(".log-subview-toggle");
|
|
expect(css).not.toContain(".log-subview-btn");
|
|
});
|
|
});
|