Scripts

Run the scripts that arrive with a new page, in order and only once.

Import it from pagefold/scripts (about 0.9 KB minified and compressed, shared code included).

import PagefoldScripts from 'pagefold/scripts'

new Pagefold({ plugins: [new PagefoldScripts()] })

Scripts that come in with fetched HTML do not run by themselves, which is how browsers treat them. This plugin replaces each new script with a fresh copy, which does run, in the order they appear.

Does a script run?

With the default settings, each script in the new content is checked in this order:

1. Was it already on the page? Like the script that started Pagefold, or a head tag that is identical on both pages.
   Yes → not run
   No ↓
2. Does it have data-pagefold-ignore-script?
   Yes → not run
   No ↓
3. It runs, in the order it appears in the page.

Yes: The script is skipped.

Only new scripts

Scripts that were already on the page, such as the one that started Pagefold, do not run again. A script that stays in the <head> between pages (the Head plugin keeps identical tags) is not repeated either. A script inside the replaced content is new on every visit, so it runs on every visit.

Controlling it

<!-- never run this one -->
<script data-pagefold-ignore-script>/* ... */</script>

<!-- with optin: true, run only the ones you mark -->
<script data-pagefold-reload-script>/* ... */</script>

With optin: true, marked scripts run on every visit even if they were already on the page.

Scripts run right after the content is replaced.

Common problems

• A script runs on every visit. It is inside the replaced content, so it is new each time. Move it to the <head> or outside the container if it should run once.
• A script never runs again. It was already on the page, which is by design. With optin: true, mark it with data-pagefold-reload-script.
• A module script does not run again. Browsers run a module once per document. Put the code in a function and call it from the page:view hook.

Options