Get json file for karma unit test

Question

I want to get a JSON file in my unit test because I need to have it for my tests but I dont know how I can include the file

I run my test with karma and Jasmine. And my project is created with Angular 2.

The name of my JSON file is 'www/assets/mocks/emptyCalendarData.JSON'.

Does someone know how I can include a JSON file into a spec file?

Thanks

UPDATE

I tried to use HTTP get but then I got a system

let calendarData: Calendar;
http.get('www/assets/mocks/emptyCalendarData.json')
    .map(res => res.json())
    .subscribe(
        data => calendarData = data,
        err => console.log(JSON.stringify(err))
    );

Then I get this error:

ERROR: Error{stack: null, originalErr: TypeError{stack: 'mergeOptions
get


eval code
eval@[native code]
__exec@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:1482:16
execute@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:3896:22
linkDynamicModule@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:3222:36
link@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:3065:28
execute@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:3402:17
doDynamicExecute@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:796:32
link@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:998:36
doLink@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:650:11
updateLinkSetOnLoad@http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:698:24
http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624:510:30
invoke@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:364:34
run@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:257:50
http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:609:61
invokeTask@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:397:43
runTask@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:294:58
drainMicroTaskQueue@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:515:43
invoke@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:467:41
http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:92:33
invokeTask@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:397:43
runTask@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:294:58
invoke@http://localhost:9876/base/node_modules/zone.js/dist/zone.js?b9a84410301a475a439d6b7b4e7eff0954f5b925:464:41', line: 38}, line: 821, sourceURL: 'http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?18a094f61af9f2ec0577ca3a337760d97719b624'}

Answer 1

There are many ways to do that:

• import json if it is inside of your app: import * as json from './test'; //will import test.json
• download file using Http and do map(res=>res.json())
• for webpack use json-loader plugin: var json = require('./my.json')
• for gulp/grunt etc. you could write code generator

Answer 2

I stash my Mock JSON data into a ts file like a variable. i.e

export var getMockResponseJSON = { 'key': value };

Later when I want to reach this variable, I simply import it like:

import {getMockResponseJSON} from "../JSONs";

and use it in my class

expect(getMockResponseJSON.key).not.toEqual(1);

Answer 3

You could leverage the Http class of Angular2 within your tests to do that.

Here is a sample within a beforeAll function:

beforeAll((done) => {
  let injector = Injector.resolveAndCreate([ HTTP_PROVIDERS ]);
  let http = injector.get(Http);
  http.get('app/data.json').subscribe(
    (data) => {
      this.data = data.json();
      done();
    }
  );
});

See this plunkr: https://plnkr.co/edit/k6jxHf?p=preview.