import { expect, test } from './fixtures';

// The playable-slice smoke against the mock transport: guest login -> lobby shows the
// seeded active game -> open it -> the board renders committed tiles -> place a rack
// tile (tap) and see the score preview.
test('guest reaches a board and previews a placement', async ({ page }) => {
  await page.goto('/');

  await page.getByRole('button', { name: /guest/i }).click();

  await expect(page.getByText('Active games')).toBeVisible();
  const activeRow = page.getByRole('button', { name: /Ann/ });
  await expect(activeRow).toBeVisible();
  await activeRow.click();

  // Board renders, including a committed tile from the seeded HELLO play.
  await expect(page.locator('[data-cell]').first()).toBeVisible();
  await expect(page.locator('[data-cell] .letter', { hasText: 'H' }).first()).toBeVisible();

  // Tap a rack tile, then an empty board cell -> a pending tile + score preview.
  const rackTile = page.locator('.rack .tile').first();
  await rackTile.click();
  await page.locator('[data-cell]:not(.filled)').nth(30).click();
  await expect(page.locator('[data-cell].pending')).toHaveCount(1);
  // The score preview appears where the hints count used to be.
  await expect(page.locator('.scores')).toContainText(/\d/);

  // The contextual MakeMove control (✅) appears once a tile is pending.
  await expect(page.locator('.make')).toBeVisible();
});