Making an Issue to track all things related to Discord on SerenityOS. :yakthulu:
Please feel free to add anything you find (or fix!) to the list. 🐞

Needed Features/HTML Libraries

• localStorage implementation 4797999
• Workers - Sorta (#12391)
• Workers - Really
• AudioContext + Audio (stubbed here)
• History - Needed by the main app
• StructuredSerialize - Needed by History
• WebSocket fragmented frames (20kb zlib chunk sent from server)
• Proper event handling

Landing Screens

Invite Screen Checklist:

• Load without crashing
• SVG Background
• Serenity logo
• localStorage implementation 4797999
• zero-sized/incorrectly sized elements
• <input> uses correct font size
• Username Input 5f54b8d
• Accept EULA 246c31c
• Continue button responsive
• Continue button background
• Captcha? Example - crashes a lot
• New account details
• Submit
• Auto-Login?

Invite Screen - Already have an account Checklist:

• Load without crashing (sometimes)
• Username & Password Input
• QR WebSocket login helper (@Lubrsi is looking at)
• User/Pass validation + submission (#12837)
• Login flow handled correctly

WebApp

These two screens below currently require you simulate a login by hard-coding your discord auth tokens into localStorage. (Steps at bottom of post)
Also, there are 2 additional resource loader redirects that need to be made for this to advance, they are listed further down.

Direct 'Accept Invite' button - REQUIRES localStorage fake login:

• Sends to discord:// URI handler, Browser can't handle, no auto-redirect

Direct to app Checklist - REQUIRES localStorage fake login:

• Load without crashing
• Lots of various SVG crashes #12428
• WebSocket issues (@Lubrsi's work probably related)
• Mis-aligned/stacked elements (like <10% chance the app loads this far)

Modifications

JS Errors

To help debug JS errors, it's suggested to make the following change to your VM.h file, so that you can fully trace errors even if they aren't logged to console.

diff --git a/Userland/Libraries/LibJS/Runtime/VM.h b/Userland/Libraries/LibJS/Runtime/VM.h
@@ -166,6 +166,9 @@ public:
     template<typename T, typename... Args>
     Completion throw_completion(GlobalObject& global_object, ErrorType type, Args&&... args)
     {
+        dbgln("Throwing JavaScript Exception (with message): {}", String::formatted(type.message(), forward<Args>(args)...));
+        dump_backtrace();
+
         return throw_completion<T>(global_object, String::formatted(type.message(), forward<Args>(args)...));
     }

ResourceLoader.cpp redirects

Resource Loader Patches (url's will change periodically):

• Everywhere - Firebug spam try{return window.Firebug.chrome.isInitialized}catch(e){return!1} => return !1;
• Direct to app- Regex Failure ((?=lg)?[vl]k\-?\d{3}) bui| 3\.[-\w; ]{10}lg?-([06cv9]{3,4}) => ((?=lg)[vl]k\-?\d{3}) bui| 3\.[-\w; ]{10}lg?-([06cv9]{3,4}) (second question mark removed) 1c8bb8a
• Direct to app - Weird deep copy Object.freeze(e);Object.getOwnPropertyNames(e).forEach((function(a){var n=e[a];"object"!=typeof n||Object.isFrozen(n)||t(n)})); => (fully removed)

Follow these steps for each file to patch

1. Download a copy of the file into Base/res/html/
2. Do find+replacement specified above (before prettier)
3. prettier -w <hash>.js to clean it up
4. Make the following change to your ResourceLoader.cpp file, using the hash of the file you are substituting.

diff --git a/Userland/Libraries/LibWeb/Loader/ResourceLoader.cpp b/Userland/Libraries/LibWeb/Loader/ResourceLoader.cpp
@@ -116,7 +116,20 @@

 void ResourceLoader::load(LoadRequest& request, Function<void(ReadonlyBytes, const HashMap<String, String, CaseInsensitiveStringTraits>& response_headers, Optional<u32> status_code)> success_callback, Function<void(const String&, Optional<u32> status_code)> error_callback)
 {
-    auto& url = request.url();
+    auto url = request.url();
+
+    if(url == "https://discord.com/assets/<hash>.js") {
+        url = "file:///res/html/<hash>.js";
+    }

localStorage direct login

If you want to attempt to load the webapp directly before the login page is working, you can simulate a session by extracting your localStorage tokens from your browser, and then directly setting them for discord.com like so:

DO NOT SHARE YOUR TOKENS! EVER!!!!

diff --git a/Userland/Libraries/LibWeb/DOM/Window.cpp b/Userland/Libraries/LibWeb/DOM/Window.cpp
@@ -445,8 +445,20 @@ RefPtr<HTML::Storage> Window::local_storage()
     // FIXME: Implement according to spec.
 
     static HashMap<Origin, NonnullRefPtr<HTML::Storage>> local_storage_per_origin;
-    return local_storage_per_origin.ensure(associated_document().origin(), [] {
-        return HTML::Storage::create();
+    return local_storage_per_origin.ensure(associated_document().origin(), [this] {
+        auto storage = HTML::Storage::create();
+
+        if(associated_document().origin().host() == "discord.com") {
+            storage->set_item("token", "\"...\"");
+            storage->set_item("tokens", "{\"...\"}");
+            storage->set_item("user_id_cache", "\"...\"");
+            storage->set_item("email_cache", "\"...\"");
+        }
+
+        return storage;
     });
 }