timescale.info#212 · Page titles name what is open: "Timeline · site name" (#210)
- timeline-app
- pull request
Closes #210. Page titles now say what is open, in the form **"what · site name"**. The site name is `PLATFORM_NAME` (such as timescale.info) when set, otherwise OpenChronology. I kept the ` · ` separator the site's titles already use (e.g. "Download · OpenChronology") rather than ` - `. ## The editor - The editor titles its page after the open timeline, and updates as you rename it or open another one. An untitled timeline reads "Untitled timeline". The dashboard, or a timeline still loading, leaves the page's own title. - **Offline file and desktop app:** "My timeline · OpenChronology". - **Website:** the editor runs in a frame, so it sends the title to the page around it (`openchronology:title`), which shows it with the site's name: "My timeline · timescale.info". - **Moment and duration pages:** a timeline's page already had a server title (`pageMetadata`), which may also name a moment or duration. That title stays until a different timeline is open. - **Timing:** - The frame can send the title before the page starts listening. It therefore also records the title on its ` `, and the page reads that when it starts. - After a client-side navigation, Next.js sets the new page's title once the editor has already set its own. A `MutationObserver` on ` ` puts the editor's title back, and remembers Next's as the page's own. ## Pages that had only the default title | Page | Title | | --- | --- | | `/login`, `/account`, `/admin` | Sign in · Account · Administration (· site) | | `/compare`, `/connect/desktop/…`, `/legal`, `/plugins`, `/editor` | Compare timelines · Connect the desktop app · Terms, privacy and licenses · Plugin library · Editor (· site) | | A timeline's history, saved version, pull requests, a pull request, new pull request, settings and sync pages | e.g. "Saved history · My timeline · site" | They use a new `pageTitle(...parts)` in `platform/lib/sharing.js`. The home page keeps the site's default title. ## Tests - `test/next-platform.mjs` checks the titles of six pages under `PLATFORM_NAME=timescale.test`. In the browser it checks that `/editor?new=1` reaches "Untitled timeline · timescale.test" after client-side navigation, and that importing a file turns it into "Imported through Next · timescale.test". - `test/offline-browser.mjs` checks the CFAM file's title. - Locally: `npm test` (299), typecheck, Prettier, and `test/browser.mjs`, `test/offline-browser.mjs` and the platform test with its browser part, in Chromium, in the Playwright Docker image.
Sources
Open #212 · Page titles name what is open: "Timeline · site name" (#210) in the timeline