Audio resets on page navigation

[jolekszyk]

I'm excited about the possibility of using this gem to build a persistent audio player with React, similar to the example found here: https://github.com/palkan/turbo-music-drive/tree/demo/turbo-mount

However, I have not been able to get my React component to continue playing audio while navigating between pages. I have recreated the issue in a fork of Excellent Palettes, since we also use Vite in our stack. The fork can be found here: https://github.com/jolekszyk/excellent-palettes

In short, a basic audio tag, either wrapped in a parent element with data-turbo-permanent or with data-turbo-permanent set directly, works as expected:

<audio controls data-turbo-permanent id="basicAudio" src="<%= "/audios/sample.mp3" %>"></audio>

However, a simple React component with Turbo Mount does not regardless of where data-turbo-permanent is applied:

<div id="reactAudio" data-turbo-permanent>
  <%= turbo_mount("Test", props: { src: "/audios/sample.mp3" }) %>
</div>

The Test component:

export default function Test({ src }) {
  return <audio src={src} controls></audio>
}

Any ideas on what is preventing the audio from continuing to play when navigating between pages?