issue with setup babel6 + webpack + karma

[bsr203]

Hi,

can you please let me know whether I am using this plugin wrongly. I have a babel6 + webpack + karma setup. this is my .babelrc

{
  "plugins": [
    "transform-async-to-generator",
    "transform-object-rest-spread",
    "transform-es2015-modules-commonjs",
    "transform-es2015-parameters",
    "transform-es2015-destructuring",
    "babel-plugin-espower"
  ]
}

I see a warning

WARNING in ./~/power-assert-formatter/lib/create.js
Critical dependencies:
35:28-49 the request of a dependency is an expression
 @ ./~/power-assert-formatter/lib/create.js 35:28-49

but I don't see power assert output on assertion failure.

versions

    "babel-plugin-espower": "^2.1.2",
    "power-assert": "^1.3.1",
    "babel": "^6.5.2",
    "babel-core": "^6.6.0",
    "babel-loader": "^6.2.4",

Full stack,

[1300] ./~/power-assert-formatter/lib/string-writer.js 671 bytes {0} [built]
 [1301] ./~/power-assert-formatter/lib/traverse.js 2.53 kB {0} [built]
 [1302] ./~/power-assert-formatter/~/acorn/dist/acorn.js 120 kB {0} [built]
 [1303] ./~/acorn-es7-plugin/acorn-es7-plugin.js 7.9 kB {0} [built]
 [1304] ./~/power-assert-formatter/lib/esnode.js 1.39 kB {0} [built]
 [1305] ./~/power-assert-formatter/lib/location.js 2.88 kB {0} [built]
 [1306] ./~/power-assert-formatter/lib/udiff.js 1.1 kB {0} [built]
 [1307] ./~/googlediff/index.js 92 bytes {0} [built]
 [1308] ./~/googlediff/javascript/diff_match_patch_uncompressed.js 76.5 kB {0} [built]
 [1309] ./~/power-assert-formatter/lib/default-options.js 466 bytes {0} [built]
 [1310] ./~/power-assert-formatter/lib/built-in/assertion.js 398 bytes {0} [built]
 [1311] ./~/power-assert-formatter/lib/built-in/file.js 537 bytes {0} [built]
 [1312] ./~/power-assert-formatter/lib/built-in/diagram.js 3.14 kB {0} [built]
 [1313] ./~/power-assert-formatter/lib/built-in/binary-expression.js 3 kB {0} [built]
 [1314] ./~/power-assert-formatter/lib ^\.\/.*$ 656 bytes {0} [built]

WARNING in ./~/power-assert-formatter/lib/create.js
Critical dependencies:
35:28-49 the request of a dependency is an expression
 @ ./~/power-assert-formatter/lib/create.js 35:28-49
webpack: bundle is now VALID.
14 03 2016 14:47:07.941:WARN [karma]: No captured browser, open http://localhost:9876/
14 03 2016 14:47:07.949:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
14 03 2016 14:47:07.960:INFO [launcher]: Starting browser Chrome
14 03 2016 14:47:11.430:INFO [Chrome 49.0.2623 (Mac OS X 10.9.5)]: Connected on socket /#yT3gMq6H8fqfo8PhAAAA with id 45962631

START:
  <Button />
    ✖ should render its children..

Finished in 0.206 secs / 0.081 secs

SUMMARY:
✔ 0 tests completed
✖ 1 test failed

FAILED TESTS:
  <Button />
    ✖ should render its children..
      Chrome 49.0.2623 (Mac OS X 10.9.5)
    AssertionError: todo
        at Function.decoratedAssert [as equal] (/Users/bsr/test/client/build/testing/test-bundler.js:154176:26 <- webpack:///~/empower/lib/decorate.js:44:0)
        at /Users/bsr/test/client/build/testing/test-bundler.js:83399:30 <- webpack:///src/frontend/bundles/__tests__/Button.test.js:18:13
        at callbackEntry.onFulfilled (/Users/bsr/test/client/build/testing/test-bundler.js:86064:35 <- webpack:///~/lovefield/dist/lovefield.js:2446:0)
        at Function.goog.Promise.invokeCallback_ (/Users/bsr/test/client/build/testing/test-bundler.js:86170:71 <- webpack:///~/lovefield/dist/lovefield.js:2552:0)
        at goog.Promise.executeCallback_ (/Users/bsr/test/client/build/testing/test-bundler.js:86159:55 <- webpack:///~/lovefield/dist/lovefield.js:2541:0)
        at goog.Promise.executeCallbacks_ (/Users/bsr/test/client/build/testing/test-bundler.js:86152:66 <- webpack:///~/lovefield/dist/lovefield.js:2534:0)
        at goog.async.run.processWorkQueue (/Users/bsr/test/client/build/testing/test-bundler.js:85868:16 <- webpack:///~/lovefield/dist/lovefield.js:2250:0)
        at run (/Users/bsr/test/client/build/testing/test-bundler.js:4192:48 <- webpack:///~/babel-polyfill/~/core-js/modules/es6.promise.js:84:0)
        at /Users/bsr/test/client/build/testing/test-bundler.js:4203:29 <- webpack:///~/babel-polyfill/~/core-js/modules/es6.promise.js:95:0
        at MutationObserver.flush (/Users/bsr/test/client/build/testing/test-bundler.js:4542:6 <- webpack:///~/babel-polyfill/~/core-js/modules/_microtask.js:19:0)

[bsr203]

Originally, I was using like

assert.equal(c.find('a').length, 1, 'todo');

when I changed to

assert(c.find('a').length === 1);

output message is

      Chrome 49.0.2623 (Mac OS X 10.9.5)
    AssertionError: false == true

[twada]

@bsr203 Thank you for using power-assert.
Would you show me your test code and karma.conf file?
If you cannot, would you create a gist entry to reproduce this problem?

[bsr203]

hi @twada thanks for the response.

Please see the repo here https://github.com/bsr203/react-boilerplate
you can run the test with npm run test

you can see the test, along with the tests from powerassert demo site here.
https://github.com/bsr203/react-boilerplate/blob/master/app/components/Button/index.test.js

karma conf here https://github.com/bsr203/react-boilerplate/blob/master/internals/testing/karma.conf.js
and the webpack one https://github.com/bsr203/react-boilerplate/blob/master/internals/webpack/webpack.test.babel.js

babel config for test is
https://github.com/bsr203/react-boilerplate/blob/master/internals/testing/.babelrc

if you use builtin assert instead of power-assert, there is no webpack warning

[783] ./app/selectors/selectLocationSelector.js 4.19 kB {0} [optional] [built]

WARNING in ./~/power-assert-formatter/lib/create.js
Critical dependencies:
35:28-49 the request of a dependency is an expression
 @ ./~/power-assert-formatter/lib/create.js 35:28-49

please let me know from anything.
Cheers,
bsr

[twada]

@bsr203 Thanks. I'm going to clone and investigate your repo now.

[bsr203]

thanks.. :-)

[twada]

WARNING in ./~/power-assert-formatter/lib/create.js
Critical dependencies:
35:28-49 the request of a dependency is an expression
 @ ./~/power-assert-formatter/lib/create.js 35:28-49

This is not a critical problem, since power-assert formatter uses dynamic require to load renderers. It's just a warning.

[bsr203]

ok but there is no pretty diff in the assert message right

[twada]

@bsr203 I've created a pull-req to enable power-assert. Please take a look.

[bsr203]

thanks, it was silly as I thought it will read the config from the .babelrc.

one minor issue with the warning.

I typically use the watch mode npm run test:watch

with the warning, it always shows the long webpack build output, and only shows the test results otherwise. so, if there is no warning (means if I switch from power-assert to builtin assert), the console stays clean and can focus on test logs. Is there anyway, I can suppress the warning by adding it to webpack config? I will check with webpack maintainers otherwise.

thanks again for this wonderful package and your help.
Cheers.

[twada]

@bsr203 Just made one more pull-req to suppress warnings

[bsr203]

everything works flawlessly. can't thank you enough. Cheers. bsr

[twada]

@bsr203 Grad to hear that ;)

[twada]

Memo for power-assert FAQ.

[PATCH] Allow expression as dependency to suppress warnings

see: http://webpack.github.io/docs/configuration.html#automatically-created-contexts-defaults-module-xxxcontextxxx
---
 internals/webpack/webpack.test.babel.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/internals/webpack/webpack.test.babel.js b/internals/webpack/webpack.test.babel.js
index bb52265..46441df 100644
--- a/internals/webpack/webpack.test.babel.js
+++ b/internals/webpack/webpack.test.babel.js
@@ -13,6 +13,9 @@ module.exports = {
       /node_modules\/sinon/,
       /node_modules\/acorn/,
     ],
+    // Allow expression as dependency to suppress warnings
+    // http://webpack.github.io/docs/configuration.html#automatically-created-contexts-defaults-module-xxxcontextxxx
+    exprContextCritical: false,
     preLoaders: [
       { test: /\.js$/,
         loader: 'isparta',

see also: http://webpack.github.io/docs/configuration.html#automatically-created-contexts-defaults-module-xxxcontextxxx

[chibicode]

To anyone who also came here from the FAQ: exprContextCritical: false needs to go under module option, not directly under module.exports.

module.exports = {
  ...
  module: {
    exprContextCritical: false,
    loaders: ...
    ...

[twada]

@chibicode Thank you for clarifying!!