karma.conf.js uncaught referencerror: google no defined

Question

when i try running the karma test runner, i'm getting a error as the following from one of my files, saying that my library google is undefined???

   Chrome 36.0.1985 (Mac OS X 10.9.4) ERROR
   Uncaught ReferenceError: google is not defined
   at /Users/giowong/rails_project/doctible_pre_treatment/app/assets/javascripts/angular-google-maps.min.js:7

my karma.conf.js file

       // Karma configuration
module.exports = function(config) {
config.set({
// base path, that will be used to resolve files and exclude
basePath: '/Users/giowong/rails_project/doctible_pre_treatment/',

// testing framework to use (jasmine/mocha/qunit/...)
frameworks: ['jasmine'],

// list of files / patterns to load in the browser
files: [
  'app/assets/components/angular/angular.js',
  'app/assets/components/angular-mocks/angular-mocks.js',
  'app/assets/components/angular-resource/angular-resource.js',
  'app/assets/components/angular-payments/lib/angular-payments.js',
  'app/assets/components/ng-file-upload/angular-file-upload.js',
  'app/assets/components/ngDialog/js/ngDialog.js',
  'app/assets/components/angular-route/angular-route.js',
  'app/assets/components/angular-loading-bar/src/loading-bar.js',
  'app/assets/javascripts/angular/filters/widget-filters.js',
  'app/assets/components/angular-animate/angular-animate.js',
  'app/assets/javascripts/angular/directives/loader.js',
  'app/assets/javascripts/angular/directives/focus.js',
  'app/assets/javascripts/angular/directives/checkout-form.js',
  'app/assets/javascripts/angular/directives/provider-form.js',
  'app/assets/components/angular-ui-utils/ui-utils.js',
  'app/assets/components/angular-sanitize/angular-sanitize.js',
  'app/assets/components/angular-bootstrap/ui-bootstrap.js',
  'app/assets/components/angular-ui-map/ui-map.js',
  'app/assets/components/underscore/underscore.js',
  'app/assets/components/jquery-1.11.1.min.js',
  'app/assets/javascripts/*.js',
  'app/assets/javascripts/**/**/*.js',
  'spec/javascripts/*.js'
],
// list of files / patterns to exclude
exclude:[],

// web server port
port: 8080,

// level of logging
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
logLevel: config.LOG_INFO,

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

// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
browsers: ['Chrome'],


// Continuous Integration mode
// if true, it capture browsers, run tests and exit
singleRun: true
});
};

i tried google already and no luck so far. I've tried making a test file and defining google itself. Any help is appreciated

Erythromycin

Answer 1

You get this error because you use google maps v3 API on your application but do not have any code, which will initialize window.google property, when you run your tests.

Solution 1

Compile this mock to javascript and reference compiled *.js in files of your config.

Solution 2

1. Create your own google-mock.js
2. Add it to files array of your karma.config

3. Add stab to google-mock.js for each Google Maps API call which you use in your app like in example below:

   (function(){
     window.google = window.google || {
       maps: {
         Map: function(){},
   // and so on...
       }
     };
   })();
   

Solution 3

1. Open this link
2. Save ALL text from this page to file google-maps-api.js
3. Add path to this file to your files array in karma.config

Rowden

I can see the link is the map code. Why would somebody paste half of it? In other words what's with the loud "ALL"? Why doesn't this just work by putting the link references in files? What if you need to use the google maps license? Is that the only version of the map code? So many issues with this dismissive "just to this" solution with no explanation. – Nedneda

Would you mind showing me an example of how it's mocked in the actual unit test? my unit test is failing with the following: Google maps library can not be found. I added the line in the .conf and created the file – Gopak

Answer 2

In my case in the files section of karma.conf.js I needed the google api with "js" extension (not .ts!):

 files:[
          'src/app/shared/mocks/google-api.js'
      ],

I have copied and pasted the real google API from the url: "https://maps.googleapis.com/maps/api/js?sensor=false"

If you pass the url it won´t work. It´s not the a cool solution, but for now it works at least.

Muster