Use XHR instead of fetch requests

src/invidious/views/watch.ecr

@@ -205,15 +205,6 @@ function toggle_comments(target) {
   }
 }
 
-function timeout(ms, promise) {
-  return new Promise(function(resolve, reject) {
-    setTimeout(function() {
-      reject(new Error('timeout'));
-    }, ms);
-    promise.then(resolve, reject);
-  });
-}
-
 function load_comments(target) {
   var continuation = target.getAttribute('data-continuation');
 
@@ -222,66 +213,74 @@ function load_comments(target) {
   body.innerHTML =
     '<h3><center class="loading"><i class="icon ion-ios-refresh"></i></center></h3>';
 
-  var url =
+  var url = '/api/v1/comments/<%= video.id %>?format=html&continuation=' + continuation;
-    '/api/v1/comments/<%= video.id %>?format=html&continuation=' + continuation;
+  var xhr = new XMLHttpRequest();
-  timeout(5000, fetch(url))
+  xhr.responseType = 'json';
-    .then(function(response) {
+  xhr.timeout = 10000;
-      return response.json();
+  xhr.open("GET", url, true);
-    })
+  xhr.send();
-    .then(
+
-      function(jsonResponse) {
+  xhr.onreadystatechange = function() {
-        body.innerHTML = jsonResponse.content_html;
+    if(xhr.readyState == 4 && xhr.status == 200) {
-      },
+      body.innerHTML = xhr.response.content_html;
-      function(error) {
+    } else {
-        body.innerHTML = fallback;
+      body.innerHTML = fallback;
-        console.log(response);
+    }
-      }
+  }
-    )
+
-    .catch(function(error) {
+  xhr.ontimeout = function() {
       body.innerHTML = fallback;
-      console.log(error);
+  }
-    });
 }
 
 function get_reddit_comments() {
-  fetch('/api/v1/comments/<%= video.id %>?source=reddit')
+  var url = '/api/v1/comments/<%= video.id %>?source=reddit';
-    .then(function(response) {
+  var xhr = new XMLHttpRequest();
-      return response.json();
+  xhr.responseType = 'json';
-    })
+  xhr.timeout = 10000;
-    .then(
+  xhr.open("GET", url, true);
-      function(jsonResponse) {
+  xhr.send();
-        comments = document.getElementById('comments');
-        comments.innerHTML = `
-        <div>
-            <h3>
-                <a href="javascript:void(0)" onclick="toggle_comments(this)">[ - ]</a> 
-                {title}
-            </h3>
-            <b>
-                <a target="_blank" href="https://reddit.com{permalink}">View more comments on Reddit</a>
-            </b>
-        </div>
-        <div>{content_html}</div>
 
-        <hr style="margin-left:1em; margin-right:1em;">`.supplant({
+  xhr.onreadystatechange = function() {
-          title: jsonResponse.title,
+    if(xhr.readyState == 4 && xhr.status == 200) {
-          permalink: jsonResponse.permalink,
+      comments = document.getElementById('comments');
-          content_html: jsonResponse.content_html
+      comments.innerHTML = `
-        });
+      <div>
-      },
+          <h3>
-      function(response) {
+              <a href="javascript:void(0)" onclick="toggle_comments(this)">[ - ]</a> 
-        get_youtube_comments();
+              {title}
-      }
+          </h3>
-    );
+          <b>
+              <a target="_blank" href="https://reddit.com{permalink}">View more comments on Reddit</a>
+          </b>
+      </div>
+      <div>{content_html}</div>
+  
+      <hr style="margin-left:1em; margin-right:1em;">`.supplant({
+          title: xhr.response.title,
+          permalink: xhr.response.permalink,
+          content_html: xhr.response.content_html
+      });
+    } else {
+      get_youtube_comments();
+    }
+  };
+
+  xhr.ontimeout = function() {
+      get_reddit_comments();
+  }
 }
 
 function get_youtube_comments() {
-  fetch('/api/v1/comments/<%= video.id %>?format=html')
+  var url = '/api/v1/comments/<%= video.id %>?format=html';
-    .then(function(response) {
+  var xhr = new XMLHttpRequest();
-      return response.json();
+  xhr.responseType = 'json';
-    })
+  xhr.timeout = 10000;
-    .then(
+  xhr.open("GET", url, true);
-      function(jsonResponse) {
+  xhr.send();
+
+  xhr.onreadystatechange = function() {
+    if(xhr.readyState == 4 && xhr.status == 200) {
         comments = document.getElementById('comments');
         comments.innerHTML = `
         <div>
@@ -292,13 +291,17 @@ function get_youtube_comments() {
         </div>
         <div>{content_html}</div>
         <hr style="margin-left:1em; margin-right:1em;">`.supplant({
-          content_html: jsonResponse.content_html
+          content_html: xhr.response.content_html
         });
-      },
+      } else {
-      function(response) {
+          comments = document.getElementById('comments');
-        comments.innerHTML = '';
+          comments.innerHTML = '';
       }
-    );
+  }
+
+  xhr.ontimeout = function () {
+    get_youtube_comments();
+  }
 }
 
 String.prototype.supplant = function(o) {