So testen Sie AngularJS-Anweisungen

Question

Oct 06, 2012, 01:47 AM

So testen Sie AngularJS-Anweisungen

Ich arbeite an einer Rails 3.2-App, die AngularJS verwenden wird. Ich kann Angular dazu bringen, das zu tun, was ich brauche, aber es fällt mir sehr schwer, herauszufinden, wie ich testen kann, was ich tue. Ich verwende Guard-Jasmin, um Jasminspezifikationen mit PhantomJS auszuführen.

Hier ist das (relevante) HTML:

<html id="ng-app" ng-app="app">
  <div id="directive-element" class="directive-element">
  </div>
</html>

Das Javascript (in Coffeescript) sieht so aus:

window.Project =
  App: angular.module('app', [])
  Directive: {}

Project.Directive.DirectiveElement =
  ->
    restrict: 'C'
    link: (scope, element, attrs) ->
      element.html 'hello world'
Project.App.directive 'directiveElement', Project.Directive.DirectiveElement

Der obige Code macht genau das, was er tun soll. Die Tests sind das Problem. Ich kann sie überhaupt nicht zum Arbeiten bringen. Dies ist eine Sache, die ich versucht hatte. Das Posten ist meistens nur, um das Gespräch irgendwo zu beginnen.

describe 'App.Directive.DirectiveElement', ->
  it 'updates directive-element', ->
    inject ($compile, $rootScope) ->
      element = $compile('<div id="app" ng-app="app"><div id="directive'element" class="directive-element"></div></div>')
      expect(element.text()).toEqual('hello world')

Abgesehen davon bin ich neu in AngularJS. Wenn es also Best Practices in Bezug auf Namespaces, Module usw. gibt, die ich nicht befolge, wäre eine Anleitung hilfreich.

Wie bekomme ich einen Test, damit das funktioniert?