Summary:
Some recent change to Chrome causes the remote debugger to be throttled unexpectedly if it is in a background tab. Although this does not fix the problem, it raises the issue and suggests a workaround.
I also cleaned up some littering of the global namespace in the debugger web worker.
Reviewed By: jingc
Differential Revision: D4104515
fbshipit-source-id: 56e46c0e759bec4c42d3baedd4d2d46cdea2e4a0
Summary:
I frequently spend multiple seconds scanning my open Chrome tabs for the React Native debugger tab. It would be a lot quicker to find the correct tab if the debugger UI tab had a favicon.
This commit adds favicon (blue react logo in a white circle). It's a super minor change, but would help a lot with day-to-day DX.
I chose this icon to differentiate sufficiently from other tabs developer might have open: React docs (blue logo in black square) and React Native docs (white logo in black square). If the idea of having a favicon is agreeable but you want a different asset, I'm more than happy to change it to something else.
Original asset before base-64 encoding:
![favicon-32x32](https://cloud.githubusercontent.com/assets/1203949/19117546/44b36fd2-8b11-11e6-8a94-c8956fe7533c.png)
In the wild:
<img width="335" alt="screen shot 2016-10-05 at 15 40 58" src="https://cloud.githubusercontent.com/assets/1203949/19117811/43cad316-8b12-11e6-8406-4c9b74efdaf2.png">
Closes https://github.com/facebook/react-native/pull/10252
Differential Revision: D3974983
Pulled By: hramos
fbshipit-source-id: 6b07d446dd972c4c171062134b45bc3850886349
Summary:
Very simple PR to add the shorcuts for windows/linux to the web debuger interface so it's less mac-centric.
**Test plan**: Open the debugger and see the shorcuts for windows/linux/mac
Closes https://github.com/facebook/react-native/pull/9812
Differential Revision: D3862570
fbshipit-source-id: 54605af66b674d176b3cbbb9efcfa93f84fcd552
Summary:
Updated the keyboard input element on the browser debugger page that contains "⌘⌥J" from a `span` to the more semantic `kbd`.
Closes https://github.com/facebook/react-native/pull/8998
Differential Revision: D3620668
fbshipit-source-id: ab3081688202c85978f6f400a42eb1aa1abb77c6
Summary:
Clears the debug console whenever the React Native JS is reloaded.
NOTE: This respects "Preserve log" in Chrome by default.
Reviewed By: jingc
Differential Revision: D3409713
fbshipit-source-id: ce215e3125cf43ab3ea5811c707fab9dfa4bcbb3
Summary:
`debugger.html` contained a ton of hacky code that was needed to ensure we have a clean JS runtime every time a client RN app connects. That was needed because we used the page's global environment as runtime. Some time ago WebWorker support was added and now we run RN code inside an isolated WebWorker instance, and we can safely get rid of all these hacks.
This has a bunch of nice side-effects: debug reload works faster, `console.log`s are preserved, `debuggerWorker.js` selection doesn't change.
Made sure the debugging (breakpoints, etc.) still works as before.
Small demo
![](http://g.recordit.co/FPdVHLHPUW.gif)
Closes https://github.com/facebook/react-native/pull/5715
Reviewed By: svcscm
Differential Revision: D2906602
Pulled By: frantic
fb-gh-sync-id: 1a6ab9a5655d7c32ddd23619564e59c377b53a35
Summary:
React dev tools have been broken since we moved to web worker but we had a gigantic upsell for them. This must be a very frustrating experience for people just starting to use react native to be told to use something and see that it doesn't work.
Removing that upsell until it works again
<img width="1090" alt="screen shot 2016-02-04 at 2 00 37 pm" src="https://cloud.githubusercontent.com/assets/197597/12831501/8eba3f4e-cb49-11e5-8bdc-84f902053321.png">
Closes https://github.com/facebook/react-native/pull/5768
Reviewed By: svcscm
Differential Revision: D2903017
Pulled By: vjeux
fb-gh-sync-id: 731c5fefbef1a5249d632fc62ca36813533f2639
Summary:
The JavaScript ecosystem doesn't have the notion of a built-in native module loader. Even Node is decoupled from its module loader. The module loader system is just JS that runs on top of the global `process` object which has all the built-in goodies.
Additionally there is no such thing as a global require. That is something unique to our providesModule system. In other module systems such as node, every require is contextual. Even registered npm names are localized by version.
The only global namespace that is accessible to the host environment is the global object. Normally module systems attaches itself onto the hooks provided by the host environment on the global object.
Currently, we have two forms of dispatch that reaches directly into the module system. executeJSCall which reaches directly into require. Everything now calls through the BatchedBridge module (except one RCTLog edge case that I will fix). I propose that the executors calls directly onto `BatchedBridge` through an instance on the global so that everything is guaranteed to go through it. It becomes the main communication hub.
I also propose that we drop the dynamic requires inside of MessageQueue/BatchBridge and instead have the modules register themselves with the bridge.
executeJSCall was originally modeled after the XHP equivalent. The XHP equivalent was designed that way because the act of doing the call was the thing that defined a dependency on the module from the page. However, that is not how React Native works.
The JS side is driving the dependencies by virtue of requiring new modules and frameworks and the existence of dependencies is driven by the JS side, so this design doesn't make as much sense.
The main driver for this is to be able to introduce a new module system like Prepack's module system. However, it also unlocks the possibility to do dead module elimination even in our current module system. It is currently not possible because we don't know which module might be called from native.
Since the module system now becomes decoupled we could publish all our providesModule modules as npm/CommonJS modules using a rewrite script. That's what React Core does.
That way people could use any CommonJS bundler such as Webpack, Closure Compiler, Rollup or some new innovation to create a JS bundle.
This diff expands the executeJSCalls to the BatchedBridge's three individual pieces to make them first class instead of being dynamic. This removes one layer of abstraction. Hopefully we can also remove more of the things that register themselves with the BatchedBridge (various EventEmitters) and instead have everything go through the public protocol. ReactMethod/RCT_EXPORT_METHOD.
public
Reviewed By: vjeux
Differential Revision: D2717535
fb-gh-sync-id: 70114f05483124f5ac5c4570422bb91a60a727f6
Summary: public
This is not only to put the files on a place where it makes more sense but also to allow to use ES6 features on them as `/packager` is not whitelisted on `babel`.
Reviewed By: mkonicek
Differential Revision: D2577267
fb-gh-sync-id: b69a17c0aad349a3eda987e33d1778d97a8e1549