[MIRROR] Revert "Pre-516 tgui prep (#82473)" (#2772)

* [MIRROR] Revert "Pre-516 tgui prep (#82473)" (#1847) * Revert "Pre-516 tgui prep (#82473)" * Revert "[MIRROR] Pre-516 tgui prep (#1841)" This reverts commit b98a95c8d3b4238c3a30450ab0f3ad67efa062d4. --------- Co-authored-by: san7890 <[email protected]> Co-authored-by: Mal <[email protected]> * Revert "Pre-516 tgui prep (#82473)" (#1847) * Revert "Pre-516 tgui prep (#82473)" * Revert "[MIRROR] Pre-516 tgui prep (#1841)" This reverts commit b98a95c8d3b4238c3a30450ab0f3ad67efa062d4. --------- Co-authored-by: san7890 <[email protected]> Co-authored-by: Mal <[email protected]> --------- Co-authored-by: NovaBot <[email protected]> Co-authored-by: san7890 <[email protected]> Co-authored-by: Mal <[email protected]> Co-authored-by: Iajret <[email protected]>
Fluffy-Frontier · Apr 8, 2024 · 7f93b6e · 7f93b6e
1 parent 790106c
commit 7f93b6e
Show file tree

Hide file tree

Showing 14 changed files with 570 additions and 536 deletions.
diff --git a/tgui/.gitignore b/tgui/.gitignore
@@ -17,7 +17,6 @@ package-lock.json
 /public/**/*
 !/public/*.html
 !/public/tgui-polyfill.min.js
-!/public/utils.min.js
 /coverage
 
 ## Previously ignored locations that are kept to avoid confusing git

diff --git a/tgui/global.d.ts b/tgui/global.d.ts
@@ -46,6 +46,31 @@ type ByondType = {
    */
   IS_BYOND: boolean;
 
+  /**
+   * Version of Trident engine of Internet Explorer. Null if N/A.
+   */
+  TRIDENT: number | null;
+
+  /**
+   * True if browser is IE8 or lower.
+   */
+  IS_LTE_IE8: boolean;
+
+  /**
+   * True if browser is IE9 or lower.
+   */
+  IS_LTE_IE9: boolean;
+
+  /**
+   * True if browser is IE10 or lower.
+   */
+  IS_LTE_IE10: boolean;
+
+  /**
+   * True if browser is IE11 or lower.
+   */
+  IS_LTE_IE11: boolean;
+
   /**
    * If `true`, unhandled errors and common mistakes result in a blue screen
    * of death, which stops this window from handling incoming messages and

diff --git a/tgui/packages/tgui-panel/chat/renderer.jsx b/tgui/packages/tgui-panel/chat/renderer.jsx
@@ -6,7 +6,7 @@
 
 import { EventEmitter } from 'common/events';
 import { classes } from 'common/react';
-import { createRoot } from 'react-dom/client';
+import { render } from 'react-dom';
 import { Tooltip } from 'tgui/components';
 import { createLogger } from 'tgui/logging';
 
@@ -37,8 +37,6 @@ export const TGUI_CHAT_COMPONENTS = {
   Tooltip,
 };
 
-let reactRoot = null;
-
 // List of injectable attibute names mapped to their proper prop
 // We need this because attibutes don't support lowercase names
 export const TGUI_CHAT_ATTRIBUTES_TO_PROPS = {
@@ -170,7 +168,7 @@ class ChatRenderer {
     // Find scrollable parent
     this.scrollNode = findNearestScrollableParent(this.rootNode);
     this.scrollNode.addEventListener('scroll', this.handleScroll);
-    setTimeout(() => {
+    setImmediate(() => {
       this.scrollToBottom();
     });
     // Flush the queue
@@ -415,19 +413,14 @@ class ChatRenderer {
             childNode.removeChild(childNode.firstChild);
           }
           const Element = TGUI_CHAT_COMPONENTS[targetName];
-
-          if (!reactRoot) {
-            const root = document.getElementById('react-root');
-            reactRoot = createRoot(root);
-          }
-
           /* eslint-disable react/no-danger */
-          reactRoot.render(
+          render(
             <Element {...outputProps}>
               <span dangerouslySetInnerHTML={oldHtml} />
             </Element>,
             childNode,
           );
+          /* eslint-enable react/no-danger */
         }
 
         // Highlight text
@@ -462,9 +455,15 @@ class ChatRenderer {
       message.node = node;
       // Query all possible selectors to find out the message type
       if (!message.type) {
-        const typeDef = MESSAGE_TYPES.find(
-          (typeDef) => typeDef.selector && node.querySelector(typeDef.selector),
-        );
+        // IE8: Does not support querySelector on elements that
+        // are not yet in the document.
+
+        const typeDef =
+          !Byond.IS_LTE_IE8 &&
+          MESSAGE_TYPES.find(
+            (typeDef) =>
+              typeDef.selector && node.querySelector(typeDef.selector),
+          );
         message.type = typeDef?.type || MESSAGE_TYPE_UNKNOWN;
       }
       updateMessageBadge(message);
@@ -487,7 +486,7 @@ class ChatRenderer {
         this.rootNode.appendChild(fragment);
       }
       if (this.scrollTracking) {
-        setTimeout(() => this.scrollToBottom());
+        setImmediate(() => this.scrollToBottom());
       }
     }
     // Notify listeners that we have processed the batch
@@ -587,6 +586,10 @@ class ChatRenderer {
   }
 
   saveToDisk() {
+    // Allow only on IE11
+    if (Byond.IS_LTE_IE10) {
+      return;
+    }
     // Compile currently loaded stylesheets as CSS text
     let cssText = '';
     const styleSheets = document.styleSheets;

diff --git a/tgui/packages/tgui-panel/panelFocus.js b/tgui/packages/tgui-panel/panelFocus.js
@@ -15,7 +15,7 @@ import { focusMap } from 'tgui/focus';
 // text you can select with the mouse.
 const MIN_SELECTION_DISTANCE = 10;
 
-const deferredFocusMap = () => setTimeout(() => focusMap());
+const deferredFocusMap = () => setImmediate(() => focusMap());
 
 export const setupPanelFocusHacks = () => {
   let focusStolen = false;