How to fix TrustedHTML assignement error with VueJS

Question

I maintain a Gmail Chrome extension using VueJS, which stopped working due to the recent Gmail rollout of Trusted Types and is now throwing the following error at load time:

This document requires 'TrustedHTML' assignment.

Uncaught (in promise) TypeError: Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.

Here is a shortened version of the loading code I tried to adapt to fix it:

import { createApp } from "vue";
import { DOMPurify } from "dompurify";
import App from "./App.vue";


if (window.trustedTypes && trustedTypes.createPolicy) {
  window.trustedTypes.createPolicy('default', {
    createHTML: (string, sink) => DOMPurify.sanitize(string, {RETURN_TRUSTED_TYPE: true})
  });
} else {
  console.error('Trusted Types not supported in this browser.');
}

export async function injectApp() {
  const vueApp = createApp(App);
  
  const extensionContainerNode = document.createElement('div');
  extensionContainerNode.classList.add('gmail-extension-container');

  const parentNode = document.querySelector('div.AO');
  parentNode.appendChild(extensionContainerNode);
  
  // Error thrown here due to Vue internal use of elt.innerHTML = ...
  vueApp.mount('.gmail-extension-container');
}

injectApp()

But the error stays the same.

I thought that declaring a default policy would be used as a catch-all replacement to all elt.innerHtml = ... assignements and be used in the vueApp.mount(...) execution.

What do I need to do to make my Vue App load again with the Trusted Types restrictions?