search

monounity / karma-typescript

Simplifying running unit tests with coverage for Typescript projects.
314 stars 109 forks source link

Karma errors when compiling using tsconfig.json with alternately mapped paths #43

Closed BergerLand closed 7 years ago

BergerLand commented 7 years ago

tsconfig.json

{
  "compilerOptions": {
    "target": "ES5",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "noEmitHelpers": true,
    "baseUrl": "./src",
    "paths": {
      "cart/*": [ "app/cart/*" ],
      "customer/*": [ "app/customer/*" ],
      "device/*": [ "app/device/*" ],
      "services/*": [ "app/shared/services/*" ],
      "components/*": [ "app/shared/components/*" ],
      "mocks/*": [ "app/shared/mocks/*" ]
    }
  },
  "compileOnSave": false,
  "buildOnSave": false,
  "awesomeTypescriptLoaderOptions": {
    "forkChecker": true,
    "useWebpackText": true
  }
}

Console output when running NPM test

05 12 2016 14:47:11.596:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

webpack: bundle is now VALID.
webpack: bundle is now INVALID.
05 12 2016 14:47:17.320:INFO [compiler.karma-typescript]: Compiled 136 files in 4791 ms.
05 12 2016 14:47:19.749:ERROR [karma]: Error: Cannot find module 'services/api' from '/Users/pberger/Local Repo/Modesto/retail-ui/src/app'
    at Function.module.exports [as sync] (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/resolve/lib/sync.js:33:11)
    at Function.resolve.sync (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/browser-resolve/index.js:321:21)
    at resolveModules (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/karma-typescript/lib/bundlers/builtin/bundler.js:192:45)
    at /Users/pberger/Local Repo/Modesto/retail-ui/node_modules/karma-typescript/lib/bundlers/builtin/bundler.js:85:21
    at Array.forEach (native)
    at /Users/pberger/Local Repo/Modesto/retail-ui/node_modules/karma-typescript/lib/bundlers/builtin/bundler.js:81:36
    at Array.forEach (native)
    at /Users/pberger/Local Repo/Modesto/retail-ui/node_modules/karma-typescript/lib/bundlers/builtin/bundler.js:77:21
    at invokeFunc (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/lodash.debounce/index.js:160:19)
    at trailingEdge (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/lodash.debounce/index.js:207:14)
    at Timeout.timerExpired [as _onTimeout] (/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/lodash.debounce/index.js:195:14)
    at ontimeout (timers.js:365:14)
    at tryOnTimeout (timers.js:237:5)
    at Timer.listOnTimeout (timers.js:207:5)
npm ERR! Test failed.  See above for more details.
monounity commented 7 years ago

Hey @PhillipBerger-BSFT, does it work if you try the latest from main now?

BergerLand commented 7 years ago

@monounity I think we might be getting closer based on an extra step completing successfully, but then it barfs:

06 12 2016 10:06:43.444:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

webpack: bundle is now VALID.
webpack: bundle is now INVALID.
06 12 2016 10:06:48.684:INFO [compiler.karma-typescript]: Compiled 136 files in 4388 ms.
06 12 2016 10:06:51.299:INFO [builtin-bundler.karma-typescript]: Bundled imports for 137 file(s) in 711 ms.

ERROR in ./src/app/app.component.spec.ts
Module not found: Error: Can't resolve 'services/api' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app'
 @ ./src/app/app.component.spec.ts 5:12-35
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/cart/cart-container/cart-container.component.ts
Module not found: Error: Can't resolve 'services/cart' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/cart/cart-container'
 @ ./src/app/cart/cart-container/cart-container.component.ts 9:123-147
 @ ./src/app/cart/cart-container/cart-container.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/cart/cart-cost/cart-cost.component.ts
Module not found: Error: Can't resolve 'services/cart/cart' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/cart/cart-cost'
 @ ./src/app/cart/cart-cost/cart-cost.component.ts 9:123-152
 @ ./src/app/cart/cart-cost/cart-cost.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-info/device-info.component.ts
Module not found: Error: Can't resolve 'services/cart/cart.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-info'
 @ ./src/app/device/device-info/device-info.component.ts 9:285-322
 @ ./src/app/device/device-info/device-info.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-search/device-search.component.ts
Module not found: Error: Can't resolve 'services/logger' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-search'
 @ ./src/app/device/device-search/device-search.component.ts 9:298-324
 @ ./src/app/device/device-search/device-search.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/cart/cart-summary/cart-summary.component.ts
Module not found: Error: Can't resolve 'services/customer-device/customer-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/cart/cart-summary'
 @ ./src/app/cart/cart-summary/cart-summary.component.ts 9:142-201
 @ ./src/app/cart/cart-summary/cart-summary.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-info/device-info.component.ts
Module not found: Error: Can't resolve 'services/customer-device/customer-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-info'
 @ ./src/app/device/device-info/device-info.component.ts 9:391-450
 @ ./src/app/device/device-info/device-info.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-options/device-options.component.ts
Module not found: Error: Can't resolve 'services/customer-device/customer-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-options'
 @ ./src/app/device/device-options/device-options.component.ts 9:142-201
 @ ./src/app/device/device-options/device-options.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-search/device-search.component.ts
Module not found: Error: Can't resolve 'services/customer-device/customer-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-search'
 @ ./src/app/device/device-search/device-search.component.ts 9:518-577
 @ ./src/app/device/device-search/device-search.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/customer/customer-info/customer-info.component.ts
Module not found: Error: Can't resolve 'mocks/mock' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/customer/customer-info'
 @ ./src/app/customer/customer-info/customer-info.component.ts 9:123-144
 @ ./src/app/customer/customer-info/customer-info.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/customer/customer-lines/customer-lines.component.ts
Module not found: Error: Can't resolve 'mocks/mock' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/customer/customer-lines'
 @ ./src/app/customer/customer-lines/customer-lines.component.ts 9:123-144
 @ ./src/app/customer/customer-lines/customer-lines.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/customer/customer-show/customer-show.component.ts
Module not found: Error: Can't resolve 'mocks/mock' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/customer/customer-show'
 @ ./src/app/customer/customer-show/customer-show.component.ts 9:123-144
 @ ./src/app/customer/customer-show/customer-show.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/customer/customer-info/customer-info.component.ts
Module not found: Error: Can't resolve 'mocks/mock.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/customer/customer-info'
 @ ./src/app/customer/customer-info/customer-info.component.ts 9:202-231
 @ ./src/app/customer/customer-info/customer-info.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-brands/device-brands.component.ts
Module not found: Error: Can't resolve 'services/catalog-device/catalog-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-brands'
 @ ./src/app/device/device-brands/device-brands.component.ts 9:141-198
 @ ./src/app/device/device-brands/device-brands.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-search/device-search.component.ts
Module not found: Error: Can't resolve 'services/catalog-device/catalog-device.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-search'
 @ ./src/app/device/device-search/device-search.component.ts 9:392-449
 @ ./src/app/device/device-search/device-search.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js

ERROR in ./src/app/device/device-options/device-options.component.ts
Module not found: Error: Can't resolve 'services/navigation/button-navigation.service' in '/Users/pberger/Local Repo/Modesto/retail-ui/src/app/device/device-options'
 @ ./src/app/device/device-options/device-options.component.ts 9:272-328
 @ ./src/app/device/device-options/device-options.component.spec.ts
 @ ./src \.spec\.ts
 @ ./config/karma-shim.js
webpack: bundle is now VALID.
06 12 2016 10:07:07.380:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
06 12 2016 10:07:07.380:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
06 12 2016 10:07:07.507:INFO [launcher]: Starting browser PhantomJS
06 12 2016 10:07:08.369:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#qcVbsfnYJxRuqeoJAAAA with id 91251178
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  SyntaxError: Unexpected token '.'
  at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-3014CnQ1wIJdTWGN.js:88941

npm ERR! Test failed.  See above for more details.
monounity commented 7 years ago

These errors look like webpack errors, are you using webpack in your Karma config? Karma-typescript should automatically bundle everything needed for the unit test run, hopefully eliminating the need for a production bundling tool when running the unit tests.

BergerLand commented 7 years ago

Yes. Which parts can I remove from the karma config?


  var testWebpackConfig = require('./webpack.test.js');
  var ENV = process.env.npm_lifecycle_event;
  var isTestWatch = ENV === 'test-watch';
  var configuration = {

      basePath: '',
      frameworks: ['jasmine'],
      exclude: [],
      files: [ { pattern: './config/karma-shim.js', watched: false }],

      // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      './config/karma-shim.js': ['webpack', 'sourcemap']
    },
    webpack: testWebpackConfig,

    coverageReporter: {
    type: 'in-memory'
    },

    remapCoverageReporter: {
    'text-summary': null,
    json: './coverage/coverage-final.json',
    html: './coverage/html'
  },

    webpackMiddleware: {
      // webpack-dev-middleware configuration
      // i. e.
      stats: 'errors-only'
    },

    webpackServer: {
  noInfo: true // please don't spam the console when running in karma!
},

// test results reporter to use
// possible values: 'dots', 'progress', 'mocha'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ["mocha"],

// web server port
port: 9876,

// enable / disable colors in the output (reporters and logs)
colors: true,

// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,

// enable / disable watching file and executing tests whenever any file changes
autoWatch: false,

// start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: isTestWatch ? ['Chrome'] : ['PhantomJS'],

// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true
};

if (!isTestWatch) {
   configuration.reporters.push("coverage");

   configuration.coverageReporter = {
     dir: 'coverage/',
     reporters: [{
       type: 'json',
       dir: 'coverage',
       subdir: 'json',
       file: 'coverage-final.json'
     }]
   };
 }

config.set(configuration);
}```
monounity commented 7 years ago

Here's my take on your Karma conf:

(I've taken the liberty of removing some default stuff for this example)

module.exports = function(config) {

    var ENV = process.env.npm_lifecycle_event;
    var isTestWatch = ENV === "test-watch";

    var configuration = {

        frameworks: ["jasmine", "karma-typescript"],

        files: [
            { pattern: "path-to-your-src/**/*.ts" },
        ],

        preprocessors: {
            "src/**/*.ts": ["karma-typescript"],
        },

        reporters: ["mocha"],

        karmaTypescriptConfig: {
            reports:
            {
                "text-summary": null,
                "json": "./coverage/coverage-final.json",
                "html": "./coverage/html"
            }
        },

        logLevel: config.LOG_INFO,
        autoWatch: false,
        browsers: isTestWatch ? ["Chrome"] : ["PhantomJS"],
        singleRun: true
    };

    if (!isTestWatch) {
        configuration.reporters.push("karma-typescript");
    }

    config.set(configuration);
};
BergerLand commented 7 years ago

@monounity @erikbarke Alright. Did more clean up.

module.exports = function(config) {
  var ENV = process.env.npm_lifecycle_event;
  var isTestWatch = ENV === 'test-watch';
  var configuration = {

    frameworks: ['jasmine', 'karma-typescript'],
    files: [ { pattern: 'src/**/*.ts' } ],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      '**/*.ts': ['karma-typescript']
    },

    coverageReporter: {
      type: 'in-memory'
    },

    karmaTypescriptConfig: {
      tsconfig: './tsconfig.json',
      reports: {
        "text-summary": null,
        "json": "./coverage/coverage-final.json",
        "html": "./coverage/html"
      }
    },

    // test results reporter to use
    // possible values: 'dots', 'progress', 'mocha'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['mocha', 'karma-typescript'],

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: isTestWatch ? ['Chrome'] : ['PhantomJS'],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: true
  };

  if (!isTestWatch) {
    configuration.reporters.push('karma-typescript');
  }

  config.set(configuration);

}
07 12 2016 09:54:04.810:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
07 12 2016 09:54:09.336:INFO [compiler.karma-typescript]: Compiled 136 files in 3927 ms.
07 12 2016 09:54:10.450:INFO [builtin-bundler.karma-typescript]: Bundled imports for 137 file(s) in 587 ms.
07 12 2016 09:54:10.977:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
07 12 2016 09:54:10.977:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
07 12 2016 09:54:10.984:INFO [launcher]: Starting browser PhantomJS
07 12 2016 09:54:11.740:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#3qKVwJI1r8gtMKsOAAAA with id 13188262
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR

> SyntaxError: Unexpected token '.'
>   at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-4081kP8G8QCoTgP4.js:88941
> 

Finished in 0.205 secs / 0 secs

SUMMARY:
✔ 0 tests completed
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app-routing.module.js:1:15 <- src/app/app-routing.module.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app.component.js:1:15 <- src/app/app.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.952:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app.component.spec.js:1

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app.module.js:1:15 <- src/app/app.module.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-container/cart-container.component.js:1:15 <- src/app/cart/cart-container/cart-container.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.960:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-container/cart-container.component.spec.js:1

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-container/index.js:1:15 <- src/app/cart/cart-container/index.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-cost/cart-cost.component.js:1:15 <- src/app/cart/cart-cost/cart-cost.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.964:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-cost/cart-cost.component.spec.js:1

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-cost/index.js:1:15 <- src/app/cart/cart-cost/index.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-routing.module.js:1:15 <- src/app/cart/cart-routing.module.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-summary/cart-summary.component.js:1:15 <- src/app/cart/cart-summary/cart-summary.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.969:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-summary/cart-summary.component.spec.js:1

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart-summary/index.js:1:15 <- src/app/cart/cart-summary/index.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/cart.module.js:1:15 <- src/app/cart/cart.module.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/cart/index.js:1:15 <- src/app/cart/index.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/customer/customer-info/customer-info.component.js:1:15 <- src/app/customer/customer-info/customer-info.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.976:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/customer/customer-info/customer-info.component.spec.js:1

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/customer/customer-info/index.js:1:15 <- src/app/customer/customer-info/index.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/customer/customer-lines/customer-lines.component.js:1:15 <- src/app/customer/customer-lines/customer-lines.component.js:9

✖ Error while running the tests! Exit code: 1

07 12 2016 09:54:11.979:WARN [reporter]: SourceMap position not found for trace: undefined
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/customer/customer-lines/customer-lines.component.spec.js:1

✖ Error while running the tests! Exit code: 1

npm ERR! Test failed.  See above for more details.
monounity commented 7 years ago

Can you take a look inside the generated bundle file and see what happens at (and around) line 88941?

> SyntaxError: Unexpected token '.'
>   at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-4081kP8G8QCoTgP4.js:88941
>

This is what's making the test run crash, the rest of the errors seem to be caused by this.

BergerLand commented 7 years ago

@monounity line 88941 is windows.wrappers etc below

names.push('/Users/pberger/Local Repo/Modesto/retail-ui/src/vendor.browser.ts');
window.wrappers['/Users/pberger/Local Repo/Modesto/retail-ui/node_modules/flexboxgrid/dist/flexboxgrid.css']=[function(require,module,exports,__dirname,__filename){ .container-fluid,
.container {
  margin-right: auto;
  margin-left: auto;
}
BergerLand commented 7 years ago

@monounity I removed flexbox from the package json and references in the project and rebuilt but still got this error:

08 12 2016 14:22:19.501:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
08 12 2016 14:22:24.604:INFO [compiler.karma-typescript]: Compiled 144 files in 4470 ms.
08 12 2016 14:22:25.774:INFO [builtin-bundler.karma-typescript]: Bundled imports for 145 file(s) in 643 ms.
08 12 2016 14:22:26.390:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
08 12 2016 14:22:26.390:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
08 12 2016 14:22:26.407:INFO [launcher]: Starting browser PhantomJS
08 12 2016 14:22:27.345:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#2KrN_OpeoTu-1EqYAAAA with id 34064310
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: Map
  at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-20389SLiaRD8GtEg8.js:94198

Finished in 0.421 secs / 0 secs

SUMMARY:
✔ 0 tests completed
npm ERR! Test failed.  See above for more details.

Looked in the file and found this at 94198:

 /**
     * @internal
     */
    var KeyRegistry = (function () {
        function KeyRegistry() {
            this._allKeys = new Map();
        }
        KeyRegistry.prototype.get = function (token) {
            if (token instanceof ReflectiveKey)
                return token;
            if (this._allKeys.has(token)) {
                return this._allKeys.get(token);
            }
            var newKey = new ReflectiveKey(token, ReflectiveKey.numberOfKeys);
            this._allKeys.set(token, newKey);
            return newKey;
        };
        Object.defineProperty(KeyRegistry.prototype, "numberOfKeys", {
            get: function () { return this._allKeys.size; },
            enumerable: true,
            configurable: true
        });
        return KeyRegistry;
    }());
monounity commented 7 years ago

@PhillipBerger-BSFT, thanks to this issue I've found some nasty bugs where bundled modules got duplicated, so thanks 😃

Newer versions of Chrome already have native support for Maps, Promise etc, but you need an ES6 Polyfill for PhantomJS.

You can either do an import "es6-shim" somewhere in your code or add it to the files section of your Karma conf, pattern: "node_modules/es6-shim/es6-shim.js" }, your choice!

BergerLand commented 7 years ago

Added the es6-shim in and referenced it in files section of karma conf...

Still getting this error in 9c8e977033d00f77be72b2d2f32530370fe7d99c commit:

09 12 2016 08:52:04.735:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
09 12 2016 08:52:09.759:ERROR [compiler.karma-typescript]: src/app/shared/services/mock-backend/mock
Backend.service.ts(104,87): error TS2339: Property 'id' does not exist on type 'BrandService'.

09 12 2016 08:52:10.129:INFO [compiler.karma-typescript]: Compiled 147 files in 4788 ms.
09 12 2016 08:52:11.210:INFO [builtin-bundler.karma-typescript]: Bundled imports for 148 file(s) in
562 ms.
09 12 2016 08:52:11.807:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
09 12 2016 08:52:11.807:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
09 12 2016 08:52:11.817:INFO [launcher]: Starting browser PhantomJS
09 12 2016 08:52:12.632:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#SFZyPA4Kz_0J0
HY2AAAA with id 9653349
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  SyntaxError: Unexpected token '.'
  at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-2568BEHxCDxxDO5j.js:87
162

Finished in 0.193 secs / 0 secs

SUMMARY:
✔ 0 tests completed
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app-routing.module.js:1:15 <- src/app/app-routing.module.js:9

✖ Error while running the tests! Exit code: 1

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not an object (evaluating 'window.wrappers')
  at src/app/app.component.js:1:15 <- src/app/app.component.js:9
monounity commented 7 years ago

Great, that seem to have taken care of the Can't find variable: Map issue! This new error, is it the same flexboxgrid css problem as before, could you take a look at line 87 162? Out of curiosity, are you importing styles or other non Typescript content using the paths option in tsconfig? If that's the case I'll add support for it.

BergerLand commented 7 years ago

@monounity yes this indeed is still the flex box issue.

As for using the paths, I am not importing anything other than Typescript as of now, but I don't see why you couldn't support other files types if it's not too much trouble.

Again, really thanks for all your help on this!

monounity commented 7 years ago

I was able to reproduce the flexboxgrid error with this: import "flexboxgrid";. The resolver looks in package.json for all required modules and the flexboxgrid module specifies "dist/flexboxgrid.css" as its main entrypoint, that's why the css gets bundled. I've added a catch-all-non-script-content for this, does it work for you with the latest from main now?

BergerLand commented 7 years ago

@monounity pretty late here and about to drift off to sleep. Let me check it in the AM and I'll get back to you!

BergerLand commented 7 years ago

@monounity

Almost there:

10 12 2016 10:53:02.520:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
10 12 2016 10:53:07.153:INFO [compiler.karma-typescript]: Compiled 147 files in 4021 ms.
10 12 2016 10:53:08.247:INFO [builtin-bundler.karma-typescript]: Bundled imports for 148 file(s) in
572 ms.
10 12 2016 10:53:08.840:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
10 12 2016 10:53:08.841:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
10 12 2016 10:53:08.852:INFO [launcher]: Starting browser PhantomJS
10 12 2016 10:53:09.689:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#NqUvQX_4PrKb0
ePLAAAA with id 88921787
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  TypeError: undefined is not a constructor (evaluating 'Reflect.getMetadata('parameters', cls)')
  at /var/folders/m8/wd2tbth52bz3d79fhtln5cjh0000gn/T/karma-typescript-bundle-19632fUVapi4aWZBb.js:3
437

Finished in 0.363 secs / 0 secs

SUMMARY:
✔ 0 tests completed
npm ERR! Test failed.  See above for more details.

From the bundle...

   ParamDecorator.annotation = annotationInstance;
            return ParamDecorator;
            function ParamDecorator(cls, unusedKey, index) {
                var parameters = Reflect.getMetadata('parameters', cls) || [];
                // there might be gaps if some in between parameters do not have annotations.
                // we pad with nulls.
                while (parameters.length <= index) {
                    parameters.push(null);
                }
                parameters[index] = parameters[index] || [];
                parameters[index].push(annotationInstance);
                Reflect.defineMetadata('parameters', parameters, cls);
                return cls;
            }
            var _a;
        }
        if (parentClass) {
            ParamDecoratorFactory.prototype = Object.create(parentClass.prototype);
        }
        ParamDecoratorFactory.prototype.toString = function () { return ("@" + name); };
        ParamDecoratorFactory.annotationCls = ParamDecoratorFactory;
        return ParamDecoratorFactory;
    }
monounity commented 7 years ago

Has reflect-metadata been loaded? There's an example in the Angular2 example project where it's loaded through karma.conf.js in base.spec.ts.

BergerLand commented 7 years ago

@monounity reflect-metadata has been loaded using the same pattern in your example. Still having the error.

monounity commented 7 years ago

If you hadn't loaded it you would have gotten the error reflect-metadata shim is required when using class decorators, hmm... What happens if you debug using Chrome instead of PhantomJS and put a breakpoint in the bundle file, what does the parameter cls sent to Reflect.getMetadata('parameters', cls) look like?

monounity commented 7 years ago

Is this a PhantomJS bug?

BergerLand commented 7 years ago

After the bundle was created with the above mentioned Reflect error, I set the karma config to test that bundle again, this time with a console.log(cls) at that error. Now all I'm getting is:

12 12 2016 10:08:14.878:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
12 12 2016 10:08:19.535:INFO [compiler.karma-typescript]: Compiled 148 files in 4117 ms.
12 12 2016 10:08:20.298:INFO [builtin-bundler.karma-typescript]: Bundled imports for 2 file(s) in 246 ms.
12 12 2016 10:08:20.344:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
12 12 2016 10:08:20.344:INFO [launcher]: Launching browser Chrome with unlimited concurrency
12 12 2016 10:08:20.357:INFO [launcher]: Starting browser Chrome
12 12 2016 10:08:21.179:INFO [Chrome 55.0.2883 (Mac OS X 10.12.1)]: Connected on socket /#RcCXTwzrO44erlwsAAAA
Chrome 55.0.2883 (Mac OS X 10.12.1) ERROR
  Uncaught Error: Not found: /Users/pberger/Local Repo/Modesto/retail-ui/src/app/app-routing.module.ts
  at node_modules/karma-typescript/lib/bundlers/builtin/commonjs.js:15

Finished in 0.488 secs / 0 secs

SUMMARY:
✔ 0 tests completed
npm ERR! Test failed.  See above for more details.

and PhantomJS:

12 12 2016 10:09:26.695:INFO [compiler.karma-typescript]: Compiling project using Typescript 2.1.1

START:
12 12 2016 10:09:31.265:INFO [compiler.karma-typescript]: Compiled 148 files in 4035 ms.
12 12 2016 10:09:32.027:INFO [builtin-bundler.karma-typescript]: Bundled imports for 2 file(s) in 250 ms.
12 12 2016 10:09:32.073:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
12 12 2016 10:09:32.073:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
12 12 2016 10:09:32.083:INFO [launcher]: Starting browser PhantomJS
12 12 2016 10:09:33.002:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#obOTMi8WegaP5NVMAAAA with
id 83475486
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  Error: Not found: /Users/pberger/Local Repo/Modesto/retail-ui/src/app/app-routing.module.ts
  at node_modules/karma-typescript/lib/bundlers/builtin/commonjs.js:15

Finished in 0.187 secs / 0 secs

SUMMARY:
✔ 0 tests completed
npm ERR! Test failed.  See above for more details.

Doesn't seem to matter which browser.

monounity commented 7 years ago

It seems the bundle file didn't like that console.log bit, could you try using a fresh bundle and:

I've tried breaking the plugin with PhantomJS and injected parameters in Angular2 but it wont break no matter what try, so I'm thinking the getMetadatafunction is fed something it doesn't like...

BergerLand commented 7 years ago

See below.

screen shot 2016-12-13 at 10 55 51 am

Looks like it's coming from the '@ng-bootstrap/ng-bootstrap' library for Angular 2.

monounity commented 7 years ago

Now we're talking! If you hover with the mouse over .getMetadata, is it defined? I'm gonna try using the same module from ng-bootstrap and see if I can reproduce this error.

Also, the Angular2 example has been updated to use core-js instead of es6-shim/reflect-metadata since core-js provides its own polyfill for Reflect. Maybe you could try using core-js as well, just to check if it works better with PhantomJS? Please note that you have to load core-js using import, it has to be bundled to work properly.

BergerLand commented 7 years ago

Ok... removed es6-shim and installed and imported core-js

screen shot 2016-12-13 at 8 08 08 pm

Looks like .getMetadata is truly undefined.

monounity commented 7 years ago

This is all very strange, if you look for the error message reflect-metadata shim is required when using class decorators in the bundle, you'll see that there's a test for Reflect being present, is something overwriting the reflect polyfill? What's the smallest example you can create that reproduces this error?

BergerLand commented 7 years ago

I have some other work to do today. When I get a chance I'll look back into this.

BergerLand commented 7 years ago

@monounity So Reflect is defined but getMetaData is not...

What the hell is going on?

screen shot 2016-12-15 at 2 44 07 pm

Even at your check it still seems undefined but isn't throwing the error.

screen shot 2016-12-15 at 2 57 02 pm

screen shot 2016-12-15 at 2 57 10 pm

erikbarke commented 7 years ago

The Reflect polyfill doesn't seem to have any of the expected functions, as if it doesn't get initialized properly... Only thing I can think of now is that you create a small test project in a github repo that reproduces this error, otherwise we won't be able to track this bug down.

BergerLand commented 7 years ago

Ok @erikbarke @monounity. I think the scope of this bug has been resolved. Thanks for all your help!

sir-marc commented 7 years ago

I'm running in the same issue now. @PhillipBerger-BSFT what did you do to solve the "module not found" error?

I'm getting this error:

Chrome 54.0.2840 (Windows 7 0.0.0) ERROR Uncaught Error: Can't find js/elements/ActionButton/ActionButton (required by [path to project]/test/elements/ActionButton.spec.tsx) at node_modules/karma-typescript/lib/bundlers/builtin/commonjs.js:14

Any Ideas? My typescript IDEA (VS Code does not complain and these kind of imports work in the application itself.

sir-marc commented 7 years ago

Sorry. Forgot to include the files in Karma. I'm a moron. Ignore my post guys!

erikbarke commented 7 years ago

@ialex90, does your project compile on command line with tsc? If it does, could you run your project with karma-typescriptwith Karma in debug mode, logLevel: config.LOG_DEBUG, and attach the output as a text file here please?

erikbarke commented 7 years ago

@ialex90, the log output you provided isn't from karma-typescript and I see no references to karma-typescript in your repo, neither in karma.conf.js nor in package.json, are you sure you are using karma-typescript?

alejandrocoding commented 7 years ago

@erikbarke No, I am not using karma-typescript I was so focused on the problem with the paths that I didn't realize this is not the right place :( sorry about that