title: Unit Testing Browserify Project with Karma + Jasmine
body: <p>I am trying to setup unit testing for a JavaScript plugin that is based on AngularJS. The plugin is bundled with Browserify via Gulp. It depends on external libraries that are injected with <code>wiredep</code> and <code>gulp-inject</code> from the <code>bower_components</code> folder. This is all working beautifully in the generated bundle, but if I try to run a Karma unit test via gulp, I get the following error:</p>
  
  <blockquote>
    <p>Uncaught TypeError: angular.module is not a function at /tmp/94dbea5947f4758ab1ee6935e2f4b3f1.browserify:365 &lt;- app/js/services/index.js:9:0</p>
  </blockquote>
  
  <p>In this file, <code>angular</code> is loaded with <code>var angular = require('angular');</code>, and a <code>console.log(angular)</code> gives an empty object.</p>
  
  <p>My <code>karma.conf.js</code>:</p>
  
  <pre><code>'use strict';
  
  const istanbul = require('browserify-istanbul');
  const isparta = require('isparta');
  const mainBowerFiles = require('main-bower-files');
  
  const karmaBaseConfig = {
  
      basePath: '../',
  
      frameworks: ['jasmine', 'browserify'],
  
      preprocessors: {
          'app/js/**/*.js': ['browserify', 'coverage'],
          '**/*.html': ['ng-html2js']
      },
  
      browserify: {
          debug: true,
          extensions: ['.js'],
          transform: [
              [["babelify", {"ignore": "/\/bower_components\//"}]],
              'browserify-ngannotate',
              'bulkify',
              'debowerify',
              'brfs',
              istanbul({
                  instrumenter: isparta,
                  ignore: ['**/bower_components/**', '**/node_modules/**', '**/test/**']
              })
          ]
      },
  
      ngHtml2JsPreprocessor: {
          stripPrefix: 'app/',
          moduleName: 'templates'
      },
  
      plugins: [
          'karma-jasmine',
          'karma-coverage',
          'karma-browserify',
          'karma-ng-html2js-preprocessor',
          'karma-chrome-launcher'
      ],
  
      files: mainBowerFiles({
          filter: '**/*.js',
          paths: {
              bowerDirectory: 'bower_components',
              bowerrc: '.bowerrc',
              bowerJson: 'bower.json'
          }
      }).concat([
          // app-specific code
          'app/js/main.js',
  
          // 3rd-party resources
          'node_modules/angular-mocks/angular-mocks.js',
  
          // test files
          'test/unit/**/*.js'
      ]),
  
      exclude: [],
  
      reporters: ['progress', 'coverage'],
  
      port: 9876,
  
      colors: true,
  
      autoWatch: false,
  
      browsers: ['Chrome'],
  
      singleRun: true
  };
  
  const customLaunchers = {
      chrome: {
          base: 'SauceLabs',
          browserName: 'chrome'
      }
  };
  
  const ciAdditions = {
      sauceLabs: {
          testName: 'Karma Unit Tests',
          startConnect: false,
          build: process.env.TRAVIS_BUILD_NUMBER,
          tunnelIdentifier: process.env.TRAVIS_JOB_NUMBER
      },
      browsers: Object.keys(customLaunchers),
      customLaunchers: customLaunchers,
      reporters: ['progress', 'coverage', 'saucelabs']
  };
  
  module.exports = function (config) {
      const isCI = process.env.CI;
      config.set(isCI ? Object.assign(karmaBaseConfig, ciAdditions) : karmaBaseConfig);
  };
  </code></pre>
  
  <p>All main application files are located under <code>app/</code>, bower files in <code>bower_components/</code>, node modules in <code>node_modules/</code> and test specs in <code>test/unit/</code>.</p>
  
  <p>It is based on this boilerplate: <a href="https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate" rel="nofollow noreferrer">https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate</a>.</p>
  
  <p>The error occurs just after Karma has launched Chrome, but before any unit test are executed (I checked with <code>console.log</code> in the unit test).</p>
  
  <p>Any help would be greatly appreciated.</p>