Lazy load video and everything else (#350)

Co-authored-by: Kevin Brotcke <brotckek@amazon.com>
XCTestHTMLReport · Jan 23, 2024 · 04b4812 · 04b4812
1 parent 5a592f3
commit 04b4812
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 14 deletions.
diff --git a/Sources/XCTestHTMLReportCore/Classes/HTMLTemplates.swift b/Sources/XCTestHTMLReportCore/Classes/HTMLTemplates.swift
@@ -632,11 +632,11 @@ struct HTMLTemplates
         <div id=\"right-sidebar\" class=\"sidebar\">
           <div class=\"resizer\"></div>
           <h2>No Selected Attachment</h2>
-          <img src=\"\" class=\"displayed-screenshot\" id=\"screenshot\"/>
-          <img src=\"\" class=\"displayed-gif\" id=\"gif\"/>
-          <iframe id=\"text-attachment\" src=\"\"></iframe>
+          <img src=\"\" class=\"displayed-screenshot\" id=\"screenshot\" loading=\"lazy\"/>
+          <img src=\"\" class=\"displayed-gif\" id=\"gif\" loading=\"lazy\"/>
+          <iframe id=\"text-attachment\" src=\"\" loading=\"lazy\"></iframe>
           <h2 id=\"file-attachment\"><a target=\"_blank\"/></h2>
-          <video class=\"displayed-video\" controls src=\"\" id=\"video\"/>
+          <video class=\"displayed-video\" controls src=\"\" id=\"video\" preload=\"none\"/>
         </div>
         <div class=\"clear\"></div>
       </div>
@@ -1093,7 +1093,7 @@ struct HTMLTemplates
           <li class=\"selected\">All Messages</li>
         </ul>
       </div>
-      <iframe id=\"logs-iframe\" src=\"[[LOG_SOURCE]]\"></iframe>
+      <iframe id=\"logs-iframe\" src=\"[[LOG_SOURCE]]\" loading=\"lazy\"></iframe>
     </div>
   </div>
   """
@@ -1183,7 +1183,7 @@ struct HTMLTemplates
     <span class=\"icon left screenshot-icon\" style=\"margin-left: [[PADDING]]px\"></span>
     [[NAME]]
     <span class=\"icon preview-icon\" data=\"[[FILENAME]]\" onclick=\"showScreenshot('[[FILENAME]]')\"></span>
-    <img class=\"screenshot\" src=\"[[SOURCE]]\" id=\"screenshot-[[FILENAME]]\"/>
+    <img class=\"screenshot\" src=\"[[SOURCE]]\" id=\"screenshot-[[FILENAME]]\" loading=\"lazy\"/>
   </p>
   """
 
@@ -1192,7 +1192,7 @@ struct HTMLTemplates
     <span class="icon left screenshot-icon" style="margin-left: [[PADDING]]px"></span>
     [[NAME]]
   <span class=\"icon preview-icon\" data=\"[[FILENAME]]\" onclick=\"showGif('[[FILENAME]]')\"></span>
-    <img class=\"gif\" src=\"[[SOURCE]]\" id=\"gif-[[FILENAME]]\"/>
+    <img class=\"gif\" src=\"[[SOURCE]]\" id=\"gif-[[FILENAME]]\" loading=\"lazy\"/>
   </p>
   """
 
@@ -1201,7 +1201,7 @@ struct HTMLTemplates
     <span class=\"icon left video-icon\" style=\"margin-left: [[PADDING]]px\"></span>
     [[NAME]]
     <span class=\"icon preview-icon\" data=\"[[FILENAME]]\" onclick=\"showVideo('[[FILENAME]]')\"></span>
-    <video class=\"video\" controls src=\"[[SOURCE]]\" id=\"video-[[FILENAME]]\"/>
+    <video class=\"video\" controls src=\"[[SOURCE]]\" id=\"video-[[FILENAME]]\" preload=\"none\"/>
   </p>
   """
 

diff --git a/Sources/XCTestHTMLReportCore/Classes/Models/TestScreenshotFlow.swift b/Sources/XCTestHTMLReportCore/Classes/Models/TestScreenshotFlow.swift
@@ -45,7 +45,7 @@ struct ScreenshotFlowAttachment: HTML {
     let className: String
 
     var htmlTemplate: String {
-        "<img class=\"\(className)\" src=\"[[SRC]]\" id=\"screenshot-[[FILENAME]]\"/>"
+        "<img class=\"\(className)\" src=\"[[SRC]]\" id=\"screenshot-[[FILENAME]]\" loading=\"lazy\"/>"
     }
 
     var htmlPlaceholderValues: [String: String] {

diff --git a/Sources/XCTestHTMLReportCore/HTML/gif.html b/Sources/XCTestHTMLReportCore/HTML/gif.html
@@ -2,5 +2,5 @@
     <span class="icon left screenshot-icon" style="margin-left: [[PADDING]]px"></span>
     [[NAME]]
     <span class="icon preview-icon" data="[[FILENAME]]" onclick="showGif('[[FILENAME]]')"></span>
-    <img class="gif" src="[[SOURCE]]" id="gif-[[FILENAME]]" alt="[[FILENAME]]" />
+    <img class="gif" src="[[SOURCE]]" id="gif-[[FILENAME]]" alt="[[FILENAME]]" loading="lazy"/>
   </p>
diff --git a/Sources/XCTestHTMLReportCore/HTML/index.html b/Sources/XCTestHTMLReportCore/HTML/index.html
@@ -583,8 +583,8 @@ <h4 id="device-header">Devices</h4>
         <div id="right-sidebar" class="sidebar">
           <div class="resizer"></div>
           <h2>No Selected Attachment</h2>
-          <img src="" class="displayed-screenshot" id="screenshot" alt="screenshot"/>
-          <iframe id="text-attachment" src="" title="Text Attachment"></iframe>
+          <img src="" class="displayed-screenshot" id="screenshot" alt="screenshot" loading="lazy"/>
+          <iframe id="text-attachment" src="" title="Text Attachment" loading="lazy"></iframe>
         </div>
         <div class="clear"></div>
       </div>

diff --git a/Sources/XCTestHTMLReportCore/HTML/run.html b/Sources/XCTestHTMLReportCore/HTML/run.html
@@ -21,6 +21,6 @@
           <li class="selected">All Messages</li>
         </ul>
       </div>
-      <iframe id="logs-iframe" src="[[LOG_SOURCE]]" title="logs"></iframe>
+      <iframe id="logs-iframe" src="[[LOG_SOURCE]]" title="logs" loading="lazy"></iframe>
     </div>
   </div>
diff --git a/Sources/XCTestHTMLReportCore/HTML/screenshot.html b/Sources/XCTestHTMLReportCore/HTML/screenshot.html
@@ -2,5 +2,5 @@
     <span class="icon left screenshot-icon" style="margin-left: [[PADDING]]px"></span>
     [[NAME]]
     <span class="icon preview-icon" data="[[FILENAME]]" onclick="showScreenshot('[[FILENAME]]')"></span>
-    <img class="screenshot" src="[[SOURCE]]" loading="lazy" id="screenshot-[[FILENAME]]" alt="[[FILENAME]]"/>
+    <img class="screenshot" src="[[SOURCE]]" id="screenshot-[[FILENAME]]" alt="[[FILENAME]]" loading="lazy"/>
   </p>