Merge pull request #1574 from pguyot/w11/fix-wasm-web-ci

Fix wasm test with worker thread

Calling alert from worker thread no longer works and probably never should have.
Update example accordingly.

These changes are made under both the "Apache 2.0" and the "GNU Lesser General
Public License 2.1 or later" license terms (dual license).

SPDX-License-Identifier: Apache-2.0 OR LGPL-2.1-or-later

Author: bettio

examples/emscripten/run_script.erl

@@ -22,8 +22,14 @@
 -export([start/0]).
 
 start() ->
-    CounterPid = spawn(fun() -> counter_loop() end),
-    emscripten:run_script(<<"alert('hello from Erlang in main thread')">>, [main_thread]),
+    {CounterPid, CounterMonitor} = spawn_opt(fun() -> counter_loop() end, [monitor]),
+    emscripten:run_script(
+        <<
+            "console.log('hello from Erlang in main thread');"
+            "alert('hello from Erlang in main thread')"
+        >>,
+        [main_thread]
+    ),
     CounterPid ! {self(), terminate},
     receive
         {CounterPid, CounterValue, DeltaMS} ->
@@ -40,15 +46,20 @@ start() ->
                 ]
             )
     end,
-    emscripten:run_script(<<"alert('hello from Erlang in main thread async')">>, [
-        main_thread, async
-    ]),
-    emscripten:run_script(<<"alert('hello from Erlang in worker thread')">>),
+    % Ensure process terminated
+    receive
+        {'DOWN', CounterMonitor, process, CounterPid, normal} -> ok
+    end,
     emscripten:run_script(
-        <<"window.document.getElementById('demo-not').style = 'display: none';">>, [
-            main_thread
+        <<
+            "console.log('hello from Erlang in main thread async');"
+            "alert('hello from Erlang in main thread async')"
+        >>,
+        [
+            main_thread, async
         ]
-    ).
+    ),
+    emscripten:run_script(<<"console.log('hello from Erlang in worker thread')">>).
 
 counter_loop() ->
     StartTimeMS = erlang:system_time(millisecond),

examples/emscripten/run_script.html

@@ -30,29 +30,26 @@ <h1>Run script example</h1>
       <code>emscripten:run_script/2</code> to run Javascript from Erlang.
     </p>
 
-    <p>It displays three alerts:</p>
+    <p>It runs four Javascript scripts:</p>
     <ul>
-      <li>An alert in the main thread, synchronously</li>
-      <li>An alert in the main thread, asynchronously</li>
-      <li>An alert in the worker thread</li>
+      <li>One script from the main thread, synchronously, that prints a line to the console and displays an alert</li>
+      <li>One script from the main thread, asynchronously, that prints a line to the console and displays an alert</li>
+      <li>One script from the worker thread that prints a line to the console</li>
+      <li>One script that updates the DOM to display the time required for first script to run</li>
     </ul>
-    <p>Second alert is likely to appear after third alert.</p>
 
     <p>
       On non-SMP builds, it demonstrates the fact that Erlang continues to run
       when <code>emscripten:run_script/2</code> is called with
       <code>[main_thread]</code> as a counter is incremented while waiting for
-      first alert to complete. The value is <span id="demo-counter">unset</span>
+      first line to be printed. The value is <span id="demo-counter">unset</span>
     </p>
 
     <p>
       Beyond the counter, this example also demonstrates manipulating DOM (in
       the main thread) using JS function.
     </p>
 
-    <p>
-      Style of this text was <span id="demo-not">not</span> modified by Erlang.
-    </p>
     <script>
       // Arguments are loaded using fetch API.
       // wasm_webserver serves under /build/ files in build subdirectory.

src/platforms/emscripten/tests/cypress/e2e/examples.spec.cy.js

@@ -57,23 +57,38 @@ describe("emscripten hello world BEAM", () => {
 
 describe("emscripten run script", () => {
   it("should display three alerts and update counter", () => {
+    cy.visit("/run_script.html", {
+      onBeforeLoad(win) {
+        cy.stub(win.console, "log").as("consoleLog");
+      },
+    });
     const alert = cy.stub().as("alert");
     cy.on("window:alert", alert);
-    cy.visit("/run_script.html");
     cy.get("#demo-counter").should("contain", "unset");
-    cy.get("@alert").should(
+    cy.get("@consoleLog").should(
       "have.been.calledWith",
       "hello from Erlang in main thread",
     );
     cy.get("@alert").should(
-      "have.been.calledWithMatch",
-      "hello from Erlang in worker thread",
+      "have.been.calledWith",
+      "hello from Erlang in main thread",
+    );
+// window.console is not the console invoked by our code from worker
+// thread, or at least cypress stub doesn't work
+//  cy.get("@consoleLog").should(
+//    "have.been.calledWithMatch",
+//    "hello from Erlang in worker thread",
+//  );
+    cy.get("@consoleLog").should(
+      "have.been.calledWith",
+      "hello from Erlang in main thread async",
     );
     cy.get("@alert").should(
       "have.been.calledWith",
       "hello from Erlang in main thread async",
     );
     cy.get("#demo-counter").should("contain", "ms");
+    cy.get("@consoleLog").should("be.calledWith", "Return value: ok");
   });
 });