From cd4175c55978e054447ff73ee28f708630b6551a Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@element.io>
Date: Mon, 8 Mar 2021 14:17:31 +0100
Subject: [PATCH] more prototypes

---
 prototypes/webkit-blob-sandbox-fail/fail.html | 51 ++++++++++
 prototypes/webkit-blob-sandbox-fail/fix.html  | 98 +++++++++++++++++++
 .../webkit-blob-sandbox-fail/index.html       | 38 +++++++
 3 files changed, 187 insertions(+)
 create mode 100644 prototypes/webkit-blob-sandbox-fail/fail.html
 create mode 100644 prototypes/webkit-blob-sandbox-fail/fix.html
 create mode 100644 prototypes/webkit-blob-sandbox-fail/index.html
diff --git a/prototypes/webkit-blob-sandbox-fail/fail.html b/prototypes/webkit-blob-sandbox-fail/fail.html
new file mode 100644
index 00000000..974518dd
--- /dev/null
+++ b/prototypes/webkit-blob-sandbox-fail/fail.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+    </head>
+    <body>
+        <iframe id="iframe" sandbox="allow-scripts allow-downloads allow-downloads-without-user-activation"></iframe>
+        <script type="text/javascript">
+            const iframeHtml = `
+            <!DOCTYPE html>
+            <html>
+                <head>
+                    <meta charset="utf-8">
+                </head>
+                <body>
+                    <button id="download">Download</button>
+                    <a id="link" href="#">Link to progamatically click</a>
+                    <script type="text/javascript">
+                        var link = document.getElementById("link");
+                        var button = document.getElementById("download");
+                        async function download(blob, filename) {
+                            const slice = blob.slice(0, 1);
+                            const reader = new FileReader();
+                            reader.readAsArrayBuffer(slice);
+                            const buffer = await new Promise((resolve, reject) => {
+                                reader.addEventListener("abort", () => reject(new Error("aborted")));
+                                reader.addEventListener("error", e => reject(e.error));
+                                reader.addEventListener("load", e => resolve(e.target.result));
+                            });
+                            document.body.appendChild(document.createTextNode("buffer: " + new Uint8Array(buffer)[0] + " (" + buffer.byteLength + ")"));
+                            var url = URL.createObjectURL(blob);
+                            link.href = url;
+                            link.download = filename;
+                            link.innerText = url;
+                            link.click();
+                            URL.revokeObjectURL(url);
+                        }
+                        button.addEventListener("click", async function(event) {
+                            try {
+                                await download(new Blob(["a message from the iframe"], {type: "text/plain"}), "hello world.txt");
+                            } catch (err) {
+                                document.body.appendChild(document.createTextNode(err.toString()));
+                            }
+                        });
+                    </${"script"}>
+                </body>
+            </html>`;
+            document.getElementById("iframe").setAttribute("srcdoc", iframeHtml);
+        </script>
+    </body>
+</html>
diff --git a/prototypes/webkit-blob-sandbox-fail/fix.html b/prototypes/webkit-blob-sandbox-fail/fix.html
new file mode 100644
index 00000000..2e9e9d96
--- /dev/null
+++ b/prototypes/webkit-blob-sandbox-fail/fix.html
@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+    </head>
+    <body>
+        <button id="download">Download</button>
+        <iframe id="iframe" sandbox="allow-scripts allow-downloads allow-downloads-without-user-activation"></iframe>
+        <script type="text/javascript">
+            const iframeHtml = `
+            <!DOCTYPE html>
+            <html>
+                <head>
+                    <meta charset="utf-8">
+                </head>
+                <body>
+                    <a id="link" href="#">Link to progamatically click</a>
+                    <script type="text/javascript">
+                        var link = document.getElementById("link");
+
+                        function downloadBlob(blob, filename) {
+                            var url = URL.createObjectURL(blob);
+                            link.href = url;
+                            link.download = filename;
+                            link.innerText = url;
+                            link.click();
+                            URL.revokeObjectURL(url);
+                        }
+
+                        function toBase64(buffer) {
+                            let binaryStr = "";
+                            const bytes = new Uint8Array(buffer);
+                            for (let i = 0; i < bytes.byteLength; i++) {
+                                binaryStr += String.fromCharCode(bytes[i]);
+                            }
+                            return window.btoa(binaryStr);
+                        }
+
+                        function downloadBuffer(buffer, mimeType, filename) {
+                            var url = "data:" + mimeType + ";base64," + toBase64(buffer);
+                            link.href = url;
+                            link.download = filename;
+                            link.innerText = url;
+                            link.click();
+                        }
+
+                        window.addEventListener("message", async function(event) {
+                            // if (event.origin === window.location.origin) {
+                                if (event.data.type === "downloadBuffer") {
+                                    await downloadBuffer(event.data.buffer, event.data.mimeType, event.data.filename);
+                                } else if (event.data.type === "downloadBlob") {
+                                    await downloadBlob(event.data.blob, event.data.filename);
+                                }
+                            // }
+                        });
+                    </${"script"}>
+                </body>
+            </html>`;
+            const isIOS = /iPad|iPhone|iPod/.test(navigator.platform) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1) && !window.MSStream;
+            const iframe = document.getElementById("iframe");
+            const button = document.getElementById("download");
+            iframe.setAttribute("srcdoc", iframeHtml);
+            const blob = new Blob(["a message from the iframe"], {type: "text/plain"});
+            window.addEventListener("message", async event => {
+                //if (event.origin === window.location.origin) {
+                //}
+            });
+            button.addEventListener("click", async evt => {
+                if (isIOS) {
+                    const reader = new FileReader();
+                    const promise = new Promise((resolve, reject) => {
+                        reader.addEventListener("error", e => reject(e.error));
+                        reader.addEventListener("load", e => resolve(e.target.result));
+                    });
+                    reader.readAsArrayBuffer(blob);
+                    let buffer = await promise;
+
+                    iframe.contentWindow.postMessage({type: "downloadBuffer", mimeType: "text/plain", buffer, filename: "hello world.txt"}, "*");
+                } else {
+                    iframe.contentWindow.postMessage({type: "downloadBlob", blob, filename: "hello world.txt"}, "*");
+                }
+                /*
+                if (window.SharedArrayBuffer) {
+                    const srcView = new Uint8Array(buffer);
+                    const sharedBuffer = new SharedArrayBuffer(buffer.byteLength);
+                    const dstView = new Uint8Array(sharedBuffer);
+                    for (var i = srcView.length - 1; i >= 0; i--) {
+                        dstView[i] = srcView[i];
+                    }
+                    buffer = sharedBuffer;
+                }
+                */
+                //iframe.contentWindow.postMessage({type: "downloadBlob", blob, filename: "hello world.txt"}, "*");
+            });
+
+        </script>
+    </body>
+</html>
diff --git a/prototypes/webkit-blob-sandbox-fail/index.html b/prototypes/webkit-blob-sandbox-fail/index.html
new file mode 100644
index 00000000..25bb2f04
--- /dev/null
+++ b/prototypes/webkit-blob-sandbox-fail/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+    </head>
+    <body>
+        <iframe id="iframe" sandbox="allow-scripts allow-downloads allow-downloads-without-user-activation"></iframe>
+        <script type="text/javascript">
+            const iframeHtml = `
+            <!DOCTYPE html>
+            <html>
+                <head>
+                    <meta charset="utf-8">
+                </head>
+                <body>
+                    <button id="download">Download</button>
+                    <a id="link" href="#">Link to progamatically click</a>
+                    <script type="text/javascript">
+                        var link = document.getElementById("link");
+                        var button = document.getElementById("download");
+                        function download(str, filename) {
+                            var url = "data:text/plain;base64," + btoa(str);
+                            link.href = url;
+                            link.download = filename;
+                            link.innerText = url;
+                            link.click();
+                            URL.revokeObjectURL(url);
+                        }
+                        button.addEventListener("click", function(event) {
+                            download("hello world", "hello world.txt");
+                        });
+                    </${"script"}>
+                </body>
+            </html>`;
+            document.getElementById("iframe").setAttribute("srcdoc", iframeHtml);
+        </script>
+    </body>
+</html>
\ No newline at end of file
