Question

我正在努力进行测试，以便在页面中动态添加元素。添加是通过使用cocoon gem的javascript完成的。这是页面的图片。设置“标题”，“ bijbelstudie”和“ perikoop 1”都可以正常工作。也可以通过使用站点棱镜单击“添加新的pericope”按钮来添加更多的pericopes。元素分组为pericopes div。每个单独的元素都可以通过form-group类来识别。

我的第一个问题是：我应该使用“ 元素”还是“ 部分”创建页面对象？从文档中我无法确定哪种方法是此处的首选方法。我的第二个问题，我无法使其正常工作。我从来没有得到带有部分或元素的透视图。

请查看包含2个元素的页面的HTML代码，以了解该代码。

<div id='pericopes'>
    <div class='nested-fields'>
        <div class='input-group'>
            <div class="form-group string required studynote_pericopes_name"><label
                    class="control-label string required" for="studynote_pericopes_attributes_0_name"><abbr
                    title="required">*</abbr> perikoop 1</label>
                <div>
                    <div class="input-group col-sm-12"><input class="form-control string required"
                                                              autofocus="autofocus"
                                                              placeholder="Genesis 1:1-3:21" type="text"
                                                              name="studynote[pericopes_attributes][0][name]"
                                                              id="studynote_pericopes_attributes_0_name"/>
                    </div>
                </div>
            </div>
            <span class='input-group-btn'>
<input type="hidden" name="studynote[pericopes_attributes][0][_destroy]" id="studynote_pericopes_attributes_0__destroy"
value="false"/><a class="delete remove_fields dynamic" style="margin-bottom:-9px" id="delete_pericope"
             href="#"></a>
</span>
        </div>
    </div>

我的页面对象看起来像这样。

class PericopeSection < SitePrism::Section
  element :pericope_field, '.nested-fields'
  element :add_pericope_button, '#add_pericope'
end

class NewStudynotesPage < SitePrism::Page
  set_url '/studynotes/new'

  sections :pericopes, PericopeSection, 'div#pericopes'

  element :title_field, '#studynote_title'
  element :studynote_field, 'trix-editor'
  element :submit_button, '#submit_form'
end

Answer 1

我自己修复了。我摆脱了section，并用elements解决了这个问题。

class NewStudynotesPage < SitePrism::Page
  set_url '/studynotes/new'

  elements :pericopes, '.form-control'
  element :add_pericope_button, '#add_pericope'

  element :title_field, '#studynote_title'
  element :studynote_field, 'trix-editor'
  element :submit_button, '#submit_form'
end

rspec现在看起来如下：

require 'rails_helper'

feature 'Users can add multiple pericopes to a studynote', focus: true do
  let(:user) { create(:user) }

  scenario 'to multiple pericopes with valid attributes', js: true do

    create(:biblebook, name: 'Jona')
    login_as(user)

    nsp = NewStudynotesPage.new
    nsp.load
    nsp.title_field.set('Titel')
    nsp.studynote_field.set('Jona is bijzonder.')
    nsp.add_pericope_button.click
    nsp.pericopes[0].set('Jona 1:1 - 1:10')
    nsp.add_pericope_button.click

    nsp.pericopes[1].set('Jona 2:20 - 3:3')
    nsp.submit_button.click

    expect(StudynoteShowPage.new.pericope_field.text).to eq('Jona 1:1 - 10 | Jona 2:20 - 3:3')
  end
end

对动态加载的字段使用site_prism

1 个答案: