Question

我想使用capybara-webkit测试简单的删除jquery / ajax。

用户点击<li>内的删除按钮后该元素应该消失。

我的HTML看起来像这样：

<div class="artist-songs">
    <h3 tabindex="-1" id="song_h" class="song_h">Songs:</h3>
    <ol id="song-list">
        <li class="song">
            <span>The Plug</span>
            <span>
                -
                2000
                -
            </span>
            <span>Downtempo</span>
            <button name="button" type="submit" data-artist-id="5" data-song-id="14" class="delete del_song">Delete</button>
        </li>

我决定用这样的测试生成模型：

feature 'Testing song methods', js: true do
  let(:test_artist) { create :artist, name: 'Band' }

  let!(:song1) { create :song, title: 'Song 1', year: 1987, genre: 'Hip Hop', artist: test_artist }
  let!(:song2) { create :song, title: 'Song 2', artist: test_artist }
  let!(:song3) { create :song, title: 'Song 3', artist: test_artist }
  let!(:song4) { create :song, title: 'Song 4', artist: test_artist }


  scenario 'Delets first song' do
    visit artist_path(test_artist.id)
  end
end

我基本了解如何测试简单的操作，但是我不确定如何编写测试，因此我确信删除了正确的<li>元素而不是随机元素。

因此，例如“Song 1”仅被删除。

Answer 1

要测试删除song1，您可以执行类似

的操作

<div id="game_background" tabindex="-1">
</div>

注意：如果Capybara.default_selector ==：css（这是默认值），则可以省略：css参数

如果您要在测试中处理大量scenario 'Delete song 1' do visit artist_path(test_artist.id) within('#song-list') do find(:css, 'li.song', text: song1.title).click_button('Delete') expect(page).not_to have_css('li.song', text: song1.title) # RSpec # page.assert_no_selector(:css, 'li.song', text: song1.title) # if not using RSpec end元素，您还可以定义自定义选择器，例如

li.song

这意味着你可以做

Capybara.add_selector(:song) do
  xpath { |title| XPath.css('li.song')[XPath.string.n.is(title)] }
end

Capybara Webkit，找到特定的li元素，单击“删除”按钮并检查特定的li元素是否缺失

1 个答案: