playwright導入テスト

Author: Yuppymam

.github/workflows/test.yml

@@ -40,13 +40,34 @@ jobs:
         with:
           bundler-cache: true
 
+      - name: 📦 Setup Playwright
+        run: |
+          # Setup Playwright driver
+          APP_ROOT=${GITHUB_WORKSPACE}
+          PLAYWRIGHT_VERSION=$(bundle exec ruby -e 'require "playwright"; puts Playwright::COMPATIBLE_PLAYWRIGHT_VERSION.strip')
+          DRIVER_URL="https://playwright.azureedge.net/builds/driver/playwright-$PLAYWRIGHT_VERSION-linux.zip"
+          DRIVER_DIR="$APP_ROOT/playwright-drivers"
+          mkdir -p "$DRIVER_DIR"
+          cd "$DRIVER_DIR"
+          wget -q "$DRIVER_URL" -O playwright.zip
+          unzip -o playwright.zip
+          rm playwright.zip
+
+          # Install Playwright globally
+          npm install -g playwright
+
+          # Install Playwright Chromium browser with dependencies
+          playwright install --with-deps chromium
+
       - name: 🧪 Prepare DB
         run: |
           bundle exec rails db:create
           bundle exec rails db:setup
 
       - name: 🔧 Test
         run: bundle exec rspec spec
+        env:
+          PLAYWRIGHT_DRIVER_PATH: ${{ github.workspace }}/playwright-drivers/package/cli.js
 
   deploy:
     needs: test

.gitignore

@@ -36,3 +36,4 @@ public/assets/*
 
 # rspec
 spec/examples.txt
+playwright-drivers

Gemfile

@@ -87,6 +87,7 @@ group :development, :test do
   gem 'factory_bot_rails'
   gem 'rspec-rails', '~> 4.0'
   gem 'selenium-webdriver'
+  gem 'capybara-playwright-driver'
 
   gem 'dotenv-rails'
 end

Gemfile.lock

@@ -119,6 +119,10 @@ GEM
       rack-test (>= 0.6.3)
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
+    capybara-playwright-driver (0.5.4)
+      addressable
+      capybara
+      playwright-ruby-client (>= 1.16.0)
     childprocess (5.1.0)
       logger (~> 1.5)
     coderay (1.1.3)
@@ -272,6 +276,10 @@ GEM
     memoist (0.16.2)
     memory_profiler (1.1.0)
     method_source (1.1.0)
+    mime-types (3.6.0)
+      logger
+      mime-types-data (~> 3.2015)
+    mime-types-data (3.2024.1203)
     mini_mime (1.1.5)
     mini_portile2 (2.8.8)
     mini_racer (0.16.0)
@@ -303,6 +311,9 @@ GEM
       ast (~> 2.4.1)
       racc
     pg (1.5.8)
+    playwright-ruby-client (1.49.0)
+      concurrent-ruby (>= 1.1.6)
+      mime-types (>= 3.0)
     pry (0.14.2)
       coderay (~> 1.1)
       method_source (~> 1.0)
@@ -420,7 +431,7 @@ GEM
     ruby-mp3info (0.8.10)
     ruby-progressbar (1.13.0)
     ruby2_keywords (0.0.5)
-    rubyzip (2.3.2)
+    rubyzip (2.4.1)
     sass-rails (6.0.0)
       sassc-rails (~> 2.1, >= 2.1.1)
     sassc (2.4.0)
@@ -432,7 +443,7 @@ GEM
       sprockets-rails
       tilt
     secure_headers (6.7.0)
-    selenium-webdriver (4.24.0)
+    selenium-webdriver (4.27.0)
       base64 (~> 0.2)
       logger (~> 1.4)
       rexml (~> 3.2, >= 3.2.5)
@@ -506,6 +517,7 @@ DEPENDENCIES
   bootsnap
   bootstrap-sass
   capybara
+  capybara-playwright-driver
   coffee-rails
   dotenv-rails
   factory_bot_rails

bin/setup

@@ -34,6 +34,9 @@ FileUtils.chdir APP_ROOT do
   system! 'gem install bundler --conservative'
   system('bundle check') || system!('bundle install')
 
+  puts "\n== Setting up Playwright driver =="
+  system! 'bin/setup_playwright'
+
   # puts "\n== Copying sample files =="
   # unless File.exist?('config/database.yml')
   #   FileUtils.cp 'config/database.yml.sample', 'config/database.yml"

bin/setup_playwright

@@ -0,0 +1,20 @@
+#!/bin/bash
+set -e
+
+APP_ROOT=$(dirname "$(dirname "$(readlink -f "$0")")")
+PLAYWRIGHT_VERSION=$(bundle exec ruby -e 'require "playwright"; puts Playwright::COMPATIBLE_PLAYWRIGHT_VERSION.strip')
+DRIVER_URL="https://playwright.azureedge.net/builds/driver/playwright-$PLAYWRIGHT_VERSION-linux.zip"
+DRIVER_DIR="$APP_ROOT/playwright-drivers"
+
+echo "== Setting up Playwright driver =="
+
+mkdir -p "$DRIVER_DIR"
+
+cd "$DRIVER_DIR"
+echo "Downloading Playwright driver from $DRIVER_URL..."
+wget -q "$DRIVER_URL" -O playwright.zip
+echo "Extracting Playwright driver..."
+unzip -o playwright.zip
+rm playwright.zip
+
+echo "Playwright driver setup completed. Driver is available in $DRIVER_DIR."

spec/features/docs_spec.rb

@@ -4,23 +4,22 @@
   describe "GET documents" do
     scenario "Document index should be exist" do
       visit docs_path
-      expect(page).to have_http_status(:success)
-
-      # NOTE: 毎回 -3 などの offset を調整するのが面倒なのでテストを止めています
-      # expect(page).to have_css 'section.doc a[href]', count: (Document.all.count - 3)
+      expect(page).to have_selector('h2', text: 'CoderDojo 資料集')
+      expect(page).to have_css('section.docs a[href]', minimum: 1)
     end
 
     scenario "Charter should be exist" do
-      visit doc_path('charter')
-      expect(page).to have_http_status(:success)
+      visit docs_path
+      within('section.docs') do
+        expect(page).to have_link 'CoderDojo 憲章', href: "/docs/charter"
+        click_link 'CoderDojo 憲章'
+      end
+      expect(page).to have_selector('h1', text: 'CoderDojo 憲章')
     end
 
     scenario "Load doc file with absolute path" do
-      visit "#{docs_path}/"
-      expect(page).to have_http_status(:success)
-      expect(page).to have_link 'コントリビューター行動規範', href: "/docs/code-of-conduct"
-      click_link 'コントリビューター行動規範'
-      expect(page).to have_http_status(:success)
+      visit "/docs/code-of-conduct"
+      expect(page).to have_selector('h1', text: 'コントリビューター行動規範')
     end
   end
 end

spec/features/header_spec.rb

@@ -7,16 +7,17 @@
 
   describe "リンクをクリックする" do
     scenario "統計情報に飛ぶ" do
-      all(:link_or_button, '統計情報').first.click
-      expect(page).to have_selector 'h1', text:'統計情報'
+      find(:link_or_button, '資料を探す').hover
+      click_link '統計情報'
+      expect(page).to have_selector 'h1', text: '統計情報'
     end
     scenario "近日開催の道場に飛ぶ" do
       click_link '近日開催の道場'
-      expect(page).to have_selector 'h1', text:'📅 近日開催'
+      expect(page).to have_selector 'h1', text: '近日開催の道場'
     end
     scenario "Kataに飛ぶ" do
       all(:link_or_button, 'Kata').first.click
-      expect(page).to have_selector 'h1', text:'📚 Kata'
+      expect(page).to have_selector 'h1', text: /Kata/
     end
   end
 end

spec/features/podcasts_spec.rb

@@ -4,7 +4,7 @@
   describe 'GET documents' do
     scenario 'Podcast index should be exist' do
       visit '/podcasts'
-      expect(page).to have_http_status(:success)
+      expect(page).to have_selector('h1', text: 'DojoCast')
     end
 
     scenario 'Charter should be exist' do
@@ -16,10 +16,10 @@
 
       visit "/podcasts/#{@podcast.id}"
       target = '← Top'
-      expect(page).to have_http_status(:success)
+      expect(page).to have_selector('.episode h1#title')
       expect(page).to have_link target, href: '/podcasts'
       click_link target, match: :first
-      expect(page).to have_http_status(:success)
+      expect(page).to have_selector('h1', text: 'DojoCast')
     end
 
     scenario 'Load doc file with absolute path' do
@@ -30,10 +30,10 @@
 
       visit  "/podcasts/#{@podcast.id}"
       target = 'DojoCast'
-      expect(page).to have_http_status(:success)
+      expect(page).to have_selector('.episode h1#title')
       expect(page).to have_link target, href: '/podcasts'
       click_link target, match: :first
-      expect(page).to have_http_status(:success)
+      expect(page).to have_selector('h1', text: 'DojoCast')
     end
   end
 end

spec/rails_helper.rb

@@ -55,4 +55,32 @@
   # arbitrary gems may also be filtered via:
   # config.filter_gems_from_backtrace("gem name")
   config.include FactoryBot::Syntax::Methods
+
+  # Default driver is rack_test
+  Capybara.default_driver = :rack_test
+
+  # Register Selenium WebDriver driver
+  # Capybara.register_driver :selenium do |app|
+  #   Capybara::Selenium::Driver.new(
+  #     app,
+  #     browser: :chrome,
+  #     options: Selenium::WebDriver::Chrome::Options.new(args: %w[headless disable-gpu no-sandbox])
+  #   )
+  # end
+
+  # Register Playwright driver
+  Capybara.register_driver :playwright do |app|
+    cli_path = ENV['PLAYWRIGHT_DRIVER_PATH'] || File.expand_path('playwright-drivers/package/cli.js', Rails.root)
+    Capybara::Playwright::Driver.new(
+      app,
+      headless: true,
+      browser_type: :chromium,
+      playwright_cli_executable_path: cli_path
+    )
+  end
+
+  # Use Selenium driver for feature specs
+  config.before(:each, type: :feature) do
+    Capybara.current_driver = :playwright
+  end
 end