Ability to serve and load mocks / stubs for AJAX testing

I use stubs to develop against when services aren’t available or are down. These stubs accurately reflect the data structure available from remote API’s in production and are used to provide data to the UI when developing wireframes.

These stubs should also be available to my unit tests for me to ensure that the UI is updated and reflects data in the stub the same way that they would be used in a development setting.

Currently, Karma only serves the specific files defined in karma.conf’s files configuration. Adding .json files generates script exceptions, but allows the server to serve them, however it also prevents the tests from running.

Ideally there should be a way to serve up files that can be accessed during test execution, without having those files included as scripts.

perhaps:

"mappings": {
    "stubs": "src/main/stubs/**/*.json"
}

Any request to /stubs/ provides the requested file.

For example:

var promise = $http({"url": "/stubs/myfile.json"});

[jayproulx]

These are all workarounds but don’t address the underlying issue which is: we may need to test arbitrary resource loading. The cleanest solution would be to say “I need these particular files, please serve them”, as I suggested above. Fixtures doesn’t resolve the issue of testing AJAX logic, this is a pretty straightforward fix, Karma already has similar syntax, just no way of serving arbitrary files.

If the list of files changes frequently, or the code that is being tested will automatically reach out to these files then we’re spending our time maintaining Karma and preprocessors, rather than focusing on the business logic that makes us money.

Since Karma is already responsible for serving files, the easiest solution is to have Karma serve the files, rather than needing to re-implement this solution every time we spin up a new project.

[kenglxn]

I did what you suggested @vojtajina and created a preprocessor for json files (https://github.com/kenglxn/karma-json2js-preprocessor). It is a carbon copy of your html2js preprocessor.

After that exercise I realized that the html2js preprocessor would work fine for json as well, and all I really needed to do was to reuse you html2js preprocessor and define json files as well:

preprocessors: {
    '**/*.html': ['html2js'],
    '**/*.json': ['html2js']
},

after this the content of the json file is available from the html global.