Sample app update to test blob on external window

Author: codehippie1

SampleApp/src/app/features/features.component.html

@@ -723,10 +723,9 @@ <h3>On-Demand Actions</h3>
 
                 <mat-divider></mat-divider>
 
-                <h3>PDF Source Type Testing (Issue #283)</h3>
+                <h3>PDF Source Type Testing</h3>
                 <p class="section-description">
                   Test loading PDFs from different source types: string URL, Blob, or Uint8Array.
-                  This verifies that Issue #283 (Blob loading TypeError) is fixed.
                 </p>
                 <div class="action-buttons">
                   <button
@@ -753,6 +752,13 @@ <h3>PDF Source Type Testing (Issue #283)</h3>
                   >
                     <mat-icon>data_array</mat-icon> Load from Uint8Array
                   </button>
+                  <button
+                    mat-raised-button
+                    color="warn"
+                    (click)="loadBlobPdfInExternalWindow()"
+                  >
+                    <mat-icon>open_in_new</mat-icon> Load Blob in External Window
+                  </button>
                 </div>
                 <div class="info-box">
                   <mat-icon>info</mat-icon>
@@ -1444,3 +1450,12 @@ <h2 class="interactive-title">Document Loading Error</h2>
     </div>
   </ng-template>
 </div>
+
+<div class="external-viewer-host">
+  <ng2-pdfjs-viewer
+    #externalBlobViewer
+    [externalWindow]="true"
+    [urlValidation]="true"
+    [diagnosticLogs]="diagnosticLogs"
+  ></ng2-pdfjs-viewer>
+</div>

SampleApp/src/app/features/features.component.ts

@@ -13,6 +13,7 @@ import { VercelAnalyticsService } from "../services/vercel-analytics.service";
 })
 export class FeaturesComponent implements OnInit {
   @ViewChild("pdfViewer", { static: false }) public pdfViewer;
+  @ViewChild("externalBlobViewer", { static: false }) public externalBlobViewer;
 
   // Template references for different spinner styles
   @ViewChild("defaultSpinnerTemplate", { static: true })
@@ -551,6 +552,23 @@ export class FeaturesComponent implements OnInit {
     this.currentSourceType = 'string';
     console.log("✅ String pdfSrc set successfully");
   }
+  
+  public async loadBlobPdfInExternalWindow() {
+    try {
+      console.log("🧪 Testing Blob pdfSrc loading in external window with urlValidation=false...");
+      const response = await fetch('/assets/pdfjs/web/compressed.tracemonkey-pldi-09.pdf');
+      const blob = await response.blob();
+      
+      // Set blob for the separate external viewer and refresh
+      this.externalBlobViewer.pdfSrc = blob;
+      this.externalBlobViewer.refresh();
+      
+      console.log("✅ Blob pdfSrc set successfully for external window:", blob);
+      console.log("🔍 Check the console of the new window/tab for urlValidation diagnostic logs");
+    } catch (error) {
+      console.error("❌ Blob loading failed:", error);
+    }
+  }
 
   // Convenience setter demonstrations
   public useTraditionalApproach = true;