From c9ee1ad5aea794fd780133904d6b06a115148091 Mon Sep 17 00:00:00 2001
From: Kenneth Myhra <kennethmyhra@gmail.com>
Date: Sun, 2 Apr 2023 23:05:35 +0200
Subject: [PATCH] LibWeb: Add multipart/form-data demo to formdata.html

---
 Base/res/html/misc/formdata.html | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
diff --git a/Base/res/html/misc/formdata.html b/Base/res/html/misc/formdata.html
index bb1a3c25a3..0bdb3d773e 100644
--- a/Base/res/html/misc/formdata.html
+++ b/Base/res/html/misc/formdata.html
@@ -2,6 +2,14 @@
 <html>
 <head>
   <title>FormData</title>
+  <style>
+    .code-block {
+      background-color: grey;
+      color: lightgrey;
+      border-radius: 2px;
+      padding: 5px;
+    }
+  </style>
   <script>
     function log(s) {
       document.getElementById("out").innerHTML += `${s}\n`;
@@ -41,6 +49,15 @@
         log(`Entry: ${entry[0]}, ${entry[1]}`);
       }
     }
+
+    function postMultipartFormData() {
+      let form = document.getElementById("form1");
+      let formData = new FormData(form);
+      let xhr = new XMLHttpRequest;
+
+      xhr.open("POST", "http://localhost:8000");
+      xhr.send(formData);
+    }
   </script>
 </head>
 <body>
@@ -67,5 +84,9 @@
 
   <button onclick="dumpFormContents()">Test FormData Features</button>
 
+  <div style="padding-top: 30px; padding-left: 5px">To test multipart/form-data start a simple echo server:</div>
+  <div style="padding-left: 10px; padding-bottom: 10px"><span class="code-block">while true; do printf 'HTTP/1.1 200 OK\n' | nc -Nl 8000; done</span></div>
+  <button onclick="postMultipartFormData()">Test multipart/form-data</button>
+
   <pre id="out"></pre>
 </body>
