1import { useEffect, useState } from "octane";
2
3// A plain string constant so the marker survives compilation/minification
4// verbatim inside the client bundle — the live test fetches the built
5// `/assets/*.js` module and asserts the marker is present (the content
6// that hydrates in the browser; it never appears in the HTML shell).
7const PAGE_MARKER = "OCTANE_SPA_PAGE_MARKER";
8
9export function App() {
10 const [count, setCount] = useState(0);
11 const [hydrated, setHydrated] = useState(false);
12 useEffect(() => {
13 setHydrated(true);
14 }, []);
15 return (
16 <main>
17 <h1 data-testid="page-marker">{PAGE_MARKER}</h1>
18 <button
19 id="increment"
20 data-hydrated={hydrated ? "true" : "false"}
21 onClick={() => setCount(count + 1)}
22 >
23 increment
24 </button>
25 <p id="count">count:{count}</p>
26 </main>
27 );
28}