wip

tests/unit/website/leagues/CreateLeaguePage.wizardStep.test.tsx

@@ -0,0 +1,124 @@
+import React from 'react';
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+
+// --- Mocks for Next.js navigation ---
+
+const useSearchParamsMock = vi.fn();
+const useRouterMock = vi.fn();
+
+const routerInstance = {
+  push: vi.fn(),
+  replace: vi.fn(),
+  prefetch: vi.fn(),
+};
+
+vi.mock('next/navigation', () => {
+  return {
+    useSearchParams: () => useSearchParamsMock(),
+    useRouter: () => {
+      return useRouterMock() ?? routerInstance;
+    },
+  };
+});
+
+// Minimal next/link mock to keep existing patterns consistent
+vi.mock('next/link', () => {
+  const ActualLink = ({ href, children, ...rest }: any) => (
+    <a href={href} {...rest}>
+      {children}
+    </a>
+  );
+  return { default: ActualLink };
+});
+
+import CreateLeaguePage from '../../../../apps/website/app/leagues/create/page';
+
+// Helper to build a searchParams-like object
+function createSearchParams(stepValue: string | null) {
+  return {
+    get: (key: string) => {
+      if (key === 'step') {
+        return stepValue;
+      }
+      return null;
+    },
+  } as any;
+}
+
+describe('CreateLeaguePage - URL-bound wizard steps', () => {
+  beforeEach(() => {
+    useSearchParamsMock.mockReset();
+    useRouterMock.mockReset();
+    routerInstance.push.mockReset();
+    routerInstance.replace.mockReset();
+  });
+
+  it('defaults to basics step when step param is missing', () => {
+    useSearchParamsMock.mockReturnValue(createSearchParams(null));
+
+    render(<CreateLeaguePage />);
+
+    // Basics step title from the wizard
+    expect(screen.getByText('Name your league')).toBeInTheDocument();
+  });
+
+  it('treats invalid step value as basics', () => {
+    useSearchParamsMock.mockReturnValue(createSearchParams('invalid-step'));
+
+    render(<CreateLeaguePage />);
+
+    expect(screen.getByText('Name your league')).toBeInTheDocument();
+  });
+
+  it('mounts directly on scoring step when step=scoring', () => {
+    useSearchParamsMock.mockReturnValue(createSearchParams('scoring'));
+
+    render(<CreateLeaguePage />);
+
+    // Step 4 title in the wizard
+    expect(screen.getByText('Scoring & championships')).toBeInTheDocument();
+  });
+
+  it('clicking Continue from basics navigates to step=structure via router', () => {
+    useSearchParamsMock.mockReturnValue(createSearchParams(null));
+    useRouterMock.mockReturnValue(routerInstance);
+
+    render(<CreateLeaguePage />);
+
+    const continueButton = screen.getByRole('button', { name: /continue/i });
+    fireEvent.click(continueButton);
+
+    expect(routerInstance.push).toHaveBeenCalledTimes(1);
+    const callArg = routerInstance.push.mock.calls[0][0] as string;
+    expect(callArg).toContain('/leagues/create');
+    expect(callArg).toContain('step=structure');
+  });
+
+  it('clicking Back from schedule navigates to step=structure via router', () => {
+    useSearchParamsMock.mockReturnValue(createSearchParams('schedule'));
+    useRouterMock.mockReturnValue(routerInstance);
+
+    render(<CreateLeaguePage />);
+
+    const backButton = screen.getByRole('button', { name: /back/i });
+    fireEvent.click(backButton);
+
+    expect(routerInstance.push).toHaveBeenCalledTimes(1);
+    const callArg = routerInstance.push.mock.calls[0][0] as string;
+    expect(callArg).toContain('/leagues/create');
+    expect(callArg).toContain('step=structure');
+  });
+
+  it('derives current step solely from URL so a "reload" keeps the same step', () => {
+    useSearchParamsMock.mockReturnValueOnce(createSearchParams('scoring'));
+    useSearchParamsMock.mockReturnValueOnce(createSearchParams('scoring'));
+
+    render(<CreateLeaguePage />);
+    expect(screen.getByText('Scoring & championships')).toBeInTheDocument();
+
+    // Simulate a logical reload by re-rendering with the same URL state
+    render(<CreateLeaguePage />);
+    expect(screen.getByText('Scoring & championships')).toBeInTheDocument();
+  });
+});