Rails 6でJasmineを設定する方法は？

アプリ用に作成したJavascriptモジュールをテストできるように、Rails 6環境（WebpackがJavaScriptのアセットパイプラインを置き換える）でJasmineを構成するにはどうすればよいですか？

私はジャスミンのgemをインストールして実行しrails generate jasmine:install、jasmine.ymlJavaScriptソースと仕様の場所を指すように編集しました。

問題は、インポート/エクスポートステートメントを使用できないことです。（例えば、クロムでこのエラーのテスト結果に自分の最初のモジュールをロードしようとします。Uncaught SyntaxError: Unexpected token 'export'）

私が言えることから、私はジャベルをセットアップしてbabelを使用する必要があります。しかし、私は新しいRails 6レイアウトでこれを行う方法についての説明を見つけることができません。

— ザック
ソース

@Dofsさん、こんにちは。私の答えを確認する機会がありましたか。それで十分ですか、それとも私はより深く支援/調査する必要がありますか？

— セルゲイメル

未だに。1月と2月は、私の通常の仕事で1年で最も忙しい時期です。できるだけ早くお知らせします。

— ザック

はい、あなたが正しい。の主な問題はjasmine-gem、スペックをバベルに通さないことです。あなたの問題の最も迅速な解決策を投稿させてください。その後、同様のアプローチをで実装できると思いますjasmine-gem。

主なアイデアは、必要なバベル構成がすべて揃っている限り、スペックをレールのWebパックにパイプすることです。

このソリューションでjasmine-coreは使用jasmine-gemしないため、インストールします
```
yarn add jasmine-core -D
```

次に、2つの追加のWebpackパックを作成します。1つは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'

そして、あなたのアプリケーションコードと仕様のための2番目のもの

// 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) }

'../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',
}))

Jasmineランナーページをアプリケーションに追加する

# config/routes.rb

Rails.application.routes.draw do
  # ...

  if Rails.env.development? || Rails.env.test?
    get 'jasmine', to: 'jasmine#index'
  end
end

# app/controllers/jasmine_controller.rb

class JasmineController < ApplicationController
  layout false

  def index
  end
end

# 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>

これでジャスミンは/jasmineルート上で動作するはずです

この回答はこの投稿に基づいて作成されていますが、Ruby 2.6.3、Rails 6.0.2の説明を再確認し、推奨事項に適切な変更を加え、これが機能することを証明しました。

私の回答が役に立ったか、追加情報が必要かをお知らせください。ただし、jasminegemまたは同様の実装で成功するソリューションに取り組みます。

— セルゲイ・メル
ソース

何か試してもらいますか？私はこれらの指示に従いました、ジャスミンは動作していますが、突然bootstrap.min.js、基本的にjquery以前にロードされていないことを意味するエラーをスローしていますbootstrap。ただし、]このコードでJSロード順序を変更するものを見つけることができません...特に、ブートストラップがアプリケーションレイアウトのCDNを介してロードされてjavascript_pack_tag 'application'おり、application.jsすでにrequire('jquery')。ローカル環境でこの設定を行っている場合、アプリケーションレイアウトでCDNを介してブートストラップをロードし、それが機能するかどうかを確認できますか？

— ジェームズ

私はそれを考え出した。ステップ3では、jqueryプラグインを追加したコードをオーバーライドしました。この答えは、それを修正：stackoverflow.com/questions/51447443/...

— ジェームズ・