import { test, expect } from '@playwright/test';
import { SPEAKER_NOTE, resumeButton, seedStudy } from './helpers.js';

test('presenting on two screens: the audience window never shows the speaker notes', async ({ page, context }) => {
  const { title } = await seedStudy(page, { withOutline: true });
  await resumeButton(page, title).click();
  await page.getByRole('navigation', { name: 'Study stages' }).getByRole('button', { name: 'Outline' }).click();
  await page.getByRole('button', { name: 'Present' }).click();
  const presenter = page.getByRole('dialog', { name: /presenting/i });

  // one screen: notes stay hidden until turned on
  await expect(presenter.getByRole('heading', { name: /God so loved/ })).toBeVisible();
  await expect(presenter.getByText(SPEAKER_NOTE)).toHaveCount(0);

  // a second window (the projector) connects and follows along
  const audience = await context.newPage();
  await audience.goto('/?audience=1');
  await expect(audience.getByRole('heading', { name: /God so loved/ })).toBeVisible();
  await expect(presenter.getByText('Only you see this')).toBeVisible();
  await expect(presenter.getByText(SPEAKER_NOTE)).toBeVisible(); // on the presenter's screen only
  await expect(audience.getByText(SPEAKER_NOTE)).toHaveCount(0);
  expect(await audience.locator('body').innerText()).not.toMatch(/PRIVATE|On pace|Start/);

  await page.keyboard.press('ArrowRight');
  await expect(audience.getByRole('heading', { name: /Light and darkness/ })).toBeVisible();

  // B blacks the audience screen out, and again brings it back
  await page.keyboard.press('b');
  await expect(audience.getByRole('heading', { name: /Light and darkness/ })).toHaveCount(0);
  await page.keyboard.press('b');
  await expect(audience.getByRole('heading', { name: /Light and darkness/ })).toBeVisible();

  // closing the presentation tells the audience window
  await presenter.getByRole('button', { name: 'Close' }).click();
  await expect(audience.getByText(/presentation has ended/i)).toBeVisible();
});