Use karma-browserify to run the tests, rather than relying on prebuilt
assets. This commit alters our test harness so that it no longer relies
(at all) on the webassets pipeline. This means:

- test isolation is improved, as each test file runs in its own module
- bringing objects into test scope is now simply a matter of requiring
  the correct module, rather than bolting more and more objects onto the
  Annotator namespace
- autoreloading of tests when either test files or their dependencies
  are modified is now possible (and enabled by default)

Makefile

@@ -18,7 +18,6 @@ test:
	$(eval es := $(shell wget --quiet --output-document - http://localhost:9200))
	@if [ -n '${es}' ] ; then echo "yes." ; else echo "no!"; exit 1; fi
	python setup.py develop test
	hypothesis assets development.ini
	"$$(npm bin)"/karma start karma.config.js --single-run
	"$$(npm bin)"/karma start h/browser/chrome/karma.config.js --single-run

README.rst

@@ -107,10 +107,8 @@ To run the Python suite, invoke the tests in the standard fashion::

    $ ./bin/python setup.py test

To run the JavaScript suite, ensure the assets are built and then invoke the
karma test runner::
To run the JavaScript suite, run::

    $ hypothesis assets development.ini
    $ $(npm bin)/karma start karma.config.js --single-run

As a convenience, there is a make target which will do all of the above::
@@ -120,8 +118,7 @@ As a convenience, there is a make target which will do all of the above::
It's also possible to run a subset of the tests using ``karma run``::

    $ $(npm bin)/karma start karma.config.js & # Start the server in the bg.
    $ hypothesis assets development.ini && \
      $(npm bin)/karma run karma.config.js -- --grep={FILTER_STRING}
    $ $(npm bin)/karma run karma.config.js -- --grep={FILTER_STRING}

This will run generally be much faster than running ``karma start --single-run``
each time. The frontend tests can also be debugged by visiting

h/assets.yaml

@@ -48,6 +48,10 @@ autofill:
  filters: uglifyjs
  output: scripts/vendor/polyfills/autofill-event.min.js
  contents: h:static/scripts/vendor/polyfills/autofill-event.js
bind:
  filters: uglifyjs
  output: scripts/vendor/polyfills/bind.min.js
  contents: h:static/scripts/vendor/polyfills/bind.js
wgxpath:
  filters: uglifyjs
  output: scripts/vendor/polyfills/wgxpath.install.min.js
@@ -91,6 +95,7 @@ app:
    - angular_tags_input
    - annotator
    - autofill
    - bind
    - katex
    - momentjs
    - url

h/static/bootstrap.js

@@ -1,6 +1,48 @@
require('./scripts/vendor/jquery.scrollintoview');

var Annotator = require('annotator');

// Monkeypatch annotator!
require('./scripts/annotator/monkey');

// Cross-frame communication
require('./scripts/annotator/plugin/cross-frame');
require('./scripts/annotation-sync');
require('./scripts/bridge');
require('./scripts/discovery');

// Document plugin
require('./scripts/vendor/annotator.document');

// Bucket bar
require('./scripts/annotator/plugin/bucket-bar');

// Toolbar
require('./scripts/annotator/plugin/toolbar');

// Drawing highlights
require('./scripts/annotator/plugin/texthighlights');

// Creating selections
require('./scripts/annotator/plugin/textselection');

// URL fragments
require('./scripts/annotator/plugin/fragmentselector');

// Anchoring
require('./scripts/vendor/dom_text_mapper');
require('./scripts/annotator/plugin/enhancedanchoring');
require('./scripts/annotator/plugin/domtextmapper');
require('./scripts/annotator/plugin/textposition');
require('./scripts/annotator/plugin/textquote');
require('./scripts/annotator/plugin/textrange');

// PDF
require('./scripts/vendor/page_text_mapper_core');
require('./scripts/annotator/plugin/pdf');

// Fuzzy
require('./scripts/vendor/dom_text_matcher');
require('./scripts/annotator/plugin/fuzzytextanchors');

var Klass = require('./scripts/host');
var docs = 'https://github.com/hypothesis/h/blob/master/README.rst#customized-embedding';
var options = {

h/static/scripts/annotator/plugin/bucket-bar.coffee

@@ -1,3 +1,5 @@
Annotator = require('annotator')

$ = Annotator.$

class Annotator.Plugin.BucketBar extends Annotator.Plugin
@@ -338,3 +340,5 @@ class Annotator.Plugin.BucketBar extends Annotator.Plugin

  isUpper:   (i) -> i == 1
  isLower:   (i) -> i == @index.length - 2

exports.BucketBar = Annotator.Plugin.BucketBar

h/static/scripts/annotator/plugin/cross-frame.coffee

@@ -1,3 +1,5 @@
Annotator = require('annotator')

$ = Annotator.$

# Extracts individual keys from an object and returns a new one.
@@ -45,3 +47,5 @@ CrossFrame = class Annotator.Plugin.CrossFrame extends Annotator.Plugin

    this.onConnect = (fn) ->
      bridge.onConnect(fn)

exports.CrossFrame = CrossFrame

h/static/scripts/annotator/plugin/enhancedanchoring.coffee

@@ -293,3 +293,5 @@ class Annotator.Plugin.EnhancedAnchoring extends Annotator.Plugin

    selectors

exports.Anchor = Anchor
exports.EnhancedAnchoring = Annotator.Plugin.EnhancedAnchoring

h/static/scripts/annotator/plugin/texthighlights.coffee

@@ -1,3 +1,5 @@
require('../../vendor/jquery.scrollintoview')

$ = Annotator.$

# Public: Wraps the DOM Nodes within the provided range with a highlight
@@ -125,3 +127,5 @@ class Annotator.Plugin.TextHighlights extends Annotator.Plugin
  pluginInit: ->
    # Export the text highlight class for other plugins
    Annotator.TextHighlight = TextHighlight

exports.TextHighlight = TextHighlight

h/static/scripts/controllers.coffee

@@ -22,13 +22,13 @@ class AppController
  this.$inject = [
    '$controller', '$document', '$location', '$route', '$scope', '$window',
    'auth', 'drafts', 'identity',
    'permissions', 'streamer', 'streamfilter', 'annotationUI',
    'permissions', 'streamer', 'annotationUI',
    'annotationMapper', 'threading'
  ]
  constructor: (
     $controller,   $document,   $location,   $route,   $scope,   $window,
     auth,   drafts,   identity,
     permissions,   streamer,   streamfilter, annotationUI,
     permissions,   streamer,   annotationUI,
     annotationMapper, threading
  ) ->
    $controller(AnnotationUIController, {$scope})
@@ -176,11 +176,11 @@ class AnnotationViewerController
class ViewerController
  this.$inject = [
    '$scope', '$route', 'annotationUI', 'crossframe', 'annotationMapper',
    'auth', 'flash', 'streamer', 'streamfilter', 'store'
    'auth', 'streamer', 'streamfilter', 'store'
  ]
  constructor:   (
     $scope,   $route, annotationUI, crossframe, annotationMapper,
     auth,   flash,   streamer,   streamfilter,   store
     auth,   streamer,   streamfilter,   store
  ) ->
    # Tells the view that these annotations are embedded into the owner doc
    $scope.isEmbedded = true

h/static/scripts/guest.coffee

@@ -2,48 +2,6 @@ $ = require('jquery')
Annotator = require('annotator')
Channel = require('./vendor/jschannel')

# Monkeypatch annotator!
require('./annotator/monkey')

# Cross-frame communication
require('./annotator/plugin/cross-frame')
require('./annotation-sync')
require('./bridge')
require('./discovery')

# Document plugin
require('./vendor/annotator.document')

# Bucket bar
require('./annotator/plugin/bucket-bar')

# Toolbar
require('./annotator/plugin/toolbar')

# Drawing highlights
require('./annotator/plugin/texthighlights')

# Creating selections
require('./annotator/plugin/textselection')

# URL fragments
require('./annotator/plugin/fragmentselector')

# Anchoring
require('./vendor/dom_text_mapper')
require('./annotator/plugin/enhancedanchoring')
require('./annotator/plugin/domtextmapper')
require('./annotator/plugin/textposition')
require('./annotator/plugin/textquote')
require('./annotator/plugin/textrange')

# PDF
require('./vendor/page_text_mapper_core')
require('./annotator/plugin/pdf')

# Fuzzy
require('./vendor/dom_text_matcher')
require('./annotator/plugin/fuzzytextanchors')

module.exports = class Annotator.Guest extends Annotator
  SHOW_HIGHLIGHTS_CLASS = 'annotator-highlights-always-on'

h/static/scripts/helpers/time-helpers.coffee

@@ -61,3 +61,4 @@ createTimeHelpers = ->

angular.module('h.helpers')
.factory('timeHelpers', createTimeHelpers)

karma.config.js

@@ -10,52 +10,43 @@ module.exports = function(config) {

    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['mocha'],
    frameworks: [
      'browserify',
      'mocha'
    ],


    // list of files / patterns to load in the browser
    files: [
      'h/static/scripts/vendor/polyfills/bind.js',
      'h/static/scripts/vendor/polyfills/url.js',
      'h/static/scripts/vendor/polyfills/promise.js',
      // Application external deps
      'h/static/scripts/vendor/jquery.js',
      'h/static/scripts/vendor/jschannel.js',
      'h/static/scripts/vendor/jwz.js',
      'h/static/scripts/vendor/moment-with-langs.js',
      'h/static/scripts/vendor/jstz.js',
      'h/static/scripts/vendor/moment-timezone.js',
      'h/static/scripts/vendor/moment-timezone-data.js',
      'h/static/scripts/vendor/Markdown.Converter.js',
      'h/static/scripts/vendor/unorm.js',
      'h/static/scripts/vendor/uuid.js',
      'h/static/scripts/vendor/annotator.js',
      'h/static/scripts/annotator/monkey.js',
      'h/static/scripts/vendor/annotator.auth.js',
      'h/static/scripts/annotator/plugin/bridge.js',
      'h/static/scripts/annotator/plugin/bucket-bar.js',
      'h/static/scripts/vendor/dom_text_mapper.js',
      'h/static/scripts/annotator/annotator.anchoring.js',
      // Angular needs to be included after annotator to avoid the
      // CrossFrame dependencies in Bridge picking up the angular object.
      'h/static/scripts/vendor/angular.js',
      'h/static/scripts/vendor/angular-mocks.js',
      'h/static/scripts/vendor/angular-animate.js',
      'h/static/scripts/vendor/angular-bootstrap.js',
      'h/static/scripts/vendor/angular-resource.js',
      'h/static/scripts/vendor/angular-route.js',
      'h/static/scripts/vendor/angular-sanitize.js',
      'h/static/scripts/vendor/ng-tags-input.js',
      'h/static/scripts/annotator/plugin/texthighlights.js',
      'h/static/scripts/app.js',
      'h/static/scripts/account.js',
      'h/static/scripts/helpers.js',
      'h/static/scripts/session.js',
      'h/static/scripts/hypothesis.js',
      'h/static/scripts/vendor/annotator.js',
      'h/static/scripts/vendor/polyfills/autofill-event.js',
      'h/static/scripts/vendor/polyfills/bind.js',
      'h/static/scripts/vendor/katex/katex.js',
      'h/static/scripts/vendor/moment-with-langs.js',
      'h/static/scripts/vendor/jstz.js',
      'h/static/scripts/vendor/moment-timezone.js',
      'h/static/scripts/vendor/moment-timezone-data.js',
      'h/static/scripts/vendor/polyfills/url.js',

      // Test deps
      'h/static/scripts/vendor/angular-mocks.js',
      'h/static/scripts/vendor/polyfills/promise.js',
      'h/static/scripts/vendor/sinon.js',
      'h/static/scripts/vendor/chai.js',
      'h/templates/client/*.html',
      'tests/js/bootstrap.coffee',
      'tests/js/**/*-test.coffee'

      // Tests
      'tests/js/**/*-test.coffee',
    ],


@@ -72,10 +63,14 @@ module.exports = function(config) {
    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      '**/*.coffee': ['coffee'],
      '**/*.coffee': ['browserify'],
      'h/templates/client/*.html': ['ng-html2js'],
    },

    browserify: {
      debug: true,
      extensions: ['.coffee']
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
@@ -97,7 +92,7 @@ module.exports = function(config) {


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,
    autoWatch: true,


    // start these browsers

package.json

@@ -13,6 +13,7 @@
  },
  "devDependencies": {
    "karma": "^0.12.17",
    "karma-browserify": "^3.0.3",
    "karma-cli": "0.0.4",
    "karma-coffee-preprocessor": "^0.2.1",
    "karma-mocha": "^0.1.4",
@@ -42,12 +43,14 @@
  "browser": {
    "jquery": "./h/static/scripts/vendor/jquery.js",
    "annotator": "./h/static/scripts/vendor/annotator.js",
    "angular": "./h/static/scripts/vendor/angular.js"
    "angular": "./h/static/scripts/vendor/angular.js",
    "angular-mock": "./h/static/scripts/vendor/angular-mocks.js"
  },
  "browserify-shim": {
    "jquery": "global:jQuery",
    "annotator": "global:Annotator",
    "angular": "global:angular",
    "angular-mock": "global:angular.mock",
    "./h/static/scripts/vendor/jschannel.js": "Channel",
    "./h/static/scripts/vendor/page_text_mapper_core.js": "PageTextMapperCore",
    "./h/static/scripts/vendor/dom_text_matcher.js": {

tests/js/account/account-controller-test.coffee

@@ -1,8 +1,10 @@
{inject, module} = require('angular-mock')

assert = chai.assert
sinon.assert.expose assert, prefix: null
sandbox = sinon.sandbox.create()

describe 'AccountController', ->

describe 'h:AccountController', ->
  $scope = null
  fakeFlash = null
  fakeSession = null
@@ -13,10 +15,16 @@ describe 'AccountController', ->
  disableUserPromise = null
  profilePromise = null
  createController = null
  sandbox = null

  before ->
    angular.module('h', [])
    require('../../../h/static/scripts/account/account-controller')

  beforeEach module('h')

  beforeEach module ($provide, $filterProvider) ->
    sandbox = sinon.sandbox.create()
    fakeSession = {}
    fakeFlash = sandbox.spy()
    fakeIdentity =
@@ -49,6 +57,9 @@ describe 'AccountController', ->
    createController = ->
      $controller('AccountController', {$scope: $scope})

  afterEach ->
    sandbox.restore()

  describe '.submit', ->
    createFakeForm = (overrides={}) ->
      defaults =