Merge pull request #322 from pulibrary/311-wallaby

Set up wallaby and add a feature test

.circleci/config.yml

@@ -2,6 +2,9 @@ version: 2.1
 
 description: Common jobs for testing and building phoenix applications
 
+orbs:
+  browser-tools: circleci/[email protected]
+  node: circleci/[email protected]
 executors:
   builder:
     docker:
@@ -83,7 +86,7 @@ commands:
     steps:
       - run:
           name: Run tests
-          command: MIX_ENV=test mix test
+          command: MIX_ENV=test mix test-ci
 
 jobs:
   check-formatting:
@@ -97,6 +100,7 @@ jobs:
   run-unit-tests:
     executor: builder
     steps:
+      - browser-tools/install-chromedriver
       - checkout
       - install-deps:
           include-assets: false
@@ -113,6 +117,9 @@ jobs:
       - store_artifacts:
           path: cover
           destination: cover
+      - store_artifacts:
+          path: screenshots
+          destination: screenshots
 
 workflows:
   version: 2

.gitignore

@@ -37,3 +37,6 @@ npm-debug.log
 figgy-fixture-container/fixture-exports/*.binary
 figgy-fixture-container/fixture-exports/*.sql
 solr/conf/solr_config.zip
+
+# wallaby screenshots
+screenshots/*

README.md

@@ -6,6 +6,13 @@ This project is built in Elixir using Phoenix LiveView as a web framework and Br
 
 ## Project Setup for Development and Test environments
 
+### First time setup
+
+- `brew install asdf`
+- `asdf install`
+- `brew install --cask chromedriver`
+  - required to run feature tests
+
 ### Every time setup
 
 Do these things every time you start new work in this project in dev or test

config/test.exs

@@ -26,12 +26,11 @@ config :dpul_collections, DpulCollections.FiggyRepo,
   show_sensitive_data_on_connection_error: true,
   pool_size: 10
 
-# We don't run a server during test. If one is required,
-# you can enable the server option below.
+# Wallaby feature tests require the server to be running
 config :dpul_collections, DpulCollectionsWeb.Endpoint,
   http: [ip: {127, 0, 0, 1}, port: 4002],
   secret_key_base: "fS76i6oeLWDlMP7AEe+nExNz3J4tHyaIZrELNhSmY3LUocagaphwGc8Ff7rAh6qS",
-  server: false
+  server: true
 
 # In test we don't send emails.
 config :dpul_collections, DpulCollections.Mailer, adapter: Swoosh.Adapters.Test
@@ -72,3 +71,11 @@ config :dpul_collections, :start_indexing_pipeline?, fn -> false end
 config :dpul_collections, :figgy_hydrator, poll_interval: 50
 
 config :dpul_collections, :web_connections, figgy_url: "https://figgy.example.com"
+
+config :wallaby,
+  otp_app: :dpul_collections,
+  screenshot_on_failure: true,
+  chromedriver: [
+    # change to false if you want to see the browser in action
+    headless: true
+  ]

mix.exs

@@ -73,7 +73,8 @@ defmodule DpulCollections.MixProject do
       {:broadway, "~> 1.0"},
       {:ex_doc, "~> 0.21", only: :dev, runtime: false},
       {:req, "~> 0.5.0"},
-      {:broadway_dashboard, "~> 0.4.0"}
+      {:broadway_dashboard, "~> 0.4.0"},
+      {:wallaby, "~> 0.30", runtime: false, only: :test}
     ]
   end
 
@@ -88,7 +89,17 @@ defmodule DpulCollections.MixProject do
       setup: ["deps.get", "ecto.setup", "assets.setup", "assets.build"],
       "ecto.setup": ["ecto.create", "ecto.migrate", "run priv/repo/seeds.exs"],
       "ecto.reset": ["ecto.drop", "ecto.setup"],
-      test: ["ecto.create --quiet", "ecto.migrate --quiet", "coveralls.html"],
+      test: [
+        "ecto.create --quiet",
+        "ecto.migrate --quiet",
+        "coveralls.html"
+      ],
+      "test-ci": [
+        "esbuild dpul_collections",
+        "ecto.create --quiet",
+        "ecto.migrate --quiet",
+        "coveralls.html"
+      ],
       "assets.setup": ["tailwind.install --if-missing", "esbuild.install --if-missing"],
       "assets.build": ["tailwind dpul_collections", "esbuild dpul_collections"],
       "assets.deploy": [

test/dpul_collections_web/features/locale_test.exs

@@ -0,0 +1,17 @@
+defmodule DpulCollectionsWeb.Features.LocaleTest do
+  use ExUnit.Case, async: true
+  use Wallaby.Feature
+
+  import Wallaby.Query
+
+  feature "locale persists between pages", %{session: session} do
+    session
+    |> visit("/")
+    |> assert_has(css("h3", text: "Explore Our Digital Collections"))
+    |> click(button("Language"))
+    |> click(link("Español"))
+    |> assert_has(css("h3", text: "Explora nuestras colecciones"))
+    |> click(button("Buscar"))
+    |> assert_has(css("div#filters", text: "Relevancia"))
+  end
+end

test/test_helper.exs

@@ -1,2 +1,5 @@
 ExUnit.start()
 Ecto.Adapters.SQL.Sandbox.mode(DpulCollections.Repo, :manual)
+
+{:ok, _} = Application.ensure_all_started(:wallaby)
+Application.put_env(:wallaby, :base_url, DpulCollectionsWeb.Endpoint.url())