fix(glass-office): harden models catalog truth

Author: EmergentKnowledgeGroup

apps/mission-control/e2e/p5-models-slice.spec.ts

@@ -7,6 +7,13 @@ function activeTeamSection(page: import("./testHarness").Page) {
     .locator(".mc-page-section-tabs button.mc-page-section-btn-active");
 }
 
+async function dismissVisibleToasts(page: import("./testHarness").Page) {
+  const dismiss = page.locator(".mc-toast-dismiss");
+  while ((await dismiss.count()) > 0) {
+    await dismiss.first().click();
+  }
+}
+
 /**
  * P5 Basement · Models & Providers room slice: the Staff and Models rooms
  * share the team route but keep distinct stable identities — Staff lands on
@@ -140,10 +147,6 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
   await expect(page.locator(".mc-pin-to-office-note.is-error")).toHaveText(
     "Pinning this would exceed the six-column, four-row Office canvas.",
   );
-  await page.screenshot({
-    path: "../../runtime/qa/p5-models-slice/models-full-canvas-refusal.png",
-    fullPage: true,
-  });
   expect(
     await page.evaluate(() => localStorage.getItem("mc-glass-config-v1")),
   ).toBe(fullCanvasConfig);
@@ -157,6 +160,11 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
       );
     }),
   ).toBe(false);
+  await dismissVisibleToasts(page);
+  await page.screenshot({
+    path: "../../runtime/qa/p5-models-slice/models-full-canvas-refusal.png",
+    fullPage: true,
+  });
 
   // Free one medium default block. Pin now succeeds, and a repeat pin is
   // byte-identical config plus the honest already-pinned note.
@@ -187,6 +195,7 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
   expect(
     await page.evaluate(() => localStorage.getItem("mc-glass-config-v1")),
   ).toBe(pinnedConfig);
+  await dismissVisibleToasts(page);
   await page.screenshot({
     path: "../../runtime/qa/p5-models-slice/models-pinned-desktop.png",
     fullPage: true,
@@ -198,8 +207,10 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
   await expect(shortcut).toBeVisible();
   await expect(shortcut).toContainText("The Basement");
   await shortcut.scrollIntoViewIfNeeded();
-  await shortcut.screenshot({
+  await dismissVisibleToasts(page);
+  await page.screenshot({
     path: "../../runtime/qa/p5-models-slice/office-shortcut-block.png",
+    fullPage: true,
   });
 
   // The mounted Office consumes config events live; no route remount may be
@@ -284,6 +295,7 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
   await expect(
     page.getByTestId("office-block-models").getByRole("status"),
   ).toHaveText("Unavailable — turn on in Config");
+  await dismissVisibleToasts(page);
   await page.screenshot({
     path: "../../runtime/qa/p5-models-slice/models-disabled-door.png",
     fullPage: true,
@@ -308,6 +320,7 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
       .getByTestId("office-block-models")
       .getByRole("button", { name: "Open Models & Providers" }),
   ).toBeVisible();
+  await dismissVisibleToasts(page);
   await page.screenshot({
     path: "../../runtime/qa/p5-models-slice/models-restored-door.png",
     fullPage: true,
@@ -322,10 +335,14 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
     'button[title="BF · Models & Providers"]',
   );
   await expect(mobileModelsRoom).toHaveClass(/mc-nav-item-active/);
-  await expect(mobileModelsRoom.locator(".mc-nav-room-mark")).toHaveText("MP");
-  await expect(
-    page.locator('button[title="2F · Staff Directory"] .mc-nav-room-mark'),
-  ).toHaveText("SD");
+  const mobileModelsMark = mobileModelsRoom.locator(".mc-nav-room-mark");
+  const mobileStaffMark = page.locator(
+    'button[title="2F · Staff Directory"] .mc-nav-room-mark',
+  );
+  await expect(mobileModelsMark).toBeVisible();
+  await expect(mobileModelsMark).toHaveText("MP");
+  await expect(mobileStaffMark).toBeVisible();
+  await expect(mobileStaffMark).toHaveText("SD");
   const marksInViewport = await page.evaluate(() => {
     const titles = ["BF · Models & Providers", "2F · Staff Directory"];
     return titles.map((title) => {
@@ -334,7 +351,12 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
       );
       if (!mark) return false;
       const rect = mark.getBoundingClientRect();
+      const style = window.getComputedStyle(mark);
       return (
+        rect.width > 0 &&
+        rect.height > 0 &&
+        style.display !== "none" &&
+        style.visibility !== "hidden" &&
         rect.left >= 0 &&
         rect.right <= window.innerWidth &&
         rect.top >= 0 &&
@@ -343,15 +365,41 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
     });
   });
   expect(marksInViewport).toEqual([true, true]);
+  const mobileTabs = page
+    .getByTestId("team-page")
+    .locator(".mc-page-section-tabs button");
+  await expect(mobileTabs).toHaveCount(3);
+  await expect(mobileTabs).toHaveText([
+    "Agents",
+    "People & Routing",
+    "Models & Providers",
+  ]);
+  for (const tab of await mobileTabs.all()) {
+    await expect(tab).toBeVisible();
+  }
   const tabsContained = await page.evaluate(() => {
     const bar = document.querySelector(
       '[data-testid="team-page"] .mc-page-section-tabs',
     );
     if (!bar) return null;
     const barRect = bar.getBoundingClientRect();
+    const barStyle = window.getComputedStyle(bar);
+    if (
+      barRect.width <= 0 ||
+      barRect.height <= 0 ||
+      barStyle.display === "none" ||
+      barStyle.visibility === "hidden"
+    ) {
+      return null;
+    }
     return Array.from(bar.querySelectorAll("button")).map((button) => {
       const rect = button.getBoundingClientRect();
+      const style = window.getComputedStyle(button);
       return (
+        rect.width > 0 &&
+        rect.height > 0 &&
+        style.display !== "none" &&
+        style.visibility !== "hidden" &&
         rect.left >= barRect.left - 1 &&
         rect.right <= barRect.right + 1 &&
         rect.top >= barRect.top - 1 &&
@@ -368,10 +416,40 @@ test("@core @p5-models staff/models room identity, the models surface, pin-to-of
     () => document.documentElement.scrollWidth > window.innerWidth,
   );
   expect(overflows).toBe(false);
+  await dismissVisibleToasts(page);
   await page.screenshot({
     path: "../../runtime/qa/p5-models-slice/models-390.png",
     fullPage: true,
   });
 
+  // The provider grid must also shrink below its former 300px hard minimum
+  // when shell chrome leaves a narrower nested content area.
+  await page.setViewportSize({ width: 320, height: 844 });
+  const providerCardsContained = await page.evaluate(() => {
+    const grid = document.querySelector(".mc-models-provider-grid");
+    if (!grid) return null;
+    const gridRect = grid.getBoundingClientRect();
+    const cards = Array.from(
+      grid.querySelectorAll(".mc-models-provider-card"),
+    );
+    if (gridRect.width <= 0 || cards.length === 0) return null;
+    return cards.map((card) => {
+      const rect = card.getBoundingClientRect();
+      return (
+        rect.width > 0 &&
+        rect.height > 0 &&
+        rect.left >= gridRect.left - 1 &&
+        rect.right <= gridRect.right + 1
+      );
+    });
+  });
+  expect(providerCardsContained).not.toBeNull();
+  expect(providerCardsContained).not.toContain(false);
+  expect(
+    await page.evaluate(
+      () => document.documentElement.scrollWidth > window.innerWidth,
+    ),
+  ).toBe(false);
+
   expect(browserErrors).toEqual([]);
 });