fix(teleprompter): keep the transport row fixed and label every control

The follow control was rendered only while the follow could be re-engaged,
so it appeared and vanished mid show and moved every control after it. An
operator reaching for pause would press whatever had slid under their
finger. It is now always present and goes disabled when there is nothing to
re-engage, which is how the rest of the row already behaved.

The controls also could not explain themselves: the follow target in
particular is not a guessable icon. Each one now carries a tooltip naming
the action and its key, using the shared Tooltip the editor uses.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Cb8RVPNQ2ETPJxdy4b8CHf
This commit is contained in:
Claude
2026-08-18 18:24:05 +00:00
parent 6ef04d9a92
commit bb8f147575
3 changed files with 105 additions and 41 deletions
@@ -116,6 +116,27 @@ test.describe('teleprompter', () => {
expect(slower).toBe(before);
});
test('keeps every transport control in place', async ({ page }) => {
// a control which appears mid show moves the ones after it, and the operator
// reaches for pause and presses whatever slid under their finger instead
await page.goto(teleprompterUrl);
await expect(scroller(page)).toBeVisible();
const controls = page.locator('.teleprompter__controls button');
const follow = page.getByTestId('teleprompter-follow');
await expect(controls).toHaveCount(6);
await expect(follow).toBeVisible();
await expect(follow).toBeDisabled();
// taking over by hand offers the follow back, without restacking the row
await page.mouse.move(640, 300);
await page.mouse.wheel(0, 200);
await expect(controls).toHaveCount(6);
await expect(follow).toBeVisible();
});
test('f mirrors the view for a beam splitter rig', async ({ page }) => {
await page.goto(teleprompterUrl);
await expect(scroller(page)).toBeVisible();