import { expect } from "@playwright/test";
import { test } from "../fixtures";
import { registerAndLogin, createList, addItem } from "../helpers";

test("a list updates live for another user via websocket", async ({ page, browser, server }) => {
  // User A registers and creates a list.
  await registerAndLogin(page, "alice@example.com");
  await createList(page, "Weekly shop");
  const listUrl = page.url();

  // User B registers in a separate context (separate session).
  const contextB = await browser.newContext({ baseURL: server.baseURL });
  const pageB = await contextB.newPage();
  await registerAndLogin(pageB, "bob@example.com");

  // Both users open the same list.
  await page.goto(listUrl);
  await pageB.goto(listUrl);

  // Give the websocket connections a moment to establish.
  await page.waitForTimeout(500);

  // User A adds an item.
  await addItem(page, "Apple", "2");

  // It should appear on User B's page without any reload.
  await expect(pageB.locator(".item-row").filter({ hasText: "Apple" })).toBeVisible();
  await expect(pageB.locator(".item-row").filter({ hasText: "Apple" }).locator(".item-qty")).toHaveText("(2)");

  await contextB.close();
});