// @vitest-environment jsdom
//
// The stamp `rememberNavPosition` leaves in history.state survives a reload, but module state does not:
// the listener that reads it was installed by the first push, so after F5 the first Back onto a
// stamped entry restored nothing. Its own file, because the point is a
// module that has made NO push yet — any other test in history.navPosition would have made one.
import { useRef } from "react";
import { afterEach, expect, it } from "vitest";
import { act, cleanup, render, waitFor } from "@testing-library/react";
import "./history";
import { navItemAttrs, useListNav } from "./listNav";

function List({ id, count }: { id: string; count: number }) {
  const ref = useRef<HTMLDivElement>(null);
  useListNav(ref, { enabled: true });
  return (
    <div ref={ref}>
      {Array.from({ length: count }, (_, i) => (
        <div key={i} data-testid={`${id}${i}`} {...navItemAttrs(i)}>
          {id}
          {i}
        </div>
      ))}
    </div>
  );
}

afterEach(() => {
  cleanup();
  window.history.replaceState(null, "");
});

it("restores on a landing before this load has pushed anything", async () => {
  // An entry stamped before the reload: list 1 of 2, item 1.
  const state = { sfPage: "home", sfNav: { list: 1, lists: 2, index: 1 } };
  window.history.replaceState(state, "");
  render(
    <>
      <List id="a" count={2} />
      <List id="b" count={3} />
    </>,
  );
  act(() => {
    window.dispatchEvent(new PopStateEvent("popstate", { state }));
  });
  await waitFor(() =>
    expect((document.activeElement as HTMLElement | null)?.dataset.testid).toBe("b1"),
  );
  expect(window.history.state.sfNav).toBeUndefined();
});