Unit test Karma -Unknown provider

[IssamEssarghini033]

I'm writing unit tests for my project built on Angularjs with Karma-jasmine.

I'm trying to unit test a controller which depends on the angular-xeditable library. But I'm facing the error below :

Error: [$injector:unpr] Unknown provider: editableThemesProvider <- editableThemes

I have already added the path of x-editable my in Karma config file :

files:[ 
    ...
    { pattern: '../../libs/angular/angular-xeditable/dist/js/xeditable.min.js', watched: false },
     ...
    ]

Below the spec file :

beforeEach(inject(function(_$controller_, $rootScope, $localStorage, _editableThemes_, _editableOptions_) {
 localStorage = $localStorage;
 $controller = _$controller_;
 editThemes = _editableThemes_;
 editOptions = _editableOptions_;
 scope = $rootScope.$new();
 leaderboardCtrl = $controller('LeaderboardCtrl', {
  $scope: scope,
  $modal : modal,
  $q: q,
  editableOptions: editOptions,
  editableThemes: editThemes,
  $localStorage: localStorage,
  LeaderBoardService : leaderboardService
});
}));

And this is my controller file :

  leaderboardCtrl.$inject = [..., 'editableOptions', 'editableThemes', ...];

function leaderboardCtrl  ( ...,  editableOptions,   editableThemes, ...) {
...
  editableThemes.bs3.inputClass = 'input-sm';
  editableThemes.bs3.buttonsClass = 'btn-sm';
  editableOptions.theme = 'bs3';
...

What am I doing wrong? did i missed something?

[ckosloski]

Does your app work correctly, just the tests fail?

[IssamEssarghini033]

@ckosloski yeah the app works properly 👍

[ckosloski]

How are you injecting xeditable into your tests?

[IssamEssarghini033]

i've added the path of xeditable in my karma conf file, and i inject it by

beforeEach(inject(function(..., _editableThemes_, _editableOptions_) {

editThemes = _editableThemes_;
 editOptions = _editableOptions_;

Because in my Controller i'm usiing editableThemes and editableOptions services that's why I injected them.

[ckosloski]

Don't you need to inject xeditable? How do you inject xeditable into your application?

[IssamEssarghini033]

Actually i'm using oc.lazyload, when i redirect to the view where i'm using xeditable, i load it in my router config by :

resolve: load([
  'xeditable',

and on lazyload config i have :

{
          name: 'xeditable',
          files: [
              'libs/angular/angular-xeditable/dist/js/xeditable.min.js',
              'libs/angular/angular-xeditable/dist/css/xeditable.min.css'
          ]
      },

On My controller i inject only editableThemes and editableOptions. and it works fine.

[ckosloski]

I am not familiar with this, but I would think that you would still need to load xeditable in your test somehow (unless you are saying lazyload does that for your test as well)

[ckosloski]

@IssamEssarghini033 did you ever figure out your problem?