Test js behat

.circleci/config.yml

@@ -99,8 +99,10 @@ jobs:
       - run:
           name: Run Behat tests
           command: |
-              nohup php -S ${CIRCLE_PROJECT_REPONAME}.local:8000 -t $(pwd)/web/ > /tmp/artifacts/phpd.log 2>&1 &
-              vendor/bin/behat --profile=circleci --suite=default --strict --format=junit --out=/tmp/artifacts
+            nohup php -S ${CIRCLE_PROJECT_REPONAME}.local:8000 -t $(pwd)/web/ > /tmp/artifacts/phpd.log 2>&1 &
+            google-chrome --version
+            google-chrome --headless --remote-debugging-port=9222 &>/dev/null &
+            vendor/bin/behat --profile=circleci --suite=default --strict --format=junit --out=/tmp/artifacts
       - store_artifacts:
           path: /tmp/artifacts
       - store_test_results:

.ddev/docker-compose.chrome.yaml

@@ -0,0 +1,21 @@
+# This was taken from https://github.com/drud/ddev-contrib/tree/master/docker-compose-services/headless-chrome.
+version: '3.6'
+services:
+    chrome:
+        image:  isholgueras/chrome-headless:latest
+        restart: unless-stopped
+        container_name: ddev-${DDEV_SITENAME}-chrome
+        labels:
+            com.ddev.site-name: ${DDEV_SITENAME}
+            com.ddev.approot: $DDEV_APPROOT
+        volumes:
+            - ddev-global-cache:/mnt/ddev-global-cache
+            - ".:/mnt/ddev_config"
+        external_links:
+            - "ddev-router:${DDEV_HOSTNAME}"
+        cap_add:
+            - SYS_ADMIN
+        ports:
+        # Exposing this port allows you to visit 127.0.0.1:9222 to see what Headless Chrome doing without
+        # any additional configuration; However, you can only have one project using this port at a time.
+            - '9222:9222'

composer.json

@@ -27,10 +27,12 @@
         "drush/drush": "^11"
     },
     "require-dev": {
+        "behat/behat": "^3.12",
         "behat/mink-goutte-driver": "^2.0",
+        "dmore/behat-chrome-extension": "^1.4",
         "drupal/core-dev": "^10",
         "drupal/drupal-extension": "^5@alpha",
-        "palantirnet/the-build": "^4@beta"
+        "palantirnet/the-build": "dev-headless-chrome"
     },
     "suggest": {
         "cweagans/composer-patches": "Try ^1.7. Apply patches to packages, especially Drupal.org contrib.",

features/js_behat_test.feature

@@ -0,0 +1,12 @@
+@api @javascript
+Feature: Installation
+  As a Drupal developer
+  I want to use javaScript in Behat tests
+  So that I can rely on the build for my project.
+
+  Scenario: Verify that js behat test works.
+    Given I am logged in as a user with the "administrator" role
+    When I am on "/admin/modules/update"
+    And I should see the link "Check manually"
+    And I click "Check manually"
+    Then I should see the text "Status message"