UI: Show alert if browser is too outdated (#2782)

src/utils/Protections.ts

@@ -22,3 +22,22 @@ if (window.indexedDB) {
     writable: false,
   });
 }
+
+// Some players use really old browser versions on unsupported OSes such as Windows 7. Intl.Segmenter and other APIs are
+// not supported in these browsers, so they will only see a black screen when loading the game. We should show an alert
+// to notify them that they should update their browser, if possible.
+if (typeof Intl.Segmenter !== "function" || typeof String.prototype.toWellFormed !== "function") {
+  const errorMessage = `Your browser is too outdated. Please update your browser.\n\nUserAgent: ${navigator.userAgent}`;
+  alert(errorMessage);
+  const rootElement = document.getElementById("root");
+  if (rootElement) {
+    rootElement.innerText = errorMessage;
+    rootElement.style.color = "red";
+    rootElement.style.fontSize = "20px";
+    rootElement.style.justifyContent = "center";
+  }
+  // If the browser does not support Intl.Segmenter, initialization of graphemeSegmenter in StringHelperFunctions.ts
+  // will fail, so this throw is technically unnecessary. However, if toWellFormed is not supported, the game can still
+  // load normally while darknet initialization fails, potentially causing UI issues such as an empty darknet tab.
+  throw new Error(errorMessage);
+}