ruby-on-rails - RSpec と Capybara で画像とファビコンの存在を確認する

Question

rspecとカピバラを使用して画像とファビコンの存在を確認する良い方法はありますか?

ファビコンと画像の DOM を確認できますが、それらの画像が読み込まれることも確認できるようにしたいと考えています。これはrspecとカピバラで可能ですか?

Answer 1

# frozen_string_literal: true

module Capybara
  module CustomMatchers
    include Capybara::DSL

    class Asset
      def asset_exists?(actual, src)
        js_script = <<JSS
xhr = new XMLHttpRequest();
xhr.open('GET', '#{src}', true);
xhr.send();
JSS
        actual.execute_script(js_script)
        status = actual.evaluate_script('xhr.status') # get js variable value
        status == 200 || status == 302
      end
    end

    class LoadImage < Asset
      def initialize(*args)
        @args = args
        @src = args.first
      end

      def matches?(actual)
        is_present = actual.has_selector?("img[src='#{@src}']")
        is_present && asset_exists?(actual, @src)
      end

      def does_not_match?(actual)
        actual.has_no_selector?("img[src='#{@src}']")
      end

      def failure_message
        "No image loaded with source: '#{@src}'"
      end

      def failure_message_when_negated
        "Image loaded with source: '#{@src}'"
      end

      def description
        "Verify if image with source: '#{@src}' is loaded"
      end
    end

    class LoadFavicon < Asset
      def initialize(*args)
        @args = args
        @rel = args.first
        @href = args.second
      end

      def matches?(actual)
        is_present = actual.has_selector?("link[rel='#{@rel}'][href='#{@href}']", visible: false)
        is_present && asset_exists?(actual, @href)
      end

      def does_not_match?(actual)
        actual.has_no_selector?("link[rel='#{@rel}'][href='#{@href}']", visible: false)
      end

      def failure_message
        "No favicon loaded with rel: '#{@rel}' and href: '#{@href}'"
      end

      def failure_message_when_negated
        "Favicon loaded with rel: '#{@rel}' and href: '#{@href}'"
      end

      def description
        "Verify if favicon with rel: '#{@rel}' and href: '#{@href}' is loaded"
      end
    end

    def load_image(*args)
      LoadImage.new(*args)
    end

    def load_favicon(*args)
      LoadFavicon.new(*args)
    end
  end
end

RSpec.configure do |config|
  config.include Capybara::CustomMatchers
end

スターを付けてダウンロードするには、https://gist.github.com/yovasx2/1c767114f2e003474a546c89ab4f90dbを確認してください

Answer 2

問題は、実際の img と favicon が存在するかどうかを確認することです。スライダーのすべての画像が存在することを確認するコードを次に示します。

page.all('#carousel img').each do |img|
  visit img[:src]
  page.status_code.should be 200
end

id myimage を使用する個々のイメージの場合

visit page.find('img#myimage')[:src]
page.status_code.should be 200

そしてファビコンの場合、最も簡単なのは次を実行することです

page.all('link[rel~="icon"]', visible: :any).each do |fav|
  visit fav[:href]
  page.status_code.should be 200
end