From cecca9f90f568cc7e41270980a5594407f9d0199 Mon Sep 17 00:00:00 2001
From: Butterfly Dev <dev@butterfly.local>
Date: Tue, 7 Apr 2026 04:01:56 +0000
Subject: [PATCH] fix: browser uses DomSanitizer for iframe, key-based reload
 instead of URL hack

---
 .../apps/browser/browser.component.html          |  3 ++-
 .../components/apps/browser/browser.component.ts | 16 ++++++++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/desktop/src/app/components/apps/browser/browser.component.html b/desktop/src/app/components/apps/browser/browser.component.html
index 271a0d9..e390cd8 100644
--- a/desktop/src/app/components/apps/browser/browser.component.html
+++ b/desktop/src/app/components/apps/browser/browser.component.html
@@ -17,7 +17,8 @@
   <!-- Content -->
   <div class="browser-content">
     <iframe
-      [src]="url()"
+      [src]="safeUrl()"
+      [attr.key]="reloadKey()"
       class="browser-frame"
       sandbox="allow-same-origin allow-scripts allow-forms"
       (load)="onLoad()"
diff --git a/desktop/src/app/components/apps/browser/browser.component.ts b/desktop/src/app/components/apps/browser/browser.component.ts
index 45f8444..f17ebb2 100644
--- a/desktop/src/app/components/apps/browser/browser.component.ts
+++ b/desktop/src/app/components/apps/browser/browser.component.ts
@@ -1,5 +1,6 @@
 import { Component, signal } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 
 @Component({
   selector: 'app-browser',
@@ -12,6 +13,15 @@ export class BrowserComponent {
   readonly url = signal('https://www.wikipedia.org');
   readonly inputUrl = signal('https://www.wikipedia.org');
   readonly isLoading = signal(false);
+  /** Used to force iframe reload without URL hacks. */
+  readonly reloadKey = signal(0);
+
+  constructor(private sanitizer: DomSanitizer) {}
+
+  /** Sanitized URL safe for iframe [src] binding. */
+  readonly safeUrl = signal<SafeResourceUrl>(
+    this.sanitizer.bypassSecurityTrustResourceUrl('https://www.wikipedia.org'),
+  );
 
   navigate(): void {
     let target = this.inputUrl().trim();
@@ -20,6 +30,8 @@ export class BrowserComponent {
     }
     this.inputUrl.set(target);
     this.url.set(target);
+    this.safeUrl.set(this.sanitizer.bypassSecurityTrustResourceUrl(target));
+    this.isLoading.set(true);
   }
 
   onUrlKeydown(event: KeyboardEvent): void {
@@ -34,7 +46,7 @@ export class BrowserComponent {
 
   refresh(): void {
     this.isLoading.set(true);
-    this.url.set(this.url() + ' '); // Force iframe reload
-    setTimeout(() => this.url.set(this.inputUrl()), 50);
+    // Bump the key to force Angular to recreate the iframe element.
+    this.reloadKey.update((k) => k + 1);
   }
 }