Is it possible to mix Testacular (Karma) with angular-scenario?

Question

Testacular (now Karma) is awesome, so is angular-scenario. Using them together is proving a challenge however. There is an ANGULAR-SCENARIO-ADAPTER in Testacular, but that breaks simple tests. If you include angular-scenario.js yourself Testacular will run no tests at all. Has anyone got this running properly?

ANGULAR-SCENARIO-ADAPTER

I've tried to use this with a trivial test, but I saw some weird behavior:

Test:

describe('Simple', function(){
    it('should compare strings', function(){
        expect('foo').toBe('foo');
    });
});

Normal behavior with config:

files = [
  JASMINE,
  JASMINE_ADAPTER,
//    ANGULAR_SCENARIO,
//    ANGULAR_SCENARIO_ADAPTER,
    'tests/lib/angular/angular.js',

    'tests/sample.js'
];

output:

$ testacular start
info: Testacular server started at http://localhost:9876/
info (launcher): Starting browser ChromeCanary
info (Chrome 25.0): Connected on socket id KRwEUtKtiaJs3MoiEsNg
Chrome 25.0: Executed 1 of 1 SUCCESS (0.061 secs / 0.003 secs)

When adding the ANGULAR adapter config:

files = [
  JASMINE,
  JASMINE_ADAPTER,
    ANGULAR_SCENARIO,
    ANGULAR_SCENARIO_ADAPTER,
    'tests/lib/angular/angular.js',

    'tests/sample.js'
];

output is:

$ testacular start
info: Testacular server started at http://localhost:9876/
info (launcher): Starting browser ChromeCanary
info (Chrome 25.0): Connected on socket id 5YZA2fSuNXjmI-yRFGF6
Chrome 25.0 Simple should compare strings FAILED
        expect undefined toBe "foo"
        /Users/iwein/projects/epec/spa/tests/sample.js:3:9: expected "foo" but was undefined
Chrome 25.0: Executed 1 of 1 (1 FAILED) (0.195 secs / 0.018 secs)

Adding angular-scenario.js and hoping JASMINE-ADAPTER can handle it.

I've also tried to include angular-scenario.js myself, but that's a dead end.

//inside testacular.conf.js
files = [
   JASMINE,
   JASMINE_ADAPTER,
   'tests/lib/angular/angular.js',
   'tests/sample.js'
];

I get output:

$ testacular start
info: Testacular server started at http://localhost:9876/
info (launcher): Starting browser ChromeCanary
info (Chrome 24.0): Connected on socket id uEzVQ6tqSu7M7tak4F6v
Chrome 24.0 Array #indexOf() should return -1 when the value is not present FAILED
    Expected true to be false.
    Error: Expected true to be false.
        at null.<anonymous> (/..../tests/sample.js:4:17)
Chrome 24.0: Executed 1 of 1 (1 FAILED) (0.07 secs / 0.004 secs)

If I add angular-scenario in the mix:

//inside testacular.conf.js
files = [
  JASMINE,
  JASMINE_ADAPTER,
  'tests/lib/angular/angular.js',
  'tests/lib/angular/angular-scenario.js',
  'tests/sample.js'
];

The tests are not run at all:

 $ testacular start
 info: Testacular server started at http://localhost:9876/
 info (launcher): Starting browser ChromeCanary
 info (Chrome 24.0): Connected on socket id GcyCTxuvhyFcCaE14BEP
 Chrome 24.0: Executed 0 of 0 SUCCESS (0.116 secs / 0 secs)

Has anyone got this running properly? What's with the true becoming undefined?

Answer 1

You can't mix the 2 in one testacular configuration. What you should do is to prepare 2 distinct testacular configurations: one for running unit tests and another one for running e2e tests.

Then, you would run testacular twice: firstly to execute unit tests and then e2e tests. Usually I'm running unit tests very, very frequently (on each save!) while e2e tests just before a commmit (since those test run longer). We want to have the fastest possible feedback from unit tests while e2e tests are providing the ultimate safety net and assuring that parts of applications hard to cover with unit tests (navigation, UI etc.) are still working correctly.

This is the technique that AngularJS seed is using, you can see the corresponding definitions here: https://github.com/angular/angular-seed/tree/master/config

Answer 2

The reason true becomes undefined is that you are using angular-scenario's version of expect (not Jasmine's version) which takes a parameter called future that will evaluate to a page element or property once the page has loaded.

Angular-scenario expects the future parameter to be an object with a value property. So when you pass in true it attempts to access true.value which evaluates to undefined.

expect({value: true}).toEqual(true); works fine.