JSをテストするためにRailsAngularプロジェクトを設定するにはどうすればよいですか?



How Do I Set Up Rails Angular Project Test Js



解決:

Railsアプリですべてのテストを実行するには、少し試行錯誤が必要でした。仕様、受け入れ、JavaScriptの開発者の継続的テストにGuardを使用することになりました。これが私の努力の成果です。

これは Gemfile 含める必要のあるスニペット。 Guard、Jasmine、Rspec、Turnipに必要な宝石があります。このセットアップはMRIとJRubyで機能し、両方でテストを実行します。



group:test、:development do#Guard gem'guard-jasmine 'gem'guard-bundler'、 '> = 1.0.0' gem'guard-rails '、'> = 0.4.0 'gem'guard-rspec'、 '> = 2.5.2' gem'rb-inotify '、'> = 0.9.0 '、:require => false gem'rb-fsevent'、 '> = 0.9.3'、:require => false gem'rb -fchange '、'> = 0.0.6 '、:require => false#Rspec gem' rspec-rails '、'〜> 2.12.2 '#Jasmine gem' jasmine '、'〜> 1.3.1'gem 'jasminerice 'end group:test do#Turnip gem' turnip '、'〜> 1.1.0'gem 'capybara'、 '〜> 2.0.3'end

これは完全です Guardfile Rspec、Turnip、およびJasmineを監視してテストをトリガーします。

ガード 'rspec' do watch(%r {^ spec/。+_spec  .rb $})watch(%r {^ lib /(。+)。rb $}){| m | 'spec / lib /#{m [1]} _ spec.rb'} watch( 'spec / spec_helper.rb'){'spec'}#Rails watch(%r {^ app /(。+)。rb $ }){| m | 'spec /#{m [1]} _ spec.rb'} watch(%r  .haml)$){| m | 'spec /#{m [1]}#{m [2]} _ spec.rb'} watch(%r {^ app / controllers /(。+)_(controller)。rb $}){| m | ['spec /routing/#{m[1]}_routing_spec.rb'、'spec/#{m[2]}s/#{m[1]}_#{m[2]}_spec.rb'、 'spec / acceptance /#{m [1]} _ spec.rb']} watch(%r {^ spec / support /(。+)。rb $}){'spec'} watch( 'config / routes。 rb '){' spec / routing '} watch(' app / controllers / application_controller.rb '){' spec / controllers '}#カブの機能と手順watch(%r {^ spec / acceptance /(。+)。 feature $})watch(%r {^ spec / acceptance / steps /(.+)_ steps  .rb $}){| m | Dir [File.join( '** /#{m [1]}。feature')] [0] || 'spec / acceptance'} end guard:jasmine do watch(%rcoffee)$){'spec / javascripts'} watch(%rspec / javascripts /.+ _ spec 。(js  .coffee)watch(%r {spec / javascripts / Fixtures /.+ $})watch(%rcoffee)(?:。 w +)* $){| m | 'spec / javascripts /#{m [1]} _spec。#{m [2]}'} end

今、物事は少しトリッキーになります。 Jasmineにテスト用にAngularJSを適切にロードさせるために、angular-mocks.js1.0.7をディレクトリにダウンロードしました spec / javascripts / support / angular-mocks.js 。これは、スペックヘルパーとjasmine設定でAnguljarJSスペックを実行するために使用されます。



のために spec / javascripts / spec_helper.js.coffee 、Railsアプリのjavascript、angular-mocks.js、およびすべてのjavascript仕様をポイントします。

#= require ../../app/assets/javascripts/application#= require ./support/angular-mocks#= require_tree ./

Jasmine構成の場合、 スペック/ javascripts /サポート/jasmine.yml 、構成はRailsアプリのjavascriptとangular-mocks.jsを指す必要があります。これが私たちが使用するものですが、簡潔にするためにコメントは削除されています:

src_files:-assets / application.js-spec / javascripts / support / angular-mocks.jsスタイルシート:-stylesheets / ** / *。cssヘルパー:-helpers / ** /*。jsspec_files:-'** / * [sS] pec.js'src_dir:spec_dir:spec / javascripts

すべての設定が完了したら、実行するだけです。exec guardをバンドルすると、すべてのテストが実行され、開発の変更によってトリガーされます。




小さじ1杯を使用して、お気に入りのテストスイート(デフォルトはジャスミン)を実行でき、Angularと統合するためのwikiがあります。 Teaspoonはアセットパイプラインと統合されているため、そこにすべての角度のある宝石を投げて、小さじで生成されたspec_helper.jsでそれらを要求できます。

もう1つの優れた点は、ガードプラグインも利用できることです。


デフォルトのJasminegemを使用してRailsアプリでAngularJSユニットテストを設定する非常に簡単な方法についてのブログ投稿を書きました。物事をスムーズに機能させるために小さなコード変更が必要でしたが、これはJasmineチームによって受け入れられました。

http://pivotallabs.com/unit-testing-angularjs-using-jasmine/

一言で言えば:

ジャスミンとangularjs-railsをGemfileに追加します

gem'angularjs-rails 'gem'jasmine'、github: 'pivotal / jasmine-gem'

宝石をインストールし、ジャスミンジェネレーターを実行します

$ bundle install $ rails g jasmine:install

アプリケーションコードの残りの部分の前に、application.jsにAngularを追加します

// =角度が必要// = require_tree。

名前の付いたファイルを作成します./spec/javascripts/helpers/angular_helpers.jsそしてこの行を追加します

// =角度モックが必要

これで、AngularJS実装ファイルをに含めることができますapp / assetsディレクトリと、提供されたモックを使用するテストを記述します。そして、あなたがアップグレードするときanglejs-rails gem、新しいバージョンのangle.jsと同時にangular-mocks.js。