Merge pull request #1309 from hypothesis/angular-tests

Add basic test framework for the Angular app

h/js/directives.coffee

@@ -285,6 +285,8 @@ tags = ['$window', ($window) ->
         tag = ui.tagLabel
         $window.open "/t/" + tag
 
+    elem.find('input').addClass('form-input')
+
     ctrl.$formatters.push (tags=[]) ->
       assigned = elem.tagit 'assignedTags'
       for t in assigned when t not in tags
@@ -311,19 +313,18 @@ tags = ['$window', ($window) ->
 
 
 username = ['$filter', '$window', ($filter, $window) ->
-  link: (scope, elem, attr, ctrl) ->
-    return unless ctrl?
-
-    ctrl.$render = ->
-      scope.uname = ($filter 'persona') ctrl.$viewValue, 'username'
-      scope.provider = ($filter 'persona') ctrl.$viewValue, 'provider'
+  link: (scope, elem, attr) ->
+    scope.$watch 'user', ->
+      scope.uname = $filter('persona')(scope.user, 'username')
+      scope.provider = $filter('persona')(scope.user, 'provider')
 
     scope.uclick = (event) ->
-      event.stopPropagation()
+      event.preventDefault()
       $window.open "/u/#{scope.uname}@#{scope.provider}"
       return
 
-  require: '?ngModel'
+  scope:
+    user: '='
   restrict: 'E'
   template: '<span class="user" ng-click="uclick($event)">{{uname}}</span>'
 ]

karma.config.js

+// Karma configuration
+// Generated on Mon Jul 14 2014 14:06:50 GMT+0200 (CEST)
+
+module.exports = function(config) {
+  config.set({
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '',
+
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['mocha'],
+
+
+    // list of files / patterns to load in the browser
+    files: [
+      'h/lib/jquery-1.10.2.js',
+      'h/lib/jquery.mousewheel.js',
+      'h/lib/angular.js',
+      'h/lib/angular-mocks.js',
+      'h/lib/angular-animate.js',
+      'h/lib/angular-bootstrap.js',
+      'h/lib/angular-resource.js',
+      'h/lib/angular-route.js',
+      'h/lib/angular-sanitize.js',
+      'h/lib/gettext.js',
+      'h/locale/data.js',
+      'h/lib/annotator.js',
+      'h/lib/annotator.auth.js',
+      'h/js/plugin/bridge.js',
+      'h/js/plugin/discovery.js',
+      'h/lib/annotator.document.js',
+      'h/lib/annotator.permissions.js',
+      'h/lib/annotator.store.js',
+      'h/js/plugin/threading.js',
+      'h/lib/jschannel.js',
+      'h/lib/jwz.js',
+      'h/lib/moment-with-langs.js',
+      'h/lib/jstz.js',
+      'h/lib/moment-timezone.js',
+      'h/lib/moment-timezone-data.js',
+      'h/lib/Markdown.Converter.js',
+      'h/lib/polyfills/raf.js',
+      'h/lib/sockjs-0.3.4.js',
+      'h/lib/jquery.ui.core.js',
+      'h/lib/jquery.ui.position.js',
+      'h/lib/jquery.ui.widget.js',
+      'h/lib/jquery.ui.tooltip.js',
+      'h/lib/jquery.ui.autocomplete.js',
+      'h/lib/jquery.ui.menu.js',
+      'h/lib/jquery.ui.effect.js',
+      'h/lib/jquery.ui.effect-blind.js',
+      'h/lib/jquery.ui.effect-forecolor-highlight.js',
+      'h/lib/jquery.ui.effect-highlight.js',
+      'h/lib/tag-it.js',
+      'h/lib/uuid.js',
+      'h/lib/underscore-1.4.3.js',
+      'h/lib/backbone-0.9.10.js',
+      'h/lib/visualsearch.js',
+      'h/js/hypothesis.js',
+      'h/lib/sinon.js',
+      'h/lib/chai.js',
+      'tests/js/**/*-test.coffee'
+    ],
+
+
+    // list of files to exclude
+    exclude: [
+    ],
+
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      '**/*.coffee': ['coffee']
+    },
+
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['dots'],
+
+
+    // web server port
+    port: 9876,
+
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: false,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['PhantomJS'],
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: false
+  });
+};

package.json

@@ -9,6 +9,12 @@
     "uglify-js": "2.4.14"
   },
   "devDependencies": {
+    "karma": "^0.12.17",
+    "karma-cli": "0.0.4",
+    "karma-coffee-preprocessor": "^0.2.1",
+    "karma-mocha": "^0.1.4",
+    "karma-phantomjs-launcher": "^0.1.4",
+    "mocha": "^1.20.1",
     "phantomjs": "1.9.7-10"
   },
   "engines": {

tests/js/directives-test.coffee

+assert = chai.assert
+
+describe 'h.directives', ->
+  $scope = null
+  $compile = null
+  fakeWindow = null
+
+  beforeEach module ($provide, $filterProvider) ->
+    fakeWindow = {open: sinon.spy()}
+
+    $provide.value('$window', fakeWindow)
+
+    $filterProvider.register 'persona', ->
+      (user, part) ->
+        parts = user.slice(5).split('@')
+        {username: parts[0], provider: parts[1]}[part]
+
+    return
+
+  beforeEach module('h.directives')
+
+  beforeEach inject (_$compile_, _$rootScope_) ->
+    $compile = _$compile_
+    $scope = _$rootScope_.$new()
+
+  describe '.username', ->
+    $element = null
+
+    beforeEach ->
+      $scope.model = 'acct:bill@127.0.0.1'
+
+      $element = $compile('<username data-user="model"></username>')($scope)
+      $scope.$digest()
+
+    it 'renders with the username', ->
+      text = $element.find('.user').text()
+      assert.equal(text, 'bill')
+
+    it 'opens a new window for the user when clicked', ->
+      $element.find('.user').click()
+      sinon.assert.calledWith(fakeWindow.open, '/u/bill@127.0.0.1')
+
+    it 'prevents the default browser action on click', ->
+      event = jQuery.Event('click')
+      $element.find('.user').trigger(event)
+
+      assert(event.isDefaultPrevented())
+
+    describe 'when model is changed', ->
+      beforeEach ->
+        $scope.model = 'acct:jim@hypothesis'
+        $scope.$digest()
+
+      it 'keeps the username in sync', ->
+        text = $element.find('.user').text()
+        assert.equal(text, 'jim')
+
+      it 'keeps the url in sync', ->
+        $element.find('.user').click()
+        sinon.assert.calledWith(fakeWindow.open, '/u/jim@hypothesis')