/**
 * UX polish — PIN inputs auto-submit on the 4th digit. Both the inline
 * recovery on /join (name-taken state) and the standalone /recover route
 * share the same auto-submit pattern: a $effect watching `pin.length === 4`.
 *
 * Coverage:
 *   - Inline recovery on /join: typing 4 digits navigates to /feed without
 *     a tap on Anmelden.
 *   - Standalone /recover: typing 4 digits navigates to /feed.
 */
import { test, expect } from '../../fixtures/test';
import { JoinPage, RecoverPage } from '../../page-objects';
import { clearAllStorage } from '../../helpers/storage-helpers';

test.describe('Auth — PIN auto-submit', () => {
  test('inline recovery: 4th digit auto-submits and navigates to /feed', async ({ page, guest }) => {
    const original = await guest('AutoInline');
    await clearAllStorage(page);

    const join = new JoinPage(page);
    await join.goto();
    await join.fillName('AutoInline');
    await join.submit();

    // Name-taken state: type the PIN one digit at a time, do NOT click submit.
    await expect(join.recoveryPinInput).toBeVisible();
    await join.recoveryPinInput.pressSequentially(original.pin, { delay: 30 });

    // Auto-submit must fire on the 4th digit.
    await page.waitForURL('**/feed', { timeout: 5_000 });
  });

  test('/recover: 4th digit auto-submits when the name is already filled in', async ({ page, guest }) => {
    const original = await guest('AutoRecover');
    await clearAllStorage(page);

    const recover = new RecoverPage(page);
    await recover.goto();
    await recover.nameInput.fill('AutoRecover');
    await recover.pinInput.pressSequentially(original.pin, { delay: 30 });

    await page.waitForURL('**/feed', { timeout: 5_000 });
  });
});