mirror of
https://github.com/status-im/react-native.git
synced 2025-01-19 05:51:01 +00:00
184c708b14
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
135 lines
3.9 KiB
HTML
135 lines
3.9 KiB
HTML
<!doctype html>
|
|
<!--
|
|
Copyright (c) 2015-present, Facebook, Inc.
|
|
All rights reserved.
|
|
|
|
This source code is licensed under the BSD-style license found in the
|
|
LICENSE file in the root directory of this source tree. An additional grant
|
|
of patent rights can be found in the PATENTS file in the same directory.
|
|
-->
|
|
|
|
<html>
|
|
<head>
|
|
<meta charset=utf-8>
|
|
<!-- Fake favicon, to avoid extra request to server -->
|
|
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
|
|
<title>React Native Debugger</title>
|
|
<script>
|
|
(function() {
|
|
|
|
var sessionID = window.localStorage.getItem('sessionID');
|
|
window.localStorage.removeItem('sessionID');
|
|
|
|
window.onbeforeunload = function() {
|
|
if (sessionID) {
|
|
return 'If you reload this page, it is going to break the debugging session. ' +
|
|
'You should press ⌘R in simulator to reload.';
|
|
}
|
|
};
|
|
|
|
// Alias native implementations needed by the debugger before platform-specific
|
|
// implementations are loaded into the global namespace
|
|
var debuggerSetTimeout = window.setTimeout;
|
|
var DebuggerWebSocket = window.WebSocket;
|
|
|
|
function setStatus(status) {
|
|
document.getElementById('status').innerHTML = status;
|
|
}
|
|
|
|
// This worker will run the application javascript code,
|
|
// making sure that it's run in an environment without a global
|
|
// document, to make it consistent with the JSC executor environment.
|
|
var worker = new Worker('debuggerWorker.js');
|
|
|
|
var messageHandlers = {
|
|
// This method is a bit hacky. Catalyst asks for a new clean JS runtime.
|
|
// The easiest way to do this is to reload this page. That also means that
|
|
// web socket connection will be lost. To send reply back we need to remember
|
|
// message id.
|
|
// This message also needs to be handled outside of the worker, since the worker
|
|
// doesn't have access to local storage.
|
|
'prepareJSRuntime': function(message) {
|
|
window.onbeforeunload = undefined;
|
|
window.localStorage.setItem('sessionID', message.id);
|
|
window.location.reload();
|
|
}
|
|
};
|
|
|
|
function connectToDebuggerProxy() {
|
|
var ws = new DebuggerWebSocket('ws://' + window.location.host + '/debugger-proxy');
|
|
|
|
ws.onopen = function() {
|
|
if (sessionID) {
|
|
setStatus('Debugger session #' + sessionID + ' active.');
|
|
ws.send(JSON.stringify({replyID: parseInt(sessionID, 10)}));
|
|
} else {
|
|
setStatus('Waiting, press <span class="shortcut">⌘R</span> in simulator to reload and connect.');
|
|
}
|
|
};
|
|
|
|
ws.onmessage = function(message) {
|
|
var object = JSON.parse(message.data);
|
|
if (!object.method) {
|
|
return;
|
|
}
|
|
|
|
var handler = messageHandlers[object.method];
|
|
if (handler) {
|
|
// If we have a local handler, use it.
|
|
handler(object);
|
|
} else {
|
|
// Otherwise, pass through to the worker.
|
|
worker.postMessage(object);
|
|
}
|
|
};
|
|
|
|
ws.onclose = function() {
|
|
setStatus('Disconnected from proxy. Attempting reconnection. Is node server running?');
|
|
|
|
sessionID = null;
|
|
window.localStorage.removeItem('sessionID');
|
|
debuggerSetTimeout(connectToDebuggerProxy, 100);
|
|
};
|
|
|
|
worker.onmessage = function(message) {
|
|
ws.send(JSON.stringify(message.data));
|
|
}
|
|
}
|
|
|
|
connectToDebuggerProxy();
|
|
|
|
})();
|
|
</script>
|
|
<style type="text/css">
|
|
body {
|
|
font-size: large;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family: Helvetica, Verdana, sans-serif;
|
|
font-weight: 200;
|
|
}
|
|
.shortcut {
|
|
font-family: "Monaco", monospace;
|
|
font-size: medium;
|
|
color: #eee;
|
|
background-color: #333;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
letter-spacing: 3px;
|
|
}
|
|
.content {
|
|
padding: 10px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="content">
|
|
<p>
|
|
React Native JS code runs inside this Chrome tab.
|
|
</p>
|
|
<p>Press <span class="shortcut">⌘⌥J</span> to open Developer Tools. Enable <a href="http://stackoverflow.com/a/17324511/232122" target="_blank">Pause On Caught Exceptions</a> for a better debugging experience.</p>
|
|
<p>Status: <span id="status">Loading...</span></p>
|
|
</div>
|
|
</body>
|
|
</html>
|