Rails system specでのfroala editorを適用したフィールドへの値入力方法（fill in）

system specでfroala editorを適用したフィールドへの値入力方法のメモ

概要

普通に fill_in を使っても値が入らないので、domを指定して set を使って値を設定

特にversionに依存は無いと思うけど念の為以下記載。

• rails 5.2.3
• froala editor 2.9.3
• capybara 2.18.0

froala editorとは

・gem
https://github.com/froala/wysiwyg-rails

コード

spec/support/froala_editor_macros.rb

module FroalaEditorMacros
  def fill_in_froala_editor_field(text)
    find_froala_editor_field.set text
  end

  def find_froala_editor_field
    input_field_locator = ".fr-view"
    is_input_field_visible = false
    find(input_field_locator, visible: is_input_field_visible)
  end
end

spec/rails_helper.rb

# こんな感じでsupport dirが読み込まれている前提
Dir[Rails.root.join('spec', 'support', '**', '*.rb')].each { |f| require f }

~ 省略 ~
RSpec.configure do |config|
  ~ 省略 ~
  config.include FroalaEditorMacros, type: :system
end

spec/system/hogehoge_spec.rb

# 通常のフィールドへの入力
fill_in 'title', with: 'rails system specでのfroala editorを適用したフィールドへの値入力方法（fill in）'
# froala editor適用しているフィールドへの入力
fill_in_froala_editor_field('system specでfroala editorを適用したフィールドへの値入力方法のメモ~')

注意

input_field_locator = ".fr-view" の指定なので1ページに複数froala editorを適用するフィールドがあった場合、この指定だとNGの予感。