Tracking Issue: Full-page client-side navigation

What problem does this address?

Full-page, client-side navigation (for lack of a better name) is another navigation mode we want to include in the Interactivity API along with the current region-based, client-side navigation already implemented.

Region-based navigation works by updating the HTML of those regions defined on the current and target pages. When there are no matching regions between the two pages, navigation is delegated to the browser, and the page is reloaded. In such cases, the application's JS state is reset, and it is not possible to implement features such as keeping a video open or a song playing while navigating the page.

In contrast, full-page navigation updates the HTML of the entire page when navigating without the need to specify regions. This allows you to transition from one page to another on the site while maintaining the application's state. This is, in fact, what is implemented at https://wpmovies.dev/, although that implementation needs to be polished and improved before it can be published.

In that regard, @SantosGuillamot has created a PR with a first iteration under an experimental flag in #59707, although work remains to be done, especially in relation to the handling of new assets appearing on the target page, whether inside <head> or <body>. This feature is also missing for region-based navigation.

Current tasks

The following list of tasks is based on feedback received in #59707:

[x] ~Explore how to modify the body tag without the hack: link.~
- fixed in https://github.com/WordPress/gutenberg/pull/61212
[ ] Revisit how to fetch head assets: link.
- [ ] Change innerText for textContent and revisit how styles are injected: link.
- [ ] Check if Preact fails to reconcile scripts correctly when doing client-side navigation is still an issue.
- [ ] If the stylesheet remains the same, it should probably be left as-is: link. It would be nice to be able to reuse DOM diffing from Preact here if possible.
- [ ] Ensure caching is required: link
[ ] Explore how this interacts with Speculation Rules API: link.
[ ] Explore if we want to add event listeners to mobile: link. (Maybe on click is enough)
[ ] Explore how to update query attribute when the experiment is enabled: link. It looks like a core bug (see ticket/56417).
[ ] Accept only a string in the url parameter and adapt the tests to reflect that: link.
[x] ~Explore deeper how to use event delegation in the client: link.~
- Already implemented in https://github.com/WordPress/gutenberg/pull/59707/commits/d72cd023eae40645e8e787f24d91f515b12ce4ee
[ ] Add e2e tests: link.
[ ] Fix valid link logic to handle multisites and subdirectories: link
[ ] Consider adding touchstart or changing mouseenter event to pointerenter for prefetching: link
[ ] Pass URLs ineligible for client-side navigation from PHP (e.g. get_admin_url(), wp_login_url()) as opposed to hard-coding them: link

WordPress / gutenberg

Tracking Issue: Full-page client-side navigation #60951

What problem does this address?

Current tasks