Wie Setup-Rails-Angular Projekt JS zu testen?

Question

Ich versuche, mein Rails-Angular Projekt zur Einrichtung JS-Tests zur Verfügung zu stellen. Ich habe fast alles ausprobiert, was ich in Google gefunden haben:

• Karma (ehemals Testacular)
• Jasmine + Jasmine-headless-WebKit
• Jasminerice
• einige andere tuts

aber ich konnte nicht mit allen von ihnen. Ich bin für Art und Weise suchen Einheit und e2e-Tests in den meisten schmerzlos zu laufen (es in Wache oder Karma sein kann, ist mir egal, aber es muss es automatisch im Hintergrund ausgeführt werden).

Hat jemand von euch ein paar schönen Artikeln mit sehr schönen Beispiel, wie dies zu erreichen? In meiner Forschung habe ich this, finde aber IMHO ist es beispielsweise, wie dies nicht zu tun.

Meine eigentliche Gemfile:

source 'https://rubygems.org' 

# Use Ruby 1.9.3 instead default Heroku's 1.9.2 
# for development I suggest https://gist.github.com/1688857 
ruby '1.9.3' 

gem 'rails', '3.2.12' 

# Use PostgreSQL, which is quite awesome, fast and easy 
gem 'pg' 

# Gems used only for assets and not required 
# in production environments by default. 
group :assets do 
    gem 'sass-rails', '~> 3.2.3' 
    gem 'bootstrap-sass', '~> 2.3.1' 

    # I heard that you like Compass 
    gem 'compass' 

    # Angular.js 
    gem 'angularjs-rails' 
    gem 'angularjs-rails-resource' 
    gem 'angular-ui-rails' 

    # Assets should be minified before production 
    gem 'uglifier', '>= 1.0.3' 
end 

gem 'jquery-rails' 

# Serve static pages like a boss 
gem 'high_voltage' 

# Some user management will be nice 
gem 'devise' # User management 
# gem 'cancan' # And they privileges 

# To use Jbuilder templates for JSON 
gem 'jbuilder' 

# Be fast and deadly as Puma 
#gem 'puma' 

# We need also some administration panel, don't we? 
gem 'rails_admin' 

# Some helpers 
gem 'andand' 

group :development do 
    # IRb is ugly. Use Pry for the God's sake 
    gem 'pry-rails' 

    # Deploy with Capistrano 
    # gem 'capistrano' 
    # or Vlad the Deployer 
    # gem 'vlad' 

    # Why bother yourself with rerunning tests? Use Guard 
    gem 'guard' 
    gem 'guard-rspec' 
    gem 'guard-spork' 
    gem 'guard-livereload' 
    gem 'guard-jasmine' 
    gem 'rb-fsevent', require: false 
    gem 'rb-inotify', require: false 

    # Who like ugly error pages? We don't. 
    gem 'better_errors' 
    gem 'binding_of_caller' 

    # Prettier documentation 
    gem 'yard' 
end 

group :development, :test do 
    # Use RSpec for testing 
    gem 'rspec-rails', '~> 2.12.0' 

    # Test JS using Jasmine 
    gem 'jasmine' 
    gem 'jasmine-headless-webkit' 

    # Some DB table generator 
    gem 'factory_girl_rails', '~> 4.1.0' 

    # And fake data generator 
    gem 'ffaker' 
end 

group :test do 
    # Some Gherkins will be also good (to vodka of course) 
    gem 'turnip', '~> 1.1.0' 

    # Aww, an of course some web browser will be also apprised 
    gem 'capybara', '~> 2.0.1' 

    # Clean DB after tests 
    gem 'database_cleaner' 

    # Some nice matchers 
    gem 'shoulda-matchers' 

    # Extend your mocks 
    gem 'bourne', '~> 1.2.1' 

    # Coverage reports will be nice 
    gem 'simplecov', require: false 
end 

PS: Es wäre schön, wenn ich Berichterstattung Berichte auf einfache Weise erstellen können.

Answer 1

Sie können verwenden teaspoon es läuft Ihre Lieblings-Test-Suite (Standard ist Jasmin) und sie haben ein Wiki mit angular zu integrieren. Teaspoon lässt sich in die Asset-Pipeline integrieren, so dass Sie alle eckigen Edelsteine ​​dorthin werfen können und sie im Teelöffel spec_helper.js benötigen.

Die andere coole Sache ist: Sie haben auch ein Wache-Plugin zur Verfügung.

Answer 2

Sie können etwas Glück beim Auschecken der angular boilerplate project Grunts als das Build-System, das ich realisiere, ist nicht Ruby in sowieso, aber ich denke, beim Versuch, Dinge mit eckigen Ihre einzige Hoffnung zu testen, ist die Nodejs/Karma-Route .

Diese Setup-Uhren für Änderungen im Code und führt die Tests durch. In meiner begrenzten Erfahrung war es mir jedoch nicht möglich, die Ergebnisse des Testlaufs zu zeigen. Ich bin mir nicht sicher, ob ich etwas falsch mache oder ob es nicht unterstützt wird.

Auf jeden Fall hoffe, das hilft

Answer 3

ich fühle deinen Schmerz, es hat mich ein bisschen von Versuch und Irrtum, um alle Tests zu bekommen für meine Rails-Anwendung ausgeführt wird. Am Ende nutzte ich Guard für den kontinuierlichen Test von Entwicklern für Spezifikationen, Akzeptanz und Javascripts. Hier sind die Früchte meiner Arbeit.

Dies ist der Gemfile Ausschnitt, den Sie einschließen müssen. Es hat die erforderlichen Edelsteine ​​für Guard, Jasmine, Rspec und Turnip. Dieses Setup wird mit MRI und JRuby funktionieren, wir führen beide Tests durch. Diese

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 

die volle Guardfile die Uhren Rspec, Rübe und Jasmin Tests auslösen:

guard '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{^app/(.*)(\.erb|\.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" } 

    # Turnip features and steps 
    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(%r{spec/javascripts/spec\.(js\.coffee|js|coffee)$}) { 'spec/javascripts' } 
    watch(%r{spec/javascripts/.+_spec\.(js\.coffee|js|coffee)$}) 
    watch(%r{spec/javascripts/fixtures/.+$}) 
    watch(%r{app/assets/javascripts/(.+?)\.(js\.coffee|js|coffee)(?:\.\w+)*$}) { |m| "spec/javascripts/#{ m[1] }_spec.#{ m[2] }" } 
end 

Nun wird es ein wenig schwierig. Um Jasmine AngularJS für Tests richtig zu laden, habe ich angular-mocks.js 1.0.7 in das Verzeichnis spec/javascripts/support/angular-mocks.js heruntergeladen. Dies wird vom Spec-Helper und der Jasmine-Konfiguration verwendet, um die AnguljarJS-Spezifikationen auszuführen.

Für die spec/javascripts/spec_helper.js.coffee, zeigen Sie es an der Rails App Javascript, die Winkel-Mocks.js und alle Javascript-Spezifikationen:

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

Für die Jasmin-config spec/Javascripts/support/jasmine.yml, müssen die Config an der Rails-Anwendung-zu-Punkt JavaScript und die Winkel mocks.js . Hier die wir verwenden, aber mit den Kommentaren der Kürze halber entfernt:

src_files: 
    - assets/application.js 
    - spec/javascripts/support/angular-mocks.js 

stylesheets: 
    - stylesheets/**/*.css 

helpers: 
    - helpers/**/*.js 

spec_files: 
    - '**/*[sS]pec.js' 

src_dir: 

spec_dir: spec/javascripts 

Mit alles eingerichtet, müssen Sie einfach laufen bundle exec guard und alle Tests laufen und durch Entwicklungsänderungen ausgelöst werden.

Answer 4

Ich habe einen Blogbeitrag über eine sehr einfache Methode geschrieben, um AngularJS-Unit-Tests in einer Rails-App mit dem Standard-Jasmine-Juwel einzurichten. Es brauchte einen kleinen Codewechsel, damit die Dinge reibungslos funktionierten, was vom Jasmine-Team akzeptiert wurde.

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

In einem Punkt:

hinzufügen Jasmin und AngularJS-Schienen zu Ihrem Gemfile

gem "angularjs-rails" 
gem "jasmine", github: "pivotal/jasmine-gem" 

die Edelsteine ​​installieren und Jasmin Generator

$ bundle install 
$ rails g jasmine:install 

hinzufügen Winkel laufen zu Ihrer application.js, vor dem Rest Ihrer Bewerbung Ionen-Code

//= require angular 
//= require_tree . 

eine Datei namens ./spec/javascripts/helpers/angular_helpers.js erstellen und diese Zeile hinzufügen

//= require angular-mocks 

Jetzt können Sie AngularJS Implementierungsdateien in Ihrem app/assets Verzeichnis und Schreibtests enthalten, die die zur Verfügung gestellten Mocks verwenden. Und wenn Sie das angularjs-rails Juwel aufwerten, werden Sie neue Versionen von angular.js und angular-mocks.js zur gleichen Zeit erhalten.