lightpanda-io · karlseguin · Nov 21, 2025 · Nov 20, 2025 · Nov 21, 2025 · Nov 21, 2025
diff --git a/src/browser/Factory.zig b/src/browser/Factory.zig
@@ -31,6 +31,7 @@ const Element = @import("webapi/Element.zig");
 const Document = @import("webapi/Document.zig");
 const EventTarget = @import("webapi/EventTarget.zig");
 const XMLHttpRequestEventTarget = @import("webapi/net/XMLHttpRequestEventTarget.zig");
+const Blob = @import("webapi/Blob.zig");
 
 const MemoryPoolAligned = std.heap.MemoryPoolAligned;
 
@@ -224,6 +225,20 @@ pub fn xhrEventTarget(self: *Factory, child: anytype) !*@TypeOf(child) {
     return child_ptr;
 }
 
+pub fn blob(self: *Factory, child: anytype) !*@TypeOf(child) {
+    const child_ptr = try self.createT(@TypeOf(child));
+    child_ptr.* = child;
+
+    const b = try self.createT(Blob);
+    child_ptr._proto = b;
+    b.* = .{
+        ._type = unionInit(Blob.Type, child_ptr),
+        .slice = "",
+        .mime = "",
+    };
+    return child_ptr;
+}
+
 pub fn create(self: *Factory, value: anytype) !*@TypeOf(value) {
     const ptr = try self.createT(@TypeOf(value));
     ptr.* = value;

diff --git a/src/browser/js/bridge.zig b/src/browser/js/bridge.zig
@@ -564,4 +564,6 @@ pub const JsApis = flattenTypes(&.{
     @import("../webapi/IntersectionObserver.zig"),
     @import("../webapi/CustomElementRegistry.zig"),
     @import("../webapi/ResizeObserver.zig"),
+    @import("../webapi/Blob.zig"),
+    @import("../webapi/File.zig"),
 });
diff --git a/src/browser/tests/blob.html b/src/browser/tests/blob.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<head id="the_head">
+  <title>Test Document Title</title>
+  <script src="./testing.js"></script>
+</head>
+
+<script id=basic>
+  {
+    const parts = ["\r\nthe quick brown\rfo\rx\r", "\njumps over\r\nthe\nlazy\r", "\ndog"];
+    // "transparent" ending should not modify the final buffer.
+    const blob = new Blob(parts, { type: "text/html" });
+
+    const expected = parts.join("");
+    testing.expectEqual(expected.length, blob.size);
+    testing.expectEqual("text/html", blob.type);
+    testing.async(blob.text(), result => testing.expectEqual(expected, result));
+  }
+
+  {
+    const parts = ["\rhello\r", "\nwor\r\nld"];
+    // "native" ending should modify the final buffer.
+    const blob = new Blob(parts, { endings: "native" });
+
+    const expected = "\nhello\n\nwor\nld";
+    testing.expectEqual(expected.length, blob.size);
+    testing.async(blob.text(), result => testing.expectEqual(expected, result));
+  }
+</script>
+
+<script id=slice>
+  {
+    const parts = ["la", "symphonie", "des", "éclairs"];
+    const blob = new Blob(parts);
+
+    let temp = blob.slice(0);
+    testing.expectEqual(blob.size, temp.size);
+    testing.async(temp.text(), result => {
+      testing.expectEqual("lasymphoniedeséclairs", result);
+    });
+
+    temp = blob.slice(-4, -2, "custom");
+    testing.expectEqual(2, temp.size);
+    testing.expectEqual("custom", temp.type);
+    testing.async(temp.text(), result => testing.expectEqual("ai", result));
+
+    temp = blob.slice(14);
+    testing.expectEqual(8, temp.size);
+    testing.async(temp.text(), result => testing.expectEqual("éclairs", result));
+
+    temp = blob.slice(6, -10, "text/eclair");
+    testing.expectEqual(6, temp.size);
+    testing.expectEqual("text/eclair", temp.type);
+    testing.async(temp.text(), result => testing.expectEqual("honied", result));
+  }
+</script>
+
+<!-- Firefox and Safari only -->
+<script id=bytes>
+  {
+    const parts = ["light ", "panda ", "rocks ", "!"];
+    const blob = new Blob(parts);
+
+    testing.async(blob.bytes(), result => {
+      const expected = new Uint8Array([108, 105, 103, 104, 116, 32, 112, 97,
+                                       110, 100, 97, 32, 114, 111, 99, 107, 115,
+                                       32, 33]);
+      testing.expectEqual(true, result instanceof Uint8Array);
+      testing.expectEqual(expected, result);
+    });
+  }
+
+  // Test for SIMD.
+  {
+    const parts = [
+      "\rThe opened package\r\nof potato\nchi\rps",
+      "held the\r\nanswer to the\r mystery. Both det\rectives looke\r\rd\r",
+      "\rat it but failed to realize\nit was\r\nthe\rkey\r\n",
+      "\r\nto solve the \rcrime.\r"
+    ];
+
+    const blob = new Blob(parts, { type: "text/html", endings: "native" });
+    testing.expectEqual(161, blob.size);
+    testing.expectEqual("text/html", blob.type);
+    testing.async(blob.bytes(), result => {
+      const expected = new Uint8Array([10, 84, 104, 101, 32, 111, 112, 101, 110,
+                                       101, 100, 32, 112, 97, 99, 107, 97, 103,
+                                       101, 10, 111, 102, 32, 112, 111, 116, 97,
+                                       116, 111, 10, 99, 104, 105, 10, 112, 115,
+                                       104, 101, 108, 100, 32, 116, 104, 101, 10,
+                                       97, 110, 115, 119, 101, 114, 32, 116, 111,
+                                       32, 116, 104, 101, 10, 32, 109, 121, 115,
+                                       116, 101, 114, 121, 46, 32, 66, 111, 116,
+                                       104, 32, 100, 101, 116, 10, 101, 99, 116,
+                                       105, 118, 101, 115, 32, 108, 111, 111, 107,
+                                       101, 10, 10, 100, 10, 10, 97, 116, 32, 105,
+                                       116, 32, 98, 117, 116, 32, 102, 97, 105, 108,
+                                       101, 100, 32, 116, 111, 32, 114, 101, 97,
+                                       108, 105, 122, 101, 10, 105, 116, 32, 119, 97,
+                                       115, 10, 116, 104, 101, 10, 107, 101, 121,
+                                       10, 10, 116, 111, 32, 115, 111, 108, 118, 101,
+                                       32, 116, 104, 101, 32, 10, 99, 114, 105, 109,
+                                       101, 46, 10]);
+      testing.expectEqual(true, result instanceof Uint8Array);
+      testing.expectEqual(expected, result);
+    });
+  }
+</script>
diff --git a/src/browser/tests/file.html b/src/browser/tests/file.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<head id="the_head">
+  <title>Test Document Title</title>
+  <script src="./testing.js"></script>
+</head>
+
+<script id=file>
+  const file = new File();
+
+  testing.expectEqual(true, file instanceof File);
+  testing.expectEqual(true, file instanceof Blob);
+</script>