From a6ed8151a08f540a68fd5362884e4f9b888bca69 Mon Sep 17 00:00:00 2001
From: Adam Soltys <asoltys@gmail.com>
Date: Tue, 13 Oct 2026 05:31:05 +0000
Subject: Chat header: Add person is an icon. Adam's screenshot of the Bitcoin
 Community header: "Add person" wrapped onto two lines in a box twice the
 height of the bell and the door beside it. It is now a person with a plus,
 the same size and stroke as those (and lit while its panel is open), with
 "Add person" as its label and tooltip — in a community's header and a private
 group's. The form's own Add person button keeps its words. chat-layout-test
 finds the button by its label too; SHOT_PHONE=path saves the phone-width
 header.
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01KPw21NEpWeTGu6swVASmBt
---
 tools/chat-layout-test.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'tools')

diff --git a/tools/chat-layout-test.js b/tools/chat-layout-test.js
index a6f4162..7c79858 100644
--- a/tools/chat-layout-test.js
+++ b/tools/chat-layout-test.js
@@ -70,7 +70,7 @@ try {
     check('composer is on screen', r.found && r.fits, `bottom ${r.bottom} of ${r.vh}`);
 
     // the state from the report: the invite panel open above the log
-    await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent)); if (b) b.click(); });
+    await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent + ' ' + (e.getAttribute('aria-label') || ''))); if (b) b.click(); });
     await sleep(600);
     const panelOpen = await page.$('.chat-invite');
     r = await composerFits();
@@ -96,7 +96,7 @@ try {
     // put it back for the next viewport
     await page.evaluate(() => { const e = [...document.querySelectorAll('.chat-head .col')].find((n) => n.className.includes('clickable')); if (e) e.click(); });
     await sleep(300);
-    await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent)); if (b) b.click(); });
+    await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent + ' ' + (e.getAttribute('aria-label') || ''))); if (b) b.click(); });
     await sleep(300);
 
     const pinned = await page.evaluate(() => {
@@ -117,6 +117,7 @@ try {
     });
     check('a long message history scrolls with the name and composer pinned', pinned);
   }
+  if (process.env.SHOT_PHONE) await page.screenshot({ path: process.env.SHOT_PHONE }); // the phone-width header
   await page.setViewport({ width: 1280, height: 800 });
   await sleep(500);
   await page.screenshot({ path: shotPath });
@@ -131,7 +132,7 @@ try {
   check('and the composer says just "Message"', /^Message/.test(one.placeholder || '') && !/#/.test(one.placeholder || ''), one.placeholder);
 
   console.log('\n[adding a channel]');
-  await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent)); if (b) b.click(); });
+  await page.evaluate(() => { const b = [...document.querySelectorAll('.chat-head button')].find((e) => /add person/i.test(e.textContent + ' ' + (e.getAttribute('aria-label') || ''))); if (b) b.click(); });
   await sleep(600);
   const gated = await page.evaluate(() => ({
     field: !!document.querySelector('input[placeholder*="channel" i]'),
-- 
cgit v1.2.3