Add Playwright driver (no deps)

.github/workflows/ci.yml

@@ -2,9 +2,9 @@ name: CI
 
 on:
   push:
-    branches: [ "main" ]
+    branches: ["main"]
   pull_request:
-    branches: [ "main" ]
+    branches: ["main"]
 
 env:
   MIX_ENV: test
@@ -14,60 +14,85 @@ permissions:
 
 jobs:
   test:
+    services:
+      postgres:
+        image: postgres
+        env:
+          POSTGRES_USER: postgres
+          POSTGRES_PASSWORD: postgres
+          POSTGRES_DB: phoenix_test_test
+        ports: ["5432:5432"]
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
     runs-on: ubuntu-latest
     name: Test on OTP ${{matrix.otp}} / Elixir ${{matrix.elixir}}
     strategy:
       matrix:
-        otp: ['26.1.2']
-        elixir: ['1.15.0', '1.16.0', '1.17.0']
+        otp: ["26.1.2"]
+        elixir: ["1.15.0", "1.16.0", "1.17.0", "main"]
     steps:
-    - name: Set up Elixir
-      uses: erlef/setup-beam@v1
-      with:
-        otp-version: ${{matrix.otp}}
-        elixir-version: ${{matrix.elixir}}
-
-    - name: Checkout code
-      uses: actions/checkout@v3
-
-    - name: Cache deps
-      id: cache-deps
-      uses: actions/cache@v3
-      env:
-        cache-name: cache-elixir-deps
-      with:
-        path: deps
-        key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
-        restore-keys: |
-          ${{ runner.os }}-mix-${{ env.cache-name }}-
-
-    - name: Cache compiled build
-      id: cache-build
-      uses: actions/cache@v3
-      env:
-        cache-name: cache-compiled-build
-      with:
-        path: _build
-        key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
-        restore-keys: |
-          ${{ runner.os }}-mix-${{ env.cache-name }}-
-          ${{ runner.os }}-mix-
-
-    - name: Bust cache on job rerun to rule out incremental build as a source of flakiness
-      if: github.run_attempt != '1'
-      run: |
-        mix deps.clean --all
-        mix clean
-      shell: sh
-
-    - name: Install dependencies
-      run: mix deps.get
-
-    - name: Compiles without warnings
-      run: mix compile --warnings-as-errors
-
-    - name: Check Formatting
-      run: mix format --check-formatted
-
-    - name: Run tests
-      run: mix test
+      - name: Set up Elixir
+        uses: erlef/setup-beam@v1
+        with:
+          otp-version: ${{matrix.otp}}
+          elixir-version: ${{matrix.elixir}}
+
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Cache deps
+        id: cache-deps
+        uses: actions/cache@v3
+        env:
+          cache-name: cache-elixir-deps
+        with:
+          path: deps
+          key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-mix-${{ env.cache-name }}-
+
+      - name: Cache compiled build
+        id: cache-build
+        uses: actions/cache@v3
+        env:
+          cache-name: cache-compiled-build
+        with:
+          path: _build
+          key: ${{ runner.os }}-mix-${{ env.cache-name }}-${{ hashFiles('**/mix.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-mix-${{ env.cache-name }}-
+            ${{ runner.os }}-mix-
+
+      - name: Bust cache on job rerun to rule out incremental build as a source of flakiness
+        if: github.run_attempt != '1'
+        run: |
+          mix deps.clean --all
+          mix clean
+        shell: sh
+
+      - name: Install dependencies
+        run: mix deps.get
+
+      - name: Install JS dependencies
+        run: npm ci --prefix priv/static/assets
+
+      - name: Compiles without warnings
+        run: mix compile --warnings-as-errors
+
+      - name: Check Formatting
+        run: mix format --check-formatted
+
+      - name: Build assets for browser tests
+        run: mix do assets.setup, assets.build
+
+      - name: Setup database
+        run: mix ecto.setup
+
+      - name: Install playwright browsers
+        run: npm exec --prefix priv/static/assets playwright install --with-deps --only-shell
+
+      - name: Run tests
+        run: "mix test || if [[ $? = 2 ]]; then mix test --failed; else false; fi"

.gitignore

@@ -27,3 +27,9 @@ phoenix_test-*.tar
 
 # Ignore assets that are produced by build tools.
 /priv/static/assets/
+
+!/priv/static/assets/app.css
+!/priv/static/assets/package.json
+!/priv/static/assets/package-lock.json
+
+.envrc

.tool-versions

@@ -1,2 +1,2 @@
 erlang 27.0
-elixir 1.17.2-otp-27
+elixir main

config/test.exs

@@ -1,6 +1,14 @@
 import Config
 
-config :phoenix_test, :endpoint, PhoenixTest.Endpoint
+config :phoenix_test,
+  endpoint: PhoenixTest.Endpoint,
+  ecto_repos: [PhoenixTest.Repo],
+  otp_app: :phoenix_test,
+  playwright: [
+    browser: [browser: :chromium, headless: System.get_env("PLAYWRIGHT_HEADLESS", "t") in ~w(t true)],
+    cli: "priv/static/assets/node_modules/playwright/cli.js",
+    trace: System.get_env("PLAYWRIGHT_TRACE", "false") in ~w(t true)
+  ]
 
 config :logger, level: :warning
 
@@ -20,3 +28,11 @@ config :esbuild,
     cd: Path.expand("../test/assets", __DIR__),
     env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)}
   ]
+
+config :phoenix_test, PhoenixTest.Repo,
+  username: "postgres",
+  password: "postgres",
+  hostname: "localhost",
+  database: "phoenix_test_test#{System.get_env("MIX_TEST_PARTITION")}",
+  pool: Ecto.Adapters.SQL.Sandbox,
+  pool_size: 10

lib/phoenix_test.ex

@@ -213,7 +213,7 @@ defmodule PhoenixTest do
   LiveView or a static view. You don't need to worry about which type of page
   you're visiting.
   """
-  def visit(conn, path) do
+  def visit(%Plug.Conn{} = conn, path) do
     case get(conn, path) do
       %{assigns: %{live_module: _}} = conn ->
         PhoenixTest.Live.build(conn)
@@ -230,6 +230,10 @@ defmodule PhoenixTest do
     end
   end
 
+  def visit(driver, path) when is_struct(driver) do
+    Driver.visit(driver, path)
+  end
+
   defp all_headers(conn) do
     Enum.map(conn.req_headers, &elem(&1, 0))
   end

lib/phoenix_test/case.ex

@@ -0,0 +1,120 @@
+defmodule PhoenixTest.Case do
+  @moduledoc """
+  ExUnit case module to assist with browser based tests.
+  See `PhoenixTest.Playwright` for more information.
+  """
+
+  use ExUnit.CaseTemplate
+
+  alias PhoenixTest.Case
+
+  using opts do
+    quote do
+      import PhoenixTest
+
+      setup do
+        [phoenix_test: unquote(opts)]
+      end
+    end
+  end
+
+  @playwright_opts [
+    browser: :chromium,
+    headless: true,
+    slowMo: 0
+  ]
+
+  setup_all context do
+    trace = Application.fetch_env!(:phoenix_test, :playwright)[:trace]
+
+    case context do
+      %{playwright: true} ->
+        [browser_id: Case.Playwright.launch_browser(@playwright_opts), trace: trace]
+
+      %{playwright: opts} when is_list(opts) ->
+        opts = Keyword.merge(@playwright_opts, opts)
+        [browser_id: Case.Playwright.launch_browser(opts), trace: trace]
+
+      _ ->
+        :ok
+    end
+  end
+
+  setup context do
+    case context do
+      %{playwright: p} when p != false ->
+        [conn: Case.Playwright.new_session(context)]
+
+      _ ->
+        [conn: Phoenix.ConnTest.build_conn()]
+    end
+  end
+
+  defmodule Playwright do
+    @moduledoc false
+    import PhoenixTest.Playwright.Connection
+
+    alias PhoenixTest.Playwright.Browser
+    alias PhoenixTest.Playwright.BrowserContext
+
+    @includes_ecto Code.ensure_loaded?(Ecto.Adapters.SQL.Sandbox) &&
+                     Code.ensure_loaded?(Phoenix.Ecto.SQL.Sandbox)
+
+    def launch_browser(opts) do
+      ensure_started()
+      browser = Keyword.fetch!(opts, :browser)
+      browser_id = launch_browser(browser, opts)
+      on_exit(fn -> post(guid: browser_id, method: "close") end)
+      browser_id
+    end
+
+    def new_session(%{browser_id: browser_id} = context) do
+      context_id = Browser.new_context(browser_id)
+      subscribe(context_id)
+
+      page_id = BrowserContext.new_page(context_id)
+      post(%{method: :updateSubscription, guid: page_id, params: %{event: "console", enabled: true}})
+      frame_id = initializer(page_id).mainFrame.guid
+      on_exit(fn -> post(guid: context_id, method: "close") end)
+
+      if context[:trace] do
+        BrowserContext.start_tracing(context_id)
+
+        dir = :phoenix_test |> Application.fetch_env!(:playwright) |> Keyword.fetch!(:trace_dir)
+        File.mkdir_p!(dir)
+
+        "Elixir." <> case = to_string(context.case)
+        session_id = System.unique_integer([:positive, :monotonic])
+        file = String.replace("#{case}.#{context.test}_#{session_id}.zip", ~r/[^a-zA-Z0-9 \.]/, "_")
+        path = Path.join(dir, file)
+
+        on_exit(fn -> BrowserContext.stop_tracing(context_id, path) end)
+      end
+
+      PhoenixTest.Playwright.build(page_id, frame_id)
+    end
+
+    if @includes_ecto do
+      def checkout_ecto_repos(async?) do
+        otp_app = Application.fetch_env!(:phoenix_test, :otp_app)
+        repos = Application.fetch_env!(otp_app, :ecto_repos)
+
+        repos
+        |> Enum.map(&checkout_ecto_repo(&1, async?))
+        |> Phoenix.Ecto.SQL.Sandbox.metadata_for(self())
+        |> Phoenix.Ecto.SQL.Sandbox.encode_metadata()
+      end
+
+      defp checkout_ecto_repo(repo, async?) do
+        :ok = Ecto.Adapters.SQL.Sandbox.checkout(repo)
+        unless async?, do: Ecto.Adapters.SQL.Sandbox.mode(repo, {:shared, self()})
+
+        repo
+      end
+    else
+      def checkout_ecto_repos(_) do
+        nil
+      end
+    end
+  end
+end

lib/phoenix_test/driver.ex

@@ -1,5 +1,6 @@
 defprotocol PhoenixTest.Driver do
   @moduledoc false
+  def visit(session, path)
   def render_page_title(session)
   def render_html(session)
   def click_link(session, selector, text)

lib/phoenix_test/live.ex

@@ -367,6 +367,8 @@ defimpl PhoenixTest.Driver, for: PhoenixTest.Live do
   alias PhoenixTest.Assertions
   alias PhoenixTest.Live
 
+  def visit(_, _), do: raise(ArgumentError, message: "Unexpected: Call visit/1 with a %Plug.Conn{}.")
+
   defdelegate render_page_title(session), to: Live
   defdelegate render_html(session), to: Live
   defdelegate click_link(session, selector, text), to: Live