teambit / envs

Component development environments for the Bit community
https://bit.dev/bit/envs
Other
64 stars 9 forks source link

Jest tests don't recognize babel config (JSX syntax) after re-importing component from bit #52

Open painedpineapple opened 5 years ago

painedpineapple commented 5 years ago

Expected Behavior

When I re-import a component who's tests worked before exporting to bit, the tests will still work

Actual Behavior

The tests won't run b/c the jest tester throws an error saying that it doesn't recognize the JSX syntax. I'm guessing there's some kind of an issue with it not using the babel config after it's been re-imported

Steps to Reproduce the Problem

  1. npm i @bit/seamonster-studios.react.components.outside-click into a project that has jest running
  2. Run Jest and watch it fail with the error message

Specifications

imsnif commented 5 years ago

Hey @loganfromlogan - sorry for the delayed response!

If you want to run your component's tests in the repository to which you imported it, you'll want to run bit test rather than jest. This is so that you'll be sure to get all the test configuration you defined before exporting (in this case, the ability to transpile JSX). Do note that in order for the tests to run, bit has to detect some change in the component you imported (eg - you added functionality to the component where you imported it, and you'd like to see if the tests still pass).

The reason the component's tests are run (and then fail) when you issue the jest command is that they are not filtered out. Jest traverses your components folder and looks for spec files to run. A way around this is to add something like this to your jest configuration:

"testPathIgnorePatterns": ["/node_modules/", "/components/"]

Makes sense?

painedpineapple commented 5 years ago

Aram,

Thanks for getting back to me on this. While I understand the solution you mentioned, it proves to be a pretty bad workflow. When i'm developing an application I'm already running Jest to watch all my files and check/update/report tests as I develop. Having to run bit test every time I make any changes to a component that's been imported has been changed is just redundant. I guess that's the JS ecosystem a little... I mean I'm already running a script for webpack, one for documentation, one for typechecking, and one for testing (jest). I guess i'll just include my test with my bit components, but not tell bit that it's a test. This way I can still run tests locally.

Thanks!

— Logan Call Lead Front End Developer SeaMonster Studios

--- original message --- On October 19, 2018, 10:42 AM MDT notifications@github.com wrote:

Hey @loganfromlogan - sorry for the delayed response!

If you want to run your component's tests in the repository to which you imported it, you'll want to run bit test rather than jest. This is so that you'll be sure to get all the test configuration you defined before exporting (in this case, the ability to transpile JSX). Do note that in order for the tests to run, bit has to detect some change in the component you imported (eg - you added functionality to the component where you imported it, and you'd like to see if the tests still pass).

The reason the component's tests are run (and then fail) when you issue the jest command is that they are not filtered out. Jest traverses your components folder and looks for spec files to run. A way around this is to add something like this to your jest configuration:

"testPathIgnorePatterns": ["/node_modules/", "/components/"]

Makes sense?

You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub, or mute the thread. --- end of original message ---

imsnif commented 5 years ago

@loganfromlogan - the rationale behind this is that the tests you define inside your component don't have to be jest tests at all. You could use any framework and have the tests be transparent to the "consumer" environment. Even if you'd still like to use jest, you can define alternative configurations for specific components (eg. different transpilers). The project importing your components doesn't need to even know what sort of testing framework or configuration it runs. It'll just work. For these reasons, we require the component tests to be run through bit test, as your "consumer" jest could not know about all these configurations. If you tell me a little bit more about your workflow though and what you'd like to achieve, we might be able to find a workaround (either an existing one or as a new feature). Wdyt?

GiladShoham commented 5 years ago

@loganfromlogan Let's add a new flag --include-tests to the watch command. It will run everything automatically on each component change.