From 26193cb9306ed393a60e08db840da285b3b48dc3 Mon Sep 17 00:00:00 2001
From: Michael Kerscher <kerscher@google.com>
Date: Fri, 13 Dec 2024 13:32:55 +0100
Subject: [PATCH] tests: hello world playground run with success and failure
 tests

---
 tests/src/playground.test.ts | 58 ++++++++++++++++++++++++++++++++++++
 1 file changed, 58 insertions(+)
 create mode 100644 tests/src/playground.test.ts

diff --git a/tests/src/playground.test.ts b/tests/src/playground.test.ts
new file mode 100644
index 000000000000..3fc81a0c14b8
--- /dev/null
+++ b/tests/src/playground.test.ts
@@ -0,0 +1,58 @@
+import { describe, it } from "mocha";
+import { $, expect, browser } from "@wdio/globals";
+
+describe("Playground", () => {
+  it("executes the hello world code and prints the hello message", async () => {
+    await browser.url("/types-and-values/hello-world.html");
+    const playground_area$ = $(".ace_content");
+    const playground_start_button$ = $("button.play-button");
+    const playground_stderr$ = $("code.result.stderr");
+    const playground_stdout$ = $("code.result.stdout");
+
+    // ensure a playground exists and pre-state is as expected
+    await expect(playground_area$).toExist();
+    await expect(playground_start_button$).toExist();
+    await expect(playground_start_button$).not.toBeDisplayed();
+    await expect(playground_stderr$).not.toExist();
+    await expect(playground_stdout$).not.toExist();
+
+    // clicking into the content is necessary for the button to be displayed
+    await playground_area$.click();
+    await expect(playground_start_button$).toBeDisplayed();
+
+    // clicking the button triggers action
+    await playground_start_button$.click();
+    await expect(playground_stdout$).toBeDisplayed();
+    await expect(playground_stderr$).not.toBeDisplayed();
+    await expect(playground_stdout$).toHaveText("Hello 🌍!");
+  });
+
+  it("shows error messages in stderr if the code is broken", async () => {
+    await browser.url("/types-and-values/hello-world.html");
+    const playground_area$ = $(".ace_content");
+    const playground_start_button$ = $("button.play-button");
+    const playground_stderr$ = $("code.result.stderr");
+    const playground_stdout$ = $("code.result.stdout");
+
+    // overwrite the playground code with expected broken code
+    await browser.execute(() => {
+      window.ace
+        .edit(document.querySelector("code"))
+        .setValue("fn expect_failure()");
+    });
+
+    // clicking into the content is necessary for the button to be displayed
+    await playground_area$.click();
+
+    // clicking the button triggers action
+    await playground_start_button$.click();
+    await expect(playground_stdout$).toBeDisplayed();
+    await expect(playground_stderr$).toBeDisplayed();
+
+    // check for error message in stderr
+    await expect(playground_stderr$).toHaveText(
+      expect.stringContaining("error: could not compile")
+    );
+    await expect(playground_stdout$).toHaveText("No output");
+  });
+});