From bd84a7c8d5c0648aee902305708bba986dc1f73e Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Tue, 7 Mar 2023 13:40:52 -0500
Subject: [PATCH] Support rendering `xhr` requests in new code viewer

Related commit:
- https://github.com/gorhill/uBlock/commit/33c437f99f30daa3172b097ba35ae662239f6013
---
 src/js/code-viewer.js | 26 +++++++++++++++++---------
 src/js/logger-ui.js   |  7 ++-----
 2 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/src/js/code-viewer.js b/src/js/code-viewer.js
index 98a469810..cebec5367 100644
--- a/src/js/code-viewer.js
+++ b/src/js/code-viewer.js
@@ -37,21 +37,29 @@ import { dom, qs$ } from './dom.js';
     dom.attr(a, 'title', url);
     const response = await fetch(url);
     const text = await response.text();
-    let value = '', mode = '';
-    switch ( params.get('type') ) {
-        case 'css':
-            mode = 'text/css';
+    let mime = response.headers.get('Content-Type') || '';
+    mime = mime.replace(/\s*;.*$/, '').trim();
+    let value = '';
+    switch ( mime ) {
+        case 'text/css':
             value = beautifier.css(text, { indent_size: 2 });
             break;
-        case 'html':
-            mode = 'text/html';
+        case 'text/html':
+        case 'application/xhtml+xml':
+        case 'application/xml':
+        case 'image/svg+xml':
             value = beautifier.html(text, { indent_size: 2 });
             break;
-        case 'js':
-            mode = 'text/javascript';
+        case 'text/javascript':
+        case 'application/javascript':
+        case 'application/x-javascript':
             value = beautifier.js(text, { indent_size: 4 });
             break;
+        case 'application/json':
+            value = beautifier.js(text, { indent_size: 2 });
+            break;
         default:
+            value = text;
             break;
     }
     const cmEditor = new CodeMirror(qs$('#content'), {
@@ -60,7 +68,7 @@ import { dom, qs$ } from './dom.js';
         lineNumbers: true,
         lineWrapping: true,
         matchBrackets: true,
-        mode,
+        mode: mime,
         styleActiveLine: {
             nonEmpty: true,
         },
diff --git a/src/js/logger-ui.js b/src/js/logger-ui.js
index 9a94226f5..b5f2b16c9 100644
--- a/src/js/logger-ui.js
+++ b/src/js/logger-ui.js
@@ -285,14 +285,11 @@ const nodeFromURL = function(parent, url, re, type) {
         let href = url;
         switch ( type ) {
             case 'css':
-                href = `code-viewer.html?url=${encodeURIComponent(url)}&type=css`;
-                break;
             case 'doc':
             case 'frame':
-                href = `code-viewer.html?url=${encodeURIComponent(url)}&type=html`;
-                break
             case 'script':
-                href = `code-viewer.html?url=${encodeURIComponent(url)}&type=js`;
+            case 'xhr':
+                href = `code-viewer.html?url=${encodeURIComponent(href)}`;
                 break;
             default:
                 break;