Using SystemJs module loader

[jfstephe]

Hi, Given I have a class ('classA') that in the production app was loaded using SystemJs. Is it possible to configure your tool to load the step definitions using systemJs (and my config for it) and for those step definitions to in turn load 'classA' (the System Under Test) using systemJs?

I think I'm asking for a joining of the functionality with this module.

Any thoughts/suggestions?

Thanks, John

[eugene-sea]

This is an example on how to use System.js with this plugin: https://github.com/eugene-sea/Savings/blob/angular2/test/client/karma.conf.js

[jfstephe]

Thanks. FYI, it didn't build/run out of the box for me. I needed to add 'node_modules/systemjs/dist/system-polyfills.js', to the file list else I got 'Can't find variable: System'. Seems to be working now.... but I think it's a little bit of a fudge ATM though. The test-shim.js loading the ts files, feels a bit icky. Would be nice to have it pick up a glob pattern from the karam config file. Any ideas?

[jfstephe]

Hi, For the record, I finally! got there. In general there are no issues with this running alongside the karma-jspm plugin (karma-systemjs plugin looks to be dying). In my configuration I keep my tests next to the production code rather than in a separate folder structure and the karma config file I used is below.

The thing that was killing me was I am using the 'aurelia' framework and that caused me to have Map and other polyfill errors. This was solved by using this tip, which is why you see a 'test/setup.ts' file in the config below.

I'm also using the "ts" (github:frankwallis/plugin-typescript@7.0.6") plugin in it's standard documented configuration, although I'm not 100% convinced this is needed.

Hope this helps someone! I'll close this issue now :-). John

module.exports = function(config) {
  config.set({
    basePath: './',
    frameworks: ['cucumber-js', 'jspm'],
    files: [ ],
    jspm: {
      config: "config.test.js",
      loadFiles: [ 'test/setup.ts', 'src/**/*.steps.ts'],
      serveFiles: [ 'src/**/*!(steps).ts', 'src/**/*.json', 'src/**/*.feature']
    },
    junitReporter: {
      outputDir: 'test/results', // results will be saved as $outputDir/$browserName.xml
      outputFile: 'karmaTests.xml', // if included, results will be saved as $outputDir/$browserName/$outputFile
      suite: '', // suite will become the package name attribute in xml testsuite element
      useBrowserName: false, // add browser name to report and classes names
      nameFormatter: undefined, // function (browser, result) to customize the name attribute in xml testcase element
      classNameFormatter: undefined, // function (browser, result) to customize the classname attribute in xml testcase element
      properties: {}, // key value pair of properties to add to the <properties> section of the report
      xmlVersion: null // use '1' if reporting to be per SonarQube 6.2 XML format
    },
    exclude: [],
    preprocessors: {
    },
    proxies : {
      "/src" : "/base/src", 
      "/test" : "/base/test", 
      "/jspm_packages" : "/base/jspm_packages",
      "/node_modules": "/base/node_modules"
    },
    reporters: ['mocha', 'junit'],/*Look at bdd-json too?*/
    port: 9876,
    colors: true,
    logLevel: config.LOG_DEBUG,
    autoWatch: true,
    browsers: ['PhantomJS'],
    singleRun: false,
    captureTimeout: 60000,
    browserDisconnectTimeout: 30000,
    browserDisconnectTolerance: 3,
    browserNoActivityTimeout: 60000
  })
}