31 votes

Comment le programme d'installation de Rails-Angulaire projet pour tester la JS?

Je suis en train de configurer mon Rails-Angulaire du projet à fournir des JS tests. J'ai essayé presque tout ce que j'ai trouvé sur Google:

mais je n'ai pas réussi à chacun d'eux. Je suis à la recherche de façon à faire tourner la machine et e2e tests dans la plupart indolore (il peut être dans la Garde ou le Karma, je n'aime pas, mais il doit s'exécuter automatiquement en arrière-plan).

Quelqu'un de vous certaines bel article avec de jolies exemple comment atteindre cet objectif? Dans mes recherches, j'ai trouvé cela, mais à mon humble avis c'est un exemple de comment ne PAS le faire.

Mon effectif 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: Ce serait bien si je peux créer des rapports de couverture de façon simple.

6voto

mguymon Points 4527

Je ressens votre douleur, il m'a fallu un peu d'essais et d'erreurs pour obtenir tous les tests en cours d'exécution pour mon application Rails. J'ai fini à l'aide de la Garde pour le développeur de tests continus pour les specs, de l'acceptation, et de javascript. Voici les fruits de mon travail.

C'est le Gemfile extrait de code que vous devez inclure. Il a les Gemmes pour de la Garde, de Jasmin, Rspec, et le Navet. Cette installation fonctionnera avec l'IRM et JRuby, nous effectuons nos tests sur les deux.

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

Ce la pleine Guardfile que les montres Rspec, Navet, et de Jasmin pour déclencher des tests:

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

Maintenant, les choses se complique un peu. Pour obtenir le Jasmin pour charger correctement jusqu'AngularJS pour les tests que j'ai téléchargé angular-mocks.js 1.0.7 pour le répertoire spec/javascripts/support/angular-mocks.js. Il est utilisé par le spec aide et le jasmin config pour exécuter le AnguljarJS specs.

Pour les spec/javascripts/spec_helper.rb.js.le café, le point à l'application Rails, javascript, l'angular-mocks.js et tous les javascript spécifications:

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

Pour le Jasmin de config, spec/javascripts/support/jasmin.yml, la config aurez besoin de pointer à l'application Rails, javascript et le angular-mocks.js. Ici est que nous utilisons, mais avec les commentaires supprimés pour des raisons de concision:

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

Avec tout mis en place, il vous suffit de lancer bundle exec guard et tous les tests sont exécutés et être déclenchée par des changements en matière de développement.

6voto

treehau5 Points 586

Vous pouvez utiliser de cuillère à café de il exécute votre favori de la suite de tests (valeur par défaut est de jasmin) et ils ont un wiki pour intégrer angulaire. Cuillère à café s'intègre avec l'asset pipeline, de sorte que vous pouvez jeter tous les angles des pierres précieuses dans là et ont besoin de cuillère à café généré spec_helper.js.

L'autre truc cool, c'est: ils ont une garde plugin disponible.

2voto

nertzy Points 2310

J'ai écrit un billet de blog sur un moyen très simple de configurer AngularJS tests unitaires sur une application Rails à l'aide de la valeur par défaut de Jasmin gem. Il a eu un petit changement de code pour que les choses fonctionnent bien, qui a été acceptée par le Jasmin équipe.

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

En un mot:

Ajouter jasmine et angularjs-rails à votre Gemfile

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

Installer les gems et exécutez le générateur de Jasmin

$ bundle install
$ rails g jasmine:install

Ajouter angulaire de votre application.js, avant que le reste de votre code d'application

//= require angular
//= require_tree .

Créez un fichier nommé ./spec/javascripts/helpers/angular_helpers.js et ajoutez cette ligne

//= require angular-mocks

Maintenant, vous pouvez inclure AngularJS fichiers de mise en œuvre dans votre app/assets répertoire et écrire des tests qui utilisent la condition des simulacres. Et lorsque vous mettez à niveau l' angularjs-rails gem, vous obtiendrez de nouvelles versions de angular.js et angular-mocks.js dans le même temps.

0voto

Derek Ekins Points 5524

Vous pouvez avoir de la chance de vérifier l' angulaire standard projet il utilise grunt comme le système de construction qui je me rends compte n'est pas rubis de toute façon, mais je pense que lorsque l'on essaie de tester des choses angulaire votre seul espoir est d'aller le nodejs/karma route.

Cette configuration des montres pour les changements dans votre code et effectue les tests. Cependant, dans mon expérience limitée, je n'ai pas été en mesure de l'obtenir pour afficher les résultats de l'exécution des tests. Je ne suis pas sûr de savoir si je fais quelque chose de mal ou si elle n'est pas prise en charge.

De toute façon, espérons que cette aide

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X