Debugging React Native With Node Shims In Vs Code

I have a React Native project (created from the Ignite CLI 2.0.0 default boilerplate) that needs some dependencies on node-based packages. So, I created a transformers.js, babel-tr

Solution 1:

In my question I bumped into 2 problems.

The first one, tests performing against actual code, appeared to be an issue with Jest. The Jest team stated:

This is the expected behavior. Jest is supposed to run on source files. On any large codebase, generating a bundle before running tests is too slow, so Jest compiles files just-in-time, which makes it fast.

Now this is probably a miscommunication and you can use it with proper babel-jest configuration to do dynamic transforms, I did not receive further help from the team. So I decided to go for a different test platform (either Mocha, Jasmine and/or Karma).

If you want to try your luck with Jest you can follow up on this thread: https://github.com/facebook/jest/issues/4028

The second problem, code opening in a read-only panel in VS during debugging sessions, is an open issue being processed by Microsoft. You can check progress here: https://github.com/Microsoft/vscode/issues/26782

[Update: I just received further instruction from the Jest team:

@aschrijver the general way Jest handles this is by doing the transpilation itself. So you set up transformers in your config that Jest itself uses to do the transpilation.

https://facebook.github.io/jest/docs/configuration.html#transform-object-string-string

An example config for Typescript is here to give you an idea of what this could look like: https://github.com/kulshekhar/ts-jest

In terms of shims, what I think you might be wanting are actually Jest mocks. A Jest mock can step in instead of an actual module when you import or require it.

]