Commit Graph

7 Commits

Author SHA1 Message Date
Martín Bigio 36efbc341d Hot Loading Indicators
Summary:
public

Introduce a header bar similar to the one shown when loading the bundle to indicate that the packager server is processing an HMR update. Hook into HMR events to show this bar when appropriate.

Reviewed By: javache

Differential Revision: D2873521

fb-gh-sync-id: a77cbb2368b75b045aa8c6ababce2f731baf514b
2016-02-01 12:42:33 -08:00
Martín Bigio f2438b440d Hot Loading Sourcemaps
Summary:
public

To make sourcemaps work on Hot Loading work, we'll need to be able to serve them for each module that is dynamically replaced. To do so we introduced a new parameter to the bundler, namely `entryModuleOnly` to decide whether or not to process the full dependency tree or just the module associated to the entry file. Also we need to add `//sourceMappingURL` to the HMR updates so that in case of an error the runtime retrieves the sourcemaps for the file on which an error occurred from the server.

Finally, we need to refactor a bit how we load the HMR updates into JSC. Unfortunately, if the code is eval'ed when an error is thrown, the line and column number are missing. This is a bug/missing feature in JSC. To walkaround the issue we need to eval the code on native. This adds a bit of complexity to HMR as for both platforms we'll have to have a thin module to inject code but I don't see any other alternative. when debugging this is not needed as Chrome supports sourceMappingURLs on eval'ed code

Reviewed By: javache

Differential Revision: D2841788

fb-gh-sync-id: ad9370d26894527a151cea722463e694c670227e
2016-01-27 14:55:36 -08:00
Martín Bigio fe77ce1c62 Show red boxes on HL mode
Summary:
public

We should further improve this on the future by showing the actual stacktrace instead of the `HMRClient` one. Also, we need to integrate this with the dev plugin that opens in the default editor the file/line the user clicks on.

Reviewed By: vjeux

Differential Revision: D2798889

fb-gh-sync-id: 2392966908c493e86e11b0d024e7b68156c9066c
2016-01-07 13:15:28 -08:00
Martín Bigio 54f2586735 Improve error message when devserver is not running
Summary:
public

If Hot Loading is enabled bu the packager server is not running, as the user updates files he'll see red boxes caused by the HMR runtime. The error those red boxes show is pretty weird for the end user. Lets improve the feedback we give!.

Reviewed By: vjeux

Differential Revision: D2795534

fb-gh-sync-id: dcc39e6682e0603bf10d0f5e623433262b745660
2016-01-04 09:56:30 -08:00
Martín Bigio 5f850fbede Pipe `platform` and `bundleEntry` through WebSocket connection
Reviewed By: vjeux

Differential Revision: D2793572

fb-gh-sync-id: 6ce2467b8d528d1a91c1b4fc51741f2502674022
2015-12-29 18:25:28 -08:00
Martín Bigio 4ffb241647 Hot Loading E2E basic flow
Summary:
public

Implement all the necessary glue code for several diffs submitted before to get Hot Loading work end to end:

- Simplify `HMRClient`: we don't need to make it stateful allowing to enable and disable it because both when we enable and disable the interface we need to reload the bundle.
- On the native side we introduced a singleton to process the bundle URL. This new class might alter the url to include the `hot` attribute. I'm not 100% sure this is the best way to implement this but we cannot use `CTLSettings` for this as it's are not available on oss and I didn't want to contaminate `RCTBridge` with something specific to hot loading. Also, we could potentially use this processor for other things in the future. Please let me know if you don't like this approach or you have a better idea :).
- Use this processor to alter the default bundle URL and request a `hot` bundle when hot loading is enabled. Also make sure to enable the HMR interface when the client activates it on the dev menu.
- Add packager `hot` option.
- Include gaeron's `react-transform` on Facebook's JS transformer.

The current implementation couples a bit React Native to this feature because `react-transform-hmr` is required on `InitializeJavaScriptAppEngine`. Ideally, the packager should accept an additional list of requires and include them on the bundle among all their dependencies. Note this is not the same as the option `runBeforeMainModule` as that one only adds a require to the provided module but doesn't include all the dependencies that module amy have that the entry point doesn't. I'll address this in a follow up task to enable asap hot loading (9536142)

I had to remove 2 `.babelrc` files from `react-proxy` and `react-deep-force-update`. There's an internal task for fixing the underlaying issue to avoid doing this horrible hack (t9515889).

Reviewed By: vjeux

Differential Revision: D2790806

fb-gh-sync-id: d4b78a2acfa071d6b3accc2e6716ef5611ad4fda
2015-12-28 16:44:59 -08:00
Martín Bigio 90781d3067 Introduce Packager and App HMR WebSocket connection
Summary:
public

This diff adds infra to both the Packager and the running app to have a WebSocket based connection between them. This connection is toggled by a new dev menu item, namely `Enable/Disable Hot Loading`.

Reviewed By: vjeux

Differential Revision: D2787621

fb-gh-sync-id: d1dee769348e4830c28782e7b650d025f2b3a786
2015-12-28 16:44:32 -08:00