Refactor tracerManager

src/frontend/apis/index.js

@@ -74,7 +74,7 @@ const TracerApi = {
     if (jsWorker) jsWorker.terminate();
     jsWorker = new Worker('/api/tracers/js');
     jsWorker.onmessage = e => resolve(e.data);
-    jsWorker.onerror = reject;
+    jsWorker.onerror = err => reject({ status: 500, err });
     jsWorker.postMessage(code);
   }),
   java: POST('/tracers/java'),

src/frontend/components/App/index.jsx

@@ -183,7 +183,7 @@ class App extends React.Component {
 
   render() {
     const { navigatorOpened, workspaceWeights, viewerTabIndex, editingFileName } = this.state;
-    const { files } = this.props.current;
+    const { titles, files } = this.props.current;
 
     const readmeFile = files.find(file => file.name === 'README.md');
     const editorTabIndex = files.findIndex(file => file.name === editingFileName);
@@ -208,7 +208,7 @@ class App extends React.Component {
                         onChangeTabIndex={tabIndex => this.handleChangeEditorTabIndex(tabIndex)}>
             {
               files.map(file => (
-                <CodeEditor key={file.name} file={file} />
+                <CodeEditor key={[...titles, file.name].join('--')} file={file} />
               ))
             }
           </TabContainer>

src/frontend/components/CodeEditor/index.jsx

@@ -28,7 +28,7 @@ class CodeEditor extends React.Component {
 
   componentDidMount() {
     const { file } = this.props;
-    tracerManager.setFile(file);
+    tracerManager.setFile(file, true);
 
     tracerManager.setOnUpdateLineIndicator(lineIndicator => this.setState({ lineMarker: this.createLineMarker(lineIndicator) }));
   }
@@ -36,7 +36,7 @@ class CodeEditor extends React.Component {
   componentWillReceiveProps(nextProps) {
     const { file } = nextProps;
     if (file !== this.props.file) {
-      tracerManager.setFile(file);
+      tracerManager.setFile(file, extension(file.name) === 'js');
     }
   }
 

src/frontend/core/tracerManager.jsx

@@ -61,9 +61,9 @@ class TracerManager {
     if (this.onUpdateLineIndicator) this.onUpdateLineIndicator(lineIndicator);
   }
 
-  setFile(file) {
+  setFile(file, initialRun) {
     this.file = file;
-    if (extension(file.name) === 'js') this.runInitial();
+    if (initialRun) this.runInitial();
   }
 
   reset(traces = []) {
@@ -157,7 +157,6 @@ class TracerManager {
     const ext = extension(name);
     if (ext in TracerApi) {
       return TracerApi[ext]({ code: content })
-        .then(traces => this.reset(traces))
         .catch(e => {
           throw e.err;
         });
@@ -167,23 +166,25 @@ class TracerManager {
   }
 
   runInitial() {
+    this.reset();
+    this.render();
     this.execute()
-      .then(() => this.applyTraceChunk())
-      .catch(() => {
-        this.reset();
-        this.render();
+      .then(traces => {
+        this.reset(traces);
+        this.applyTraceChunk();
       });
   }
 
   run() {
+    this.reset();
+    this.render();
     this.execute()
-      .then(() => {
+      .then(traces => {
+        this.reset(traces);
         this.resume();
         this.setStarted(true);
       })
       .catch(error => {
-        this.reset();
-        this.render();
         this.handleError(error);
       });
   }