System Testing

Overview

Why Playwright?

It is faster and newer than Selenium and has a clearer syntax than Capybara-DSL, see Discussion.

Attention Playwright can be used with Capybara DSL, which would sound good for existing projects. But, at least in my tests, it was not possible to configure it so that existing specs written in Capybara-DSL could persist. I had to rewrite them.

Playwright within Rails/RSpec

Derived from Docs

Setup

• Remove all Selenium-gems
• add gem capybara within group test
• add gem playwright-ruby-client within group test
• npm i --save-dev playwright (unlike docs do not install it by npx i ... because it would not install dependencies)

a File like playwright_helper

require 'rails_helper'
require 'capybara'
require 'playwright'

RSpec.configure do |config|

  # ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
  # Docs https://playwright-ruby-client.vercel.app/docs/article/guides/rails_integration_with_null_driver
  # ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

  video_dir = '/tmp/rails-system-test-videos'

  config.before :all, type: :system do
    FileUtils.rm_rf(video_dir)
    FileUtils.mkdir(video_dir)
  end

  class CapybaraNullDriver < Capybara::Driver::Base
    def needs_server?
      true
    end
  end

  Capybara.register_driver(:null) { CapybaraNullDriver.new }

  config.around(driver: :null) do |example|
    driven_by :null
    Playwright.create(playwright_cli_executable_path: './node_modules/.bin/playwright') do |playwright|
      playwright.chromium.launch(headless: true) do |browser|
        browser.new_context(
          record_video_dir: video_dir,
          baseURL: Capybara.current_session.server.base_url
        ) do |context|

          # for requests this timeout can be too short, but for most steps it should be good
          # You can increase this in every selector on the test
          context.set_default_timeout(1500.0)

          @page = context.new_page

          # custom login process
          page.goto('/login-page', timeout: 50000) # first load may last longer
          ...

          example.run

        end
        if passed?
          FileUtils.rm(page.video.path)
        else
          puts "file://#{page.video.path}"
        end
      end
    end
  end

end

and a test:

require 'playwright_helper'

RSpec.describe "pw", type: :system, driver: :null do

  let(:page) { @page }

    it 'test' do
      page.goto('/')
    end
end

Overview