diff --git a/web_src/js/features/repo-issue-pull.ts b/web_src/js/features/repo-issue-pull.ts
index 378f8c6d7fabf..4e148b3ec0f8b 100644
--- a/web_src/js/features/repo-issue-pull.ts
+++ b/web_src/js/features/repo-issue-pull.ts
@@ -68,7 +68,7 @@ async function initRepoPullRequestMergeForm(box: HTMLElement) {
   view.mount(el);
 }
 
-function executeScripts(elem: HTMLElement) {
+function executeScripts(elem: Element) {
   // find any existing nonce value from the current page and apply it to the new script
   const scriptNonce = document.querySelector('script[nonce]')!.getAttribute('nonce')!;
   for (const oldScript of elem.querySelectorAll('script')) {
diff --git a/web_src/js/markup/mermaid.ts b/web_src/js/markup/mermaid.ts
index aaf6da6805db2..59a10a1b9ec2a 100644
--- a/web_src/js/markup/mermaid.ts
+++ b/web_src/js/markup/mermaid.ts
@@ -1,4 +1,4 @@
-import {isDarkTheme, parseDom} from '../utils.ts';
+import {isDarkTheme} from '../utils.ts';
 import {displayError} from './common.ts';
 import {createElementFromAttrs, createElementFromHTML, queryElems} from '../utils/dom.ts';
 import {html, htmlRaw} from '../utils/html.ts';
@@ -81,7 +81,7 @@ async function loadMermaid(needElkRender: boolean) {
   };
 }
 
-function initMermaidViewController(viewController: HTMLElement, dragElement: SVGSVGElement) {
+function initMermaidViewController(viewController: Element, dragElement: SVGSVGElement) {
   let inited = false, isDragging = false;
   let currentScale = 1, initLeft = 0, lastLeft = 0, lastTop = 0, lastPageX = 0, lastPageY = 0;
 
@@ -201,8 +201,7 @@ export async function initMarkupCodeMermaid(elMarkup: HTMLElement): Promise<void
     try {
       // render the mermaid diagram to svg text, and parse it to a DOM node
       const {svg: svgText, bindFunctions} = await mermaid.render('mermaid', source, parentContainer);
-      const svgDoc = parseDom(svgText, 'image/svg+xml');
-      const svgNode = (svgDoc.documentElement as unknown) as SVGSVGElement;
+      const svgNode = createElementFromHTML<SVGSVGElement>(svgText);
 
       const viewControllerHtml = html`
         <div class="view-controller auto-hide-control flex-text-block">
diff --git a/web_src/js/utils/dom.ts b/web_src/js/utils/dom.ts
index e0c6f351939d1..d6823fc895082 100644
--- a/web_src/js/utils/dom.ts
+++ b/web_src/js/utils/dom.ts
@@ -265,7 +265,7 @@ export function isElemVisible(el: HTMLElement): boolean {
   return Boolean(!el.classList.contains('tw-hidden') && (el.offsetWidth || el.offsetHeight || el.getClientRects().length) && el.style.display !== 'none');
 }
 
-export function createElementFromHTML<T extends HTMLElement>(htmlString: string): T {
+export function createElementFromHTML<T extends Element>(htmlString: string): T {
   htmlString = htmlString.trim();
   // There is no way to create some elements without a proper parent, jQuery's approach: https://github.com/jquery/jquery/blob/main/src/manipulation/wrapMap.js
   // eslint-disable-next-line github/unescaped-html-literal