refactor debug to have a loading callback and move the actual debug call to it

src/app/debugger/debugger/debugger.js

@@ -76,7 +76,7 @@ Debugger.prototype.registerAndHighlightCodeItem = function (index) {
   })
 }
 
-Debugger.prototype.debug = function (parent) {
+Debugger.prototype.debug = function (parent, tx, loadingCb) {
   const self = this
   this.step_manager = new StepManager(this.debugger, this.debugger.traceManager)
   parent.event.register('indexChanged', this, (index) => {
@@ -92,6 +92,9 @@ Debugger.prototype.debug = function (parent) {
   })
 
   this.vmDebuggerLogic = new VmDebuggerLogic(parent, this.debugger.traceManager, this.debugger.codeManager, this.debugger.solidityProxy, this.debugger.callTree)
+
+  loadingCb()
+  this.debugger.debug(tx)
 }
 
 module.exports = Debugger

src/app/debugger/debuggerUI.js

@@ -166,16 +166,15 @@ class DebuggerUI {
     // still here because tx is being reffered in children
     this.tx = tx
 
-    this.transactionDebugger.debug(this)
-    this.stepManager = new StepManagerUI(this.transactionDebugger.step_manager)
-    this.stepManager.event.register('stepChanged', this, function (stepIndex) {
-      self.stepChanged(stepIndex)
-    })
-
-    this.vmDebugger = new VmDebugger(this.transactionDebugger.vmDebuggerLogic)
-    this.andAddVmDebugger()
+    this.transactionDebugger.debug(this, tx, () => {
+      self.stepManager = new StepManagerUI(this.transactionDebugger.step_manager)
+      self.stepManager.event.register('stepChanged', this, function (stepIndex) {
+        self.stepChanged(stepIndex)
+      })
 
-    this.transactionDebugger.debugger.debug(tx)
+      self.vmDebugger = new VmDebugger(this.transactionDebugger.vmDebuggerLogic)
+      self.andAddVmDebugger()
+    })
   }
 
   debug (txHash) {