New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to set babel environment in wallaby #285

Closed
okonet opened this Issue Oct 6, 2015 · 5 comments

Comments

Projects
None yet
2 participants
@okonet
Contributor

okonet commented Oct 6, 2015

babel supports different environments (https://babeljs.io/docs/usage/options/) which is useful for dev/production configs. For example, here is my .babelrc

{
    "stage": 0,
    "optional": ["runtime"],
    "plugins": [
        "lodash"
    ],
    "env": {
        "development": {
            "plugins": [
                "react-display-name",
                "react-transform"
            ],
            "extra": {
                "react-transform": {
                    "transforms": [
                        {
                            "transform": "react-transform-hmr",
                            "imports": ["react"],
                            "locals": ["module"]
                        }, {
                            "transform": "react-transform-catch-errors",
                            "imports": ["react", "redbox-react"]
                        }
                    ]}
            }
        }
    }
}

I don't want to use react hot loading in my test runner, and thus have to find a way to tell babel to env other than development. I've tried to do that using runner option (http://wallabyjs.com/docs/config/runner.html) in my wallaby config, but it seems it doesn't change anything. Please advise how to set up a env for babel.

@okonet

This comment has been minimized.

Show comment
Hide comment
@okonet

okonet Oct 6, 2015

Contributor

Worth noting: I'm using mocha and browser environment in tests...

I've also tried:

bootstrap: function (wallaby) {
      process.env.NODE_ENV = "test";
    }

This one gives me an error: Runtime error: ReferenceError: Can't find variable: process

Contributor

okonet commented Oct 6, 2015

Worth noting: I'm using mocha and browser environment in tests...

I've also tried:

bootstrap: function (wallaby) {
      process.env.NODE_ENV = "test";
    }

This one gives me an error: Runtime error: ReferenceError: Can't find variable: process

@ArtemGovorov

This comment has been minimized.

Show comment
Hide comment
@ArtemGovorov

ArtemGovorov Oct 7, 2015

Member

Hi Andrey,

you were just one step away from the solution.

runner option sets env properties of a test runner (that is browser/phantom in this case) and by then files are already processed by babel, same for the bootstrap function (it executed in context of the browser, so there's no process variable).

What you need is to set the env property before wallaby.js compiles/processes files with babel. Wallaby loads its config file first, then from it it sees that you have configured babel, etc. So anywhere in your config, for example at the very top, you may do:

// whenever wallaby loads the config file (and later uses babel),
// babel will know that we are in the `test` env
process.env.BABEL_ENV = 'test';

module.exports = function (wallaby) {
  return {
    files: [...],
    tests: [...],
    compilers: {...}
    ...
  };
};

Please let me know if it works for you.

Member

ArtemGovorov commented Oct 7, 2015

Hi Andrey,

you were just one step away from the solution.

runner option sets env properties of a test runner (that is browser/phantom in this case) and by then files are already processed by babel, same for the bootstrap function (it executed in context of the browser, so there's no process variable).

What you need is to set the env property before wallaby.js compiles/processes files with babel. Wallaby loads its config file first, then from it it sees that you have configured babel, etc. So anywhere in your config, for example at the very top, you may do:

// whenever wallaby loads the config file (and later uses babel),
// babel will know that we are in the `test` env
process.env.BABEL_ENV = 'test';

module.exports = function (wallaby) {
  return {
    files: [...],
    tests: [...],
    compilers: {...}
    ...
  };
};

Please let me know if it works for you.

@okonet

This comment has been minimized.

Show comment
Hide comment
@okonet

okonet Oct 7, 2015

Contributor

Thanks for a detailed answer! It worked like a charm. 👏

Mind adding this to the documentation of runner/babel setup on the web-site?

Contributor

okonet commented Oct 7, 2015

Thanks for a detailed answer! It worked like a charm. 👏

Mind adding this to the documentation of runner/babel setup on the web-site?

@ArtemGovorov

This comment has been minimized.

Show comment
Hide comment
@ArtemGovorov
Member

ArtemGovorov commented Oct 7, 2015

Awesome, thanks. Have added a paragraph to the runner page and section to the babel page.

@okonet

This comment has been minimized.

Show comment
Hide comment
@okonet

okonet Oct 7, 2015

Contributor

👍

Contributor

okonet commented Oct 7, 2015

👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment