From 2ed2a8d41f90c2141fe2a3e29b585204cbe2157c Mon Sep 17 00:00:00 2001
From: "Tudor D. Pop" <tudor.dan.pop7@gmail.com>
Date: Thu, 17 Jun 2021 17:03:39 +0300
Subject: [PATCH] fix(wasm-support): WebAssembly browser support. (#9410)

* fix(wasm-support): WebAssembly browser support.

* fix(wasm-support): WebAssembly browser support.

Co-authored-by: tudordan7 <tudor.pop@decagon.tech>
---
 lang/main.json                                |  3 +-
 .../virtual-background/index.js               | 32 +++++++++++++++----
 react/features/virtual-background/actions.js  |  2 +-
 3 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/lang/main.json b/lang/main.json
index a8c03034f..5c5640f7f 100644
--- a/lang/main.json
+++ b/lang/main.json
@@ -362,7 +362,8 @@
         "image6" : "Forest ",
         "image7" : "Sunrise",
         "desktopShareError": "Could not create desktop share",
-        "desktopShare":"Desktop share"
+        "desktopShare":"Desktop share",
+        "webAssemblyWarning": "WebAssembly not supported"
     },
     "feedback": {
         "average": "Average",
diff --git a/react/features/stream-effects/virtual-background/index.js b/react/features/stream-effects/virtual-background/index.js
index f4549f336..f59ffb75e 100644
--- a/react/features/stream-effects/virtual-background/index.js
+++ b/react/features/stream-effects/virtual-background/index.js
@@ -1,11 +1,11 @@
 // @flow
 
-import * as wasmCheck from 'wasm-check';
+import { showWarningNotification } from '../../notifications/actions';
+import logger from '../../virtual-background/logger';
 
 import JitsiStreamBackgroundEffect from './JitsiStreamBackgroundEffect';
 import createTFLiteModule from './vendor/tflite/tflite';
 import createTFLiteSIMDModule from './vendor/tflite/tflite-simd';
-
 const models = {
     model96: 'libs/segm_lite_v681.tflite',
     model144: 'libs/segm_full_v679.tflite'
@@ -28,18 +28,36 @@ const segmentationDimensions = {
  *
  * @param {Object} virtualBackground - The virtual object that contains the background image source and
  * the isVirtualBackground flag that indicates if virtual image is activated.
+ * @param {Function} dispatch - The Redux dispatch function.
  * @returns {Promise<JitsiStreamBackgroundEffect>}
  */
-export async function createVirtualBackgroundEffect(virtualBackground: Object) {
+export async function createVirtualBackgroundEffect(virtualBackground: Object, dispatch: Function) {
     if (!MediaStreamTrack.prototype.getSettings && !MediaStreamTrack.prototype.getConstraints) {
         throw new Error('JitsiStreamBackgroundEffect not supported!');
     }
     let tflite;
+    let wasmCheck;
+
+    // Checks if WebAssembly feature is supported or enabled by/in the browser.
+    // Conditional import of wasm-check package is done to prevent
+    // the browser from crashing when the user opens the app.
+
+    try {
+        wasmCheck = require('wasm-check');
+        if (wasmCheck?.feature?.simd) {
+            tflite = await createTFLiteSIMDModule();
+        } else {
+            tflite = await createTFLiteModule();
+        }
+    } catch (err) {
+        logger.error('Looks like WebAssembly is disabled or not supported on this browser');
+        dispatch(showWarningNotification({
+            titleKey: 'virtualBackground.webAssemblyWarning',
+            description: 'WebAssembly disabled or not supported by this browser'
+        }));
+
+        return;
 
-    if (wasmCheck.feature.simd) {
-        tflite = await createTFLiteSIMDModule();
-    } else {
-        tflite = await createTFLiteModule();
     }
 
     const modelBufferOffset = tflite._getModelBufferMemoryOffset();
diff --git a/react/features/virtual-background/actions.js b/react/features/virtual-background/actions.js
index 2b366d12c..d5a05c157 100644
--- a/react/features/virtual-background/actions.js
+++ b/react/features/virtual-background/actions.js
@@ -22,7 +22,7 @@ export function toggleBackgroundEffect(options: Object, jitsiTrack: Object) {
         if (jitsiTrack) {
             try {
                 if (options.enabled) {
-                    await jitsiTrack.setEffect(await createVirtualBackgroundEffect(virtualBackground));
+                    await jitsiTrack.setEffect(await createVirtualBackgroundEffect(virtualBackground, dispatch));
                 } else {
                     await jitsiTrack.setEffect(undefined);
                     dispatch(backgroundEnabled(false));