Core: Unit test Karma/jasmine: error while loading json language files

Created on 17 Nov 2016  路  9Comments  路  Source: ngx-translate/core

I'm submitting a ... (check one with "x")

[x ] bug report => check the FAQ and search github for a similar issue or PR before submitting
[ ] support request => check the FAQ and search github for a similar issue before submitting
[ ] feature request

Current behavior
while running the unit tests with angular-cli ( command ng-test) , my tests fail because the loader of Karma doesn t handle correcterly the /i18n/*.json files. The following exception is returned:

Uncaught SyntaxError: Unexpected token : at src/assets/i18n/en.json

Expected/desired behavior
This behavior occurs only when I try to run unit tests. Otherwise my application works perfectly fine. ng2-translate should be compatible with karma/jasmine and we shouldn t get exception while loading *json files

Reproduction of the problem
If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:btpW3l0jr5beJVjohy1Q).

run a karma unit test on a component containing the translate filter

What is the expected behavior?

What is the motivation / use case for changing the behavior?
I cannot test anymore my components which use ng translate

Please tell us about your environment:

  • ng2-translate version: 3.1.3

  • Angular version: 2.1.0

  • Browser: [Chrome]

  • Language: [TypeScript 2.0]

TODO docs questiosupport

Most helpful comment

Hello,
can someone provide an example translate application with unit test (i.e., test the translated values from json).

All 9 comments

Hello,

karma serves files from a different route than your application does.

You have two options to resolve this problem:

  • use MockBackend to simulate the webserver for the http request that will load the i18n json file, and return it from its real location (using node require)
  • define the correct the assets location (the one that karma will serve) when you define the TranslateLoader in the TranslateModule

I think that the MockBackend solution is the best, because you don't want to do real requests in unit tests. Your point is not to test the loader but to test that your application works well with it. Also the MockBackend gives you plenty of testing options (such as simulating a delay for the request).

Hello ocombe,

thank you very much for your answer. Indeed I m not planning to test the loader but I thought that ng2-translate will be supported by the loader.
You ve just suggested a nice workaround , I think it should be documented since I m pretty sure that everyone who uses ng2-translate and tries to unit test a component has encountered the same issue

That's true. I should add a test with that and it could serve as a documentation.

Thanks a lot for this library and for your help as well

+1

Hello,
can someone provide an example translate application with unit test (i.e., test the translated values from json).

+1

When I'm trying to fetch a DOM element string, i'm getting whitespace string like ' '
Im using translate pipe for translate

Was this page helpful?
0 / 5 - 0 ratings