search

emacs-lsp / dap-mode

Emacs :heart: Debug Adapter Protocol
https://emacs-lsp.github.io/dap-mode
GNU General Public License v3.0
1.29k stars 181 forks source link

React Native support #117

Open darioceccoli opened 5 years ago

darioceccoli commented 5 years ago

Is it possible to debug React Native projects?

I tried creating a new react-native project:

expo init AwesomeProject

cd AwesomeProject
npm start # you can also use: expo start

And I registered the following debug template:

(dap-register-debug-template "Debug react-native example"
  (list :type "chrome"
        :cwd nil
        :mode "url"
        :request "launch"
        :webRoot "/Users/myuser/Developer/AwesomeProject"
        :url "http://localhost:19001/debugger-ui"
        :name "Debug react-native example"))

When I execute dap-debug, Chrome launches correctly, the mobile app connects correctly to the debugger (on Chrome it says Debuger session #0 active), I see the Chrome session on dap-ui-sessions and I see the out window which correctly mirrors Chrome's console, but breakpoints remain in inactive state and they don't get hit.

I guess this configuration is never going to work and we need instead a dap-react-native which uses the https://github.com/microsoft/vscode-react-native extension or https://github.com/jhen0409/react-native-debugger?

The official react-native docs Debugging · React Native mention something about using a custom javascript debugger, but I guess it should be possible to use dap-mode with Chrome?

yyoncho commented 5 years ago

I guess this configuration is never going to work and we need instead a dap-react-native which uses the https://github.com/microsoft/vscode-react-native extension or https://github.com/jhen0409/react-native-debugger?

Yes, we have to create the corresponding register methods for dap-mode.

yyoncho commented 5 years ago

I checked the react native debug adapter, and it seems like it is straight forward to configure it following dap-chrome.el/dap-firefox.el/dap-node.el as an example. So if you wanna give it a try you may ping me here or in gitter. Otherwise, I will try to implement it next week when I have time window.

darioceccoli commented 5 years ago

I can give it a try. I'll try adding a dap-react-native.el which will get the vscode/msjsdiag.vscode-react-native extension and use msjsdiag.vscode-react-native/src/debugger/reactNativeDebugEntryPoint.js as debug-program.

darioceccoli commented 5 years ago

I started working on that on https://github.com/emacs-lsp/dap-mode/pull/118