Sometimes get an empty extra/double placeholder for our single-spa app

[MattiasJa]

Hello, sometimes when navigating in our app, usually back and forth between two routes, we get double placeholders. One contain content from the single-spa react app @ns/right. But the other one is empty. Rendered example :

<div slot="right-slot">
	<div id="@ns/right">....content...</div>
	<div id="@ns/right"></div>
</div>

Where the second empty placeholder is not expected and unwanted. What could be the reason for this?

The microfrontend-layout.html look something like below (simplified) :

<route path='/path/:pathId' exact>
      <root-layout>
        ```
        <div slot="right-slot">
          <application name="@ns/right"></application>
        </div>
      </root-layout>
</route>
<route path='/path' exact>
      <root-layout>
        ```
        <div slot="right-slot">
          <application name="@ns/right"></application>
        </div>
      </root-layout>
</route>

Two routes, and the same MF is mounted.

Lifecycles for @ns/right as below. Nothing special :

const lifecycles = singleSpaReact({
  React,
  ReactDOM,
  rootComponent: Root,
  errorBoundary(_err, _info, _props) {
    // Customize the root error boundary for your microfrontend here.
    return null;
  },
  renderType: 'createRoot',
});

"single-spa": "^5.9.4",
"single-spa-html": "^1.3.0",
"single-spa-layout": "1.6.0",
"single-spa-react": "^5.1.4",
"systemjs": "^6.14.0",

[MilanKovacic]

Can you please try to create a minimum reproduction repository?

[MilanKovacic]

Closing issue due to inactivity. Feel free to reopen if the issue still persists.