Просмотр исходного кода

Merge pull request #892 from threema-ch/891-browser-compat

Show warning if browser does not support TextDecoder
Danilo Bargen 6 лет назад
Родитель
Сommit
32080d757e
4 измененных файлов с 25 добавлено и 7 удалено
  1. 10 4
      index.html
  2. 13 1
      public/js/compat.js
  3. 1 0
      src/sass/sections/_noscript.scss
  4. 1 2
      webpack.common.js

+ 10 - 4
index.html

@@ -59,7 +59,7 @@
 <body class="{{ ctrl.statusClass }}" ng-class="{expanded: ctrl.expandStatusBar}">
     <img src="img/bg.jpg?v=[[VERSION]]" aria-label="Background image: Blurred photo of a mountain" id="background-image" draggable="false">
 
-    <noscript class="compat">
+    <noscript class="compat compat-nojs">
         <img class="logo-compat" src="img/logo.svg?v=[[VERSION]]"/>
         <div>
             <h2>Error: JavaScript not supported</h2>
@@ -67,11 +67,17 @@
         </div>
     </noscript>
 
-    <div class="compat wasm" style="display: none;">
+    <div class="compat compat-js" style="display: none;">
         <img class="logo-compat" src="img/logo.svg?v=[[VERSION]]"/>
-        <div>
+        <div class="wasm" style="display: none;">
+            <h2>Error: Browser not supported</h2>
+            <p>You are using a browser without <strong>WebAssembly</strong> support. Please
+            upgrade to the latest version of a
+            <a href="https://threema.ch/faq/web_requirements">supported browser</a>.</p>
+        </div>
+        <div class="textdecoder" style="display: none;">
             <h2>Error: Browser not supported</h2>
-            <p>You are using a browser without WebAssembly support. Please
+            <p>You are using a browser without <strong>TextDecoder</strong> support. Please
             upgrade to the latest version of a
             <a href="https://threema.ch/faq/web_requirements">supported browser</a>.</p>
         </div>

+ 13 - 1
public/js/compat.js

@@ -1,7 +1,19 @@
+// WebAssembly
 if (typeof WebAssembly === "object" && typeof WebAssembly.instantiate === "function") {
     console.debug('Compat: WebAssembly is supported');
 } else {
     console.error('Compat: WebAssembly is NOT supported');
     // Show warning
-    document.querySelector('.compat.wasm').style = 'inherit';
+    document.querySelector('.compat.compat-js').style.display = 'inherit';
+    document.querySelector('.compat.compat-js .wasm').style.display = 'inherit';
+}
+
+// TextDecoder
+if (typeof TextDecoder !== "undefined") {
+    console.debug('Compat: TextDecoder is supported');
+} else {
+    console.error('Compat: TextDecoder is NOT supported');
+    // Show warning
+    document.querySelector('.compat.compat-js').style.display = 'inherit';
+    document.querySelector('.compat.compat-js .textdecoder').style.display = 'inherit';
 }

+ 1 - 0
src/sass/sections/_noscript.scss

@@ -14,6 +14,7 @@
         margin: 16px auto;
         min-width: 100px;
         max-width: 300px;
+        max-height: 80px;
         text-align: center;
     }
 

+ 1 - 2
webpack.common.js

@@ -5,14 +5,13 @@ const webpack = require('webpack');
 // https://stackoverflow.com/q/43307607
 // This does not mean that we support Firefox <60ESR!
 // We will increase the target again once FF52 has died out.
-const minFirefoxTarget = 44;
 const babelOptions = {
   presets: [
     ['@babel/preset-env', {
       corejs: 3,
       useBuiltIns: 'entry',
       targets: {
-        firefox: minFirefoxTarget,
+        firefox: 60,
         chrome: 65,
         opera: 52,
         safari: 11,