Merge

Playground/indexWebGPU.html

@@ -30,9 +30,9 @@
     <script src="https://preview.babylonjs.com/earcut.min.js"></script>
     <!-- Babylon.js -->
     <script src="https://preview.babylonjs.com/shaderc/shaderc.js"></script>
-    <script src="https://preview.babylonjs.com/babylon.js"></script>
+    <script src="js/babylonWebGpu.max.js"></script>
     <!-- <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script> -->
-    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>
+    <!-- <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script> -->
     <script src="https://preview.babylonjs.com/nodeEditor/babylon.nodeEditor.js"></script>
     <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>
     <!-- <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>

Playground/js/indexWebGPU.js

@@ -4,7 +4,12 @@ var monacoMode = "javascript";
 
 function getRunCode(jsEditor, callBack) {
     var code = jsEditor.getValue();
-    callBack(code);
+    callBack(code).catch((e) => {
+        showError(e);
+
+        // Also log error in console to help debug playgrounds
+        console.error(e);
+    })
 }
 
 
@@ -520,6 +525,11 @@ function showError(errorMessage, errorEvent) {
                 var createEngineFunction = "createDefaultEngine";
                 var createSceneFunction;
 
+                if (!navigator.gpu) {
+                    showError("WebGPU is not supported on your platform.", {});
+                    return;
+                }
+
                 getRunCode(jsEditor, async function(code) {
                     var createDefaultEngine = function() {
                         return new BABYLON.WebGPUEngine(canvas);
@@ -1228,7 +1238,7 @@ function showError(errorMessage, errorEvent) {
 
     var xhr = new XMLHttpRequest();
 
-    xhr.open('GET', "babylon.d.txt", true);
+    xhr.open('GET', "babylonWebGPU.d.txt", true);
 
     xhr.onreadystatechange = function() {
         if (xhr.readyState === 4) {