Navigation breaks when you have svelte:head or svelte:body in your component

[Joshswooft]

I slightly modified the basic example you have for Name.svelte to the following:

<script>
  // The params prop contains values matched from the URL
  export let params = {};
</script>

<h2>Hi there!</h2>

<p>
  Your name is:
  <b>{params.first}</b>
  <b
    >{#if params.last}{params.last}{/if}</b
  >
</p>
<p>
  This comes from the URL, matching <code>/hello/:first/:last?</code>, where the
  last name is optional.
</p>
<p>
  <em>Hint:</em> Try changing the URL and add your name, e.g.
  <code>/hello/alex</code>
  or <code>/hello/jane/doe</code>
</p>

<h1>$$ y = mx + c $$</h1>

<svelte:head>
  <script
    src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
</svelte:head>

The inclusion of the <svelte:head> causes this error to appear when pressing the back button in your browser:

Uncaught (in promise) TypeError: Cannot read properties of null (reading 'removeChild')
    at detach (index.mjs:373:21)
    at detach_dev (index.mjs:2019:5)
    at Object.destroy [as d] (Name.svelte:12:22)
    at destroy_component (index.mjs:1849:36)
    at Router.svelte:262:21
    at index.mjs:1142:17
    at run (index.mjs:18:12)
    at Array.forEach (<anonymous>)
    at run_all (index.mjs:24:9)
    at check_outros (index.mjs:1122:9)

After this error occurs navigating to other pages breaks.