Safari (web and iOS) doesn't re-create / copy the ShadowRoot when a web component is swapped

``has a default Shadow DOM for the player chrome and controls.

```hmtl

Load a video

`video.html` :
```html

Play
Pause

var movie = document.querySelector("#video");
var playBtn = document.querySelector("#play");
var pauseBtn = document.querySelector("#pause");
playBtn.addEventListener('click', function(e) {
movie.play();
});
pauseBtn.addEventListener('click', function(e) {
movie.pause();
});

```

Chrome and Firefox render a ShadowRoot for the video element correctly, and display the native video controls. In Safari the Shadow DOM is empty and no controls are displayed - but the movie can still be controlled programatically (the movie plays but is blank when paused).

I'm not really sure what the expected behaviour is when swapping a web component, and if it differs for 'native' and custom web components. Are Chrome and Firefox cloning the Shadow DOM tree when htmx swaps an element, and Safari isn't? Or are they recreating it automatically after the swap because `` has a default shadow dom? Is there a way to re-initialise the default shadow DOMs of elements like ``?