fix: make JavaScript usable in Snyk Report tab

snyk · Jan 24, 2025 · 3a437cd · 3a437cd
1 parent 27a4930
commit 3a437cd
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 8 deletions.
diff --git a/ui/enhancer/snyk-report.ts b/ui/enhancer/snyk-report.ts
@@ -183,7 +183,13 @@ export class SnykReportTab extends Controls.BaseControl {
   };
 
   private fillReportIFrameContent = (content: string): void => {
-    (document.getElementById('iframeID') as HTMLDivElement).innerHTML = content;
+    const iframe = document.getElementById('snyk-report') as HTMLIFrameElement;
+    const doc = iframe.contentDocument || iframe.contentWindow?.document;
+    if (doc) {
+      doc.open();
+      doc.write(content);
+      doc.close();
+    }
   };
 }
 

diff --git a/ui/snyk-report-tab.html b/ui/snyk-report-tab.html
@@ -27,8 +27,9 @@
         height: 100%;
         overflow: auto;
       }
-      .iframeContainer {
+      .snyk-report {
         overflow: auto;
+        min-width: 100%;
         min-height: 100%;
       }
       .list {
@@ -65,7 +66,7 @@
     <script type="text/javascript">
       VSS.init({
         explicitNotifyLoaded: true,
-        usePlatformScripts: true,
+        usePlatformScripts: false,
         usePlatformStyles: true,
         moduleLoaderConfig: {
           paths: {
@@ -84,11 +85,15 @@
     <script type="text/javascript">
       VSS.init();
     </script>
-    <h2>Reports:</h2>
-    <ul id="reportList" class="list"></ul>
-    <div class="iframeContainer">
-      <div id="iframeID" class="iframe"></div>
+    <div class="header">
+      <h2>Reports:</h2>
     </div>
-    <div id="snyk-report" class="container"></div>
+    <ul id="reportList" class="list"></ul>
+    <iframe
+      id="snyk-report"
+      class="snyk-report"
+      sandbox="allow-scripts allow-same-origin allow-forms allow-modals allow-popups allow-presentation"
+      src="about:blank"
+    ></iframe>
   </body>
 </html>