How do I compile my Javascript assets with webpack for Wallaby feature tests?

I’m using Wallaby in a dummy Phoenix project that uses webpack to compile assets.

But I get this error:

1) test users have names (MyApp.Web.LandingPagesTest)
     test/my_app/web/integration/landing_pages/landing_pages_test.exs:6
     ** (Wallaby.JSError) There was an uncaught javascript error:

     Could not find component Website.
       mountComponents (http://localhost:4001/js/index.js:71740)
       (anonymous function) (http://localhost:4001/js/index.js:71759)

This is obviously being caused by my assets not being compiled.

How can I run webpack to compile my assets for Wallaby to use in phantomjs?

1 Like

If this was my problem?

  • Nothing in the Wallaby page seems to suggest that there is accommodation for building anything. But it does ask you to add a line to test_helper.exs. So what about running a npm build script right before that line (for ideas, see this)?
  • Here is a suggestion that maybe the Wallaby tests should be separate from the unit tests. In that case use a Mix alias to run the npm script and then the Wallaby tests.

Just some ideas until better suggestions come along.

3 Likes

Good question. I’m not sure of the answer, but I opened an issue in Wallaby to add more guidance around this subject. Hopefully we can come up with a good answer and update the docs!

1 Like

I’m going to try running the webpack build command like in your first list item.

I definitely would love to have the wallaby tests run with the mix test command along with all my tests - it’s currently doing that fine locally on :dev env.