如何编写一个与React表单交互的rspec测试



我首先要说的是,我可能用错了方法,我愿意接受其他测试方法。

我有一个Rails/React应用程序,我正试图添加更多的测试。我之前写过的rspec测试完全包含在后端检查的内容。现在我试着写一个测试,检查创建一个博客文章。当我测试的表单是一个Rails视图时,我曾经这样做过,但是当表单是在React中构建在前端时,我从来没有这样做过。

这是我的gem文件:
source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }
ruby '2.7.2'
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails', branch: 'main'
gem 'rails', '~> 6.1.3'
# Use postgresql as the database for Active Record
gem 'pg', '~> 1.1'
# Use Puma as the app server
gem 'puma', '~> 5.0'
# Use SCSS for stylesheets
gem 'sass-rails', '>= 6'
# Transpile app-like JavaScript. Read more: https://github.com/rails/webpacker
gem 'webpacker', '~> 5.0'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.7'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 4.0'
# Use Active Model has_secure_password
# gem 'bcrypt', '~> 3.1.7'
# Use Active Storage variant
# gem 'image_processing', '~> 1.2'
# Reduces boot times through caching; required in config/boot.rb
gem 'bootsnap', '>= 1.4.4', require: false

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
# CSS style
gem "bulma-rails", "~> 0.8.0"
# jquery
gem 'jquery-rails'
# Setup Devise
gem 'devise'
gem 'active_model_serializers'
# Install pry for debugging
gem 'pry'
# Sendgrid/Contact form
gem 'sendgrid-ruby'
gem 'mail_form'
# Env variable management
gem 'figaro', '~> 1.2'
group :development, :test do
# Call 'byebug' anywhere in the code to stop execution and get a debugger console
gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
gem 'factory_bot_rails', '~> 6.2'
gem 'rspec-rails', '~> 5.0', '>= 5.0.2'
gem 'faker', '~> 2.18'
gem 'launchy'
end
group :development do
# Access an interactive console on exception pages or by calling 'console' anywhere in the code.
gem 'web-console', '>= 4.1.0'
# Display performance information such as SQL time and flame graphs for each request in your browser.
# Can be configured to work on production as well see: https://github.com/MiniProfiler/rack-mini-profiler/blob/master/README.md
gem 'rack-mini-profiler', '~> 2.0'
gem 'listen', '~> 3.3'
# Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
gem 'spring'
end
group :test do
# Adds support for Capybara system testing and selenium driver
gem 'capybara', '~> 3.35', '>= 3.35.3'
gem 'selenium-webdriver'
# Easy installation and use of web drivers to run system tests with browsers
gem 'webdrivers'
end

这是我的测试:

require 'rails_helper'
feature 'user signs in', %Q{
As an admin user
I want to create new posts
when I am signed in
} do
scenario 'admin creates new blog post', js: true do
user = FactoryBot.create(:user_1)
post = FactoryBot.create(:post_1)
visit '/post/new'

# binding.pry
fill_in 'title', with: post.title
fill_in 'body', with: post.body
fill_in 'image', with: post.image
fill_in 'keywords', with: post.keywords
binding.pry
click_button 'Submit'
binding.pry
expect(page).to have_content(post.title)
end
end

我一直在使用binding.prysave_and_open_page来试图弄清楚发生了什么。到达/post/new并正确填写表格。这部分是有效的。但是当它点击Submit时,出现以下错误:

[1] pry(#<RSpec::ExampleGroups::UserSignsInAsAnAdminUserIWantToCreateNewPostsWhenIAmSignedIn>)> 2021-08-20 13:51:45 -0400 Rack app ("GET /" - (127.0.0.1)): #<ActionController::UnknownFormat: HomepagesController#index is missing a template for this request format and variant.
request.formats: ["application/json"]
request.variant: []>

我不太确定这里发生了什么。我猜我错过了配置的某些部分,以获得这个测试的JS方面的工作?还需要注意的是,此表单在开发/生产中是有效的。表单中的数据应该被发送到Posts Controller。

使此工作的另一个选项。为后端编写响应测试会更有意义吗?然后只用Jest或其他库来测试前端功能?

表单正在提交,但是您在Home控制器中没有正确的格式。在index方法中,你应该添加你希望控制器如何处理js格式。

你能确保你的方法同时处理html和json这样:

respond_to do |format|
format.html # index.html.erb
format.json { render json: @whatever_you_want_to_return }
end

至于测试,您的测试是好的,但是您应该始终测试应用程序的所有部分,以确保它们返回您想要的结果。

最新更新