diff --git a/packages/mermaid/src/diagram-api/types.ts b/packages/mermaid/src/diagram-api/types.ts
index 0bb05dd5c..265af6587 100644
--- a/packages/mermaid/src/diagram-api/types.ts
+++ b/packages/mermaid/src/diagram-api/types.ts
@@ -1,5 +1,6 @@
 import { Diagram } from '../Diagram.js';
 import { MermaidConfig } from '../config.type.js';
+import type * as d3 from 'd3';
 
 export interface InjectUtils {
   _log: any;
@@ -78,4 +79,6 @@ export type DrawDefinition = (
  */
 export type ParseDirectiveDefinition = (statement: string, context: string, type: string) => void;
 
-export type SVG = d3.Selection<HTMLFrameElement, unknown, HTMLElement, unknown>;
+export type HTML = d3.Selection<HTMLIFrameElement, unknown, Element, unknown>;
+
+export type SVG = d3.Selection<SVGSVGElement, unknown, Element, unknown>;
diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.ts b/packages/mermaid/src/diagrams/info/infoRenderer.ts
index 72bf4a524..f486ecac9 100644
--- a/packages/mermaid/src/diagrams/info/infoRenderer.ts
+++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts
@@ -2,7 +2,7 @@
 import { select } from 'd3';
 import { log } from '../../logger.js';
 import { getConfig } from '../../config.js';
-import type { DrawDefinition, SVG } from '../../diagram-api/types.js';
+import type { DrawDefinition, HTML, SVG } from '../../diagram-api/types.js';
 
 /**
  * Draws a an info picture in the tag with id: id based on the graph definition in text.
@@ -17,19 +17,20 @@ export const draw: DrawDefinition = (text, id, version) => {
 
     const securityLevel = getConfig().securityLevel;
     // handle root and document for when rendering in sandbox mode
-    let sandboxElement: SVG | undefined;
+    let sandboxElement: HTML | undefined;
+    let document: Document | null | undefined;
     if (securityLevel === 'sandbox') {
       sandboxElement = select('#i' + id);
-    }
-    let root;
-    if (securityLevel === 'sandbox' && sandboxElement !== undefined) {
-      root = select(sandboxElement.nodes()[0].contentDocument!.body);
-    } else {
-      root = select('body');
+      document = sandboxElement.nodes()[0].contentDocument;
     }
 
-    // @ts-ignore - TODO: figure out how to resolve this
-    const svg = root.select('#' + id);
+    // @ts-ignore - figure out how to assign HTML to document type
+    const root: HTML =
+      sandboxElement !== undefined && document !== undefined && document !== null
+        ? select(document)
+        : select('body');
+
+    const svg: SVG = root.select('#' + id);
     svg.attr('height', 100);
     svg.attr('width', 400);