Question

我正在尝试使用RSpec功能测试来测试我的rails应用。我使用Quilljs来创建富文本，只是想测试创建帖子的能力。

# erb view
<div id="post-form-container">
  <%= form_for :post, url: posts_path, html: {id: 'post-form'} do |f| %>
    <div class="form-group">
      <%= f.hidden_field :discussion_id, value: discussion.id %>
      <%= f.hidden_field :content, class: 'form-control', id: 'post-content-input' %>
      <div id="editor-container"></div>
    <%= f.button 'Post', class: 'btn btn-primary', id: 'post-button' %>
      </div>
  <% end %>
</div>

# spec
scenario 'can post in discussion', :js do
  login_as user
  visit community_group_path(community_group)
  within('form#post-form') do
    find('div[contenteditable="true"].ql-editor').send_keys 'This is a new post.'
    click_on 'Post'
  end
  expect(page).to have_content 'This is a new post.'
end

This question让我尝试了上述内容，但即使使用:js标记，Quill也不会在运行此方案时创建contenteditable div。

Capybara::ElementNotFound:
   Unable to find css "div[contenteditable]"

更新：我已经意识到我需要允许Quill的外部URL，如下所示，但它仍然无效。

Capybara::Webkit.configure do |config|
  config.allow_url("https://cdn.quilljs.com/*")
end

更新2 ：我的应用程序JS加载了异步，这导致了问题。改变这一点就行了！

<%= javascript_include_tag 'application', 'data-turbolinks-track' => true, async: Rails.env.production? %>

Answer 1

我的问题解决了两件事：

允许外部Quill URL

<%# app/views/layouts/application.html.erb %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true, async: Rails.env.production? %>

在测试期间同步加载应用程序JS

Session {
  cookie: 
   { path: '/',
     _expires: null,
     originalMaxAge: null,
     httpOnly: true },
  user: 
   { _id: 586fa96dc53c951778993d3d,
     username: '123',
     password: '$2a$10$LvasklkF5TeAaAeCrzNoiulPwTcj4jC3Iz3zGaOBWo9N4syXFjJDe',
     userid: 20130610040208,
     class: '13计算机二班',
     __v: 0,
     meta: 
      { updateAt: 2017-01-06T14:27:57.740Z,
        createAt: 2017-01-06T14:27:57.740Z } },
  userid: 20130610040208,
  username: '123' }

Answer 2

仅需注意，使用时无需进行所有这些额外的调整硒驱动程序（Chrome也无头或无头）

用Quilljs和capybara-webkit测试Capybara

2 个答案: