Zac*_*ack 9 ruby-on-rails jasmine babeljs es6-modules ruby-on-rails-6
如何在 Rails 6 环境中配置 Jasmine(其中 Webpack 替换了 Javascript 的资产管道),以便我可以测试我为我的应用程序编写的 Javascript 模块?
我安装了 jasmine gem,运行rails generate jasmine:install并编辑jasmine.yml以指向我的 Javascript 源代码和规范的位置。
问题是我不能使用导入/导出语句。(例如,试图加载我的第一模块向测试结果在此错误在Chrome: Uncaught SyntaxError: Unexpected token 'export')
据我所知,我需要设置 Jasmine 才能使用 babel;但是,我没有找到关于如何在新的 Rails 6 布局中执行此操作的说明。
你是对的。的主要问题jasmine-gem是它没有通过 babel 传递规范。让我发布您的问题的最快解决方案,然后,我会考虑在jasmine-gem.
主要思想是通过 rails webpack 传输规范,只要它具有所有必需的 babel 配置。
jasmine-core因为我们不会jasmine-gem在此解决方案中使用
yarn add jasmine-core -D
Run Code Online (Sandbox Code Playgroud)现在创建两个额外的 webpack 包。一个用于 Jasmine,将只包含 Jasmine 和测试运行器
// app/javascript/packs/jasmine.js
import 'jasmine-core/lib/jasmine-core/jasmine.css'
import 'jasmine-core/lib/jasmine-core/jasmine-html.js'
import 'jasmine-core/lib/jasmine-core/boot.js'
import 'jasmine-core/images/jasmine_favicon.png'
Run Code Online (Sandbox Code Playgroud)
第二个是您的应用程序代码和规格
// app/javascript/packs/specs.js
// First load your regular JavaScript (copy all the JavaScript imports from your main pack).
let webpackContext = require.context('../javascripts', true, /\.js(\.erb)?$/)
for(let key of webpackContext.keys()) { webpackContext(key) }
// Then load the specs
let specsContext = require.context('../spec', true, /\.js(\.erb)?$/)
for(let key of specsContext.keys()) { specsContext(key) }
Run Code Online (Sandbox Code Playgroud)
注意你的'../javascripts'和'../spec'路径。对我来说,它看起来像'../../assets/javascripts'和'../../../spec'respectevly。
然后为 Jasmine 添加 Webpack ProvidePlugin(将此代码添加到config/webpack/environment.js)
// config/webpack/environment.js
const webpack = require('webpack')
environment.plugins.prepend('Provide', new webpack.ProvidePlugin({
jasmineRequire: 'jasmine-core/lib/jasmine-core/jasmine.js',
}))
Run Code Online (Sandbox Code Playgroud)将 Jasmine runner 页面添加到您的应用程序
# config/routes.rb
Rails.application.routes.draw do
# ...
if Rails.env.development? || Rails.env.test?
get 'jasmine', to: 'jasmine#index'
end
end
Run Code Online (Sandbox Code Playgroud)
# app/controllers/jasmine_controller.rb
class JasmineController < ApplicationController
layout false
def index
end
end
Run Code Online (Sandbox Code Playgroud)
# app/views/jasmine/index.html.haml
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<%= stylesheet_pack_tag 'jasmine', :media => 'all' %>
</head>
<body>
<%= javascript_pack_tag 'jasmine' %>
<%= javascript_pack_tag 'specs' %>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)/jasmine路线上工作这个答案是在这篇文章的基础上准备的,但是,我已经重新检查了关于 ruby 2.6.3、rails 6.0.2 的说明,对建议添加了适当的更改并证明这是有效的。
如果我的回答对您有帮助,或者您需要一些其他信息,请告诉我。但是,我将研究一个可以通过jasminegem 或类似实现成功的解决方案。
| 归档时间: |
|
| 查看次数: |
467 次 |
| 最近记录: |