A feed clip with timed reactions seeks on the moments bar alone: the player's own controls (its seek bar) stay off, the middle play/pause shows whenever it's paused (touch too), and the sound button stays to turn it down again

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01QjVvE4YAcK3AGwV7kZXeN4

1 files changed, 12 insertions, 0 deletions

diff --git a/tools/media-moments-feed-test.js b/tools/media-moments-feed-test.js
index a188c5d..7b429c9 100644
--- a/tools/media-moments-feed-test.js
+++ b/tools/media-moments-feed-test.js
@@ -175,6 +175,18 @@ try {
   check('...and shows over the pager\'s seek bar', await page.waitForFunction(() => !!document.querySelector('.media-pager .mp-cur .mp-seek .mp-mark'), { timeout: 3000 }).then(() => true, () => false));
   check('no timeline panel over the pager', await page.evaluate(() => !document.querySelector('.media-pager .media-timeline')));
   await page.screenshot({ path: '/tmp/media-timeline-pager.png' });
+  // back in the feed: the clip has a moment now, so the moments bar is its
+  // only seek bar (no player controls), with the middle button to play it
+  await page.keyboard.press('Escape'); await sleep(500);
+  await page.evaluate(() => { const v = document.querySelector('video.note-video'); v.pause(); v.dispatchEvent(new Event('timeupdate')); });
+  await sleep(200);
+  const one = await page.evaluate(() => { const v = document.querySelector('video.note-video'); const b = v.closest('.note-video-box'); const tl = b.querySelector('.media-timeline');
+    return { controls: v.controls, own: b.classList.contains('own-bar'), bar: !!tl && getComputedStyle(tl).display !== 'none', mark: !!b.querySelector('.media-mark'), pp: getComputedStyle(b.querySelector('.vid-pp')).display }; });
+  check('in the feed, a clip with a moment has one seek bar: the moments bar, no player controls', !one.controls && one.own && one.bar && one.mark, JSON.stringify(one));
+  check('...and the middle button plays it, on a touch screen too', one.pp === 'flex', JSON.stringify(one));
+  const vid2 = await page.evaluate(() => { const b = document.querySelector('.note-video-box .vid-pp').getBoundingClientRect(); return { x: b.x + b.width / 2, y: b.y + b.height / 2 }; });
+  await page.mouse.click(vid2.x, vid2.y); await sleep(600);
+  check('...which plays it in place', await page.evaluate(() => !document.querySelector('video.note-video').paused && !document.querySelector('.media-pager')));
   check('no browser exceptions', errs.length === 0, errs.join(' | '));
   await page.screenshot({ path: '/tmp/media-timeline-feed.png' });
 } finally { await browser.close(); server.stop(); }