Evaluate slide size and block if they grow above a certain treshold (with exemption mechanism) (#2693)

This enables a test for the width and height of slides (excluding some
special cases completely).
The mechanism has an exemption mechanism to temporarily exempt slides
from the rules.
Even exempted slides are checked for the rule violation and once the
slides are compliant they must be removed from the exemption list to
avoid future regression (the check fails in the CI if compliant slides
are exempted!)

This also provides a good opportunity to always have an up-to-date list
of overlong slides in
[slide-exemptions.list.ts](tests/src/slides/slide-exemptions.list.ts)
that can be worked on.

The slide list is always autogenerated in the CI environment. If you want to
enable this for your local dev environment it has to be created manually.
This avoids a time consuming local test if it is not necessary.

On the CLI it can be locally used with `npm run test --
--spec=src/slide-size.test.ts` (after creating the list with
`./src/slides/create-slide.list.sh ../book/html/`).
The CI environment specifies the env var `TEST_BOOK_DIR` that is used to
specifiy the html directory so it can create the list of slides
on-the-fly, check against hardcoded exemptions and evaluate.

This is a new solution for #1464 within the new test framework. This is
related to #2234 and makes the mdbook-slide-evaluator from #2258
obsolete and should be removed as this is a not so powerful nor flexible
framework.

tests/src/slide-size.test.ts

@@ -0,0 +1,53 @@
+import { describe, it } from "mocha";
+import { $, expect, browser } from "@wdio/globals";
+import { slides } from "./slides/slides.list";
+import { exemptions } from "./slides/slide-exemptions.list";
+
+// these are empirically determined values in 16:9 ratio
+const MAX_HEIGHT = 1333;
+const MAX_WIDTH = 750;
+
+describe("Slide", () => {
+  for (const slide of slides) {
+    if (exemptions.includes(slide)) {
+      // This slide is exempted and violated rules before.
+      // It is expected to still do this and if not it should be removed from exemptions.
+      // This acts as a regression check
+      it(
+        " " +
+          slide +
+          " is on the exemption list but should be removed from slide-exemptions.list.ts",
+        async () => {
+          await browser.url("/" + slide);
+          const main_element = $("#content > main");
+          const main_element_size = await main_element.getSize();
+          console.info("slide " + slide + " is on the exemption list");
+          // one of them (height, width) should fail
+          expect(
+            main_element_size.height >= MAX_HEIGHT ||
+              main_element_size.width > MAX_WIDTH,
+          ).toBe(true);
+        },
+      );
+    } else {
+      it(
+        " " +
+          slide +
+          " should not be higher than " +
+          MAX_HEIGHT +
+          " pixels or wider than " +
+          MAX_WIDTH +
+          " pixels",
+        async () => {
+          await browser.url("/" + slide);
+          const main_element = $("#content > main");
+          const main_element_size = await main_element.getSize();
+          expect(
+            main_element_size.height < MAX_HEIGHT &&
+              main_element_size.width <= MAX_WIDTH,
+          ).toBe(true);
+        },
+      );
+    }
+  }
+});

tests/src/slides/create-slide.list.sh

@@ -0,0 +1,47 @@
+#!/bin/bash
+
+# This script (re)creates the slides.list.ts file based on the given book html directory.
+# It is used to regenerate the list of slides that are tested in the slide-size.test.ts file.
+# Takes either TEST_BOOK_DIR environment variable or first parameter as override.
+
+set -e
+BASEDIR="$(dirname "$0")"
+
+if [[ -n "$1" ]]; then
+    # take directory from command line
+    TEST_BOOK_DIR="$1"
+fi
+
+# check if TEST_BOOK_DIR is empty (not set by environment nor parameter)
+if [[ -z "${TEST_BOOK_DIR}" ]]; then
+  echo "Usage: $0 <book_html_dir>"
+  exit 1
+fi
+
+# check if this is the correct root directory by checking if it contains the index.html
+if [[ ! -f "${TEST_BOOK_DIR}/index.html" ]]; then
+  echo "Could not find index.html in ${TEST_BOOK_DIR}. Please check if the correct directory is used (e.g. book/html). You might need to (re)create the directory with mdbook build."
+  exit 1
+fi
+
+pushd "${TEST_BOOK_DIR}"
+# exclude special pages that should never be tested
+SLIDES=$(grep -L "Redirecting to..."  -R --include "*.html" \
+    --exclude "exercise.html" \
+    --exclude "solution.html" \
+    --exclude "toc.html" \
+    --exclude "print.html" \
+    --exclude "404.html" \
+    --exclude "glossary.html" \
+    --exclude "index.html" \
+    --exclude "course-structure.html"
+    )
+popd
+OUTPUT="${BASEDIR}/slides.list.ts"
+
+# create a ts module that can be imported in the tests
+echo "export const slides = [" > ${OUTPUT};
+for SLIDE in ${SLIDES}; do
+echo "  \"${SLIDE}\"," >> ${OUTPUT};
+done;
+echo "];" >> ${OUTPUT};

tests/src/slides/slide-exemptions.list.ts

@@ -0,0 +1,18 @@
+// These slides are known to violate the slide style guide.
+// They are checked if they still violate and if not fail the test.
+// Please remove slides that become good so they don't regress.
+export const exemptions = [
+  "android/interoperability/java.html",
+  "android/testing.html",
+  "bare-metal/aps/entry-point.html",
+  "exercises/bare-metal/compass.html",
+  "exercises/bare-metal/solutions-afternoon.html",
+  "exercises/bare-metal/rtc.html",
+  "exercises/bare-metal/solutions-morning.html",
+  "exercises/chromium/interoperability-with-cpp.html",
+  "exercises/chromium/bringing-it-together.html",
+  "concurrency/async-exercises/chat-app.html",
+  "concurrency/async-exercises/solutions.html",
+  "concurrency/sync-exercises/solutions.html",
+  "concurrency/sync-exercises/link-checker.html",
+];

tests/src/slides/slides.list.ts

@@ -0,0 +1,7 @@
+// to enable local testing for slide size checks please (re)generate this file by executing:
+// $ ./tests/src/slides/create-slide.list.sh book/html
+//
+// This file is on purpose not pre-filled in the repository to avoid
+// a) manual maintenance of slide list
+// b) this takes some time to test
+export const slides = [];