diff --git a/src/app/debugger/debuggerUI.js b/src/app/debugger/debuggerUI.js
index e974fda9f5..c286cd613d 100644
--- a/src/app/debugger/debuggerUI.js
+++ b/src/app/debugger/debuggerUI.js
@@ -2,7 +2,8 @@ var OldEthdebuggerUI = require('./remix-debugger/src/ui/EthdebuggerUI')
 var Debugger = require('../debugger/debugger')
 var SourceHighlighter = require('../editor/sourceHighlighter')
 var TxBrowser = require('./debuggerUI/TxBrowser')
-var StepManager = require('./debuggerUI/StepManager')
+var StepManagerUI = require('./debuggerUI/StepManager')
+var StepManager = require('./stepManager')
 var remixLib = require('remix-lib')
 var executionContext = remixLib.execution.executionContext
 var traceHelper = remixLib.helpers.trace
@@ -104,7 +105,8 @@ class DebuggerUI {
     let shouldOpenDebugger = this.debugger_ui.startDebugging(blockNumber, txNumber, tx)
     if (!shouldOpenDebugger) return
 
-    this.stepManager = new StepManager(this.debugger_ui, this.transactionDebugger.debugger.traceManager)
+    this.transactionDebugger.step_manager = new StepManager(this.debugger_ui, this.transactionDebugger.debugger.traceManager)
+    this.stepManager = new StepManagerUI(this.transactionDebugger)
     this.stepManager.event.register('stepChanged', this, function (stepIndex) {
       self.debugger_ui.stepChanged(stepIndex)
     })
diff --git a/src/app/debugger/debuggerUI/StepManager.js b/src/app/debugger/debuggerUI/StepManager.js
index ba47a3b7c0..42febd9e5e 100644
--- a/src/app/debugger/debuggerUI/StepManager.js
+++ b/src/app/debugger/debuggerUI/StepManager.js
@@ -1,5 +1,3 @@
-'use strict'
-
 var remixLib = require('remix-lib')
 var EventManager = remixLib.EventManager
 var yo = require('yo-yo')
@@ -7,174 +5,9 @@ var yo = require('yo-yo')
 var ButtonNavigator = require('./ButtonNavigator')
 var Slider = require('./Slider')
 
-class DebuggerStepManager {
-
-  constructor (_parent, _traceManager) {
-    this.event = new EventManager()
-    this._parent = _parent
-    this.parent = _parent.debugger
-    this.traceManager = _traceManager
-    this.currentStepIndex = 0
-    this.traceLength = 0
-    this.revertionPoint = null
-
-    this.listenToEvents()
-  }
-
-  listenToEvents () {
-    const self = this
-
-    this.parent.event.register('newTraceLoaded', this, function () {
-      self.traceManager.getLength(function (error, newLength) {
-        if (error) {
-          return console.log(error)
-        }
-        if (self.traceLength !== newLength) {
-          self.event.trigger('traceLengthChanged', [newLength])
-          self.traceLength = newLength
-        }
-        self.jumpTo(0)
-      })
-    })
-
-    this.parent.callTree.event.register('callTreeReady', () => {
-      if (self.parent.callTree.functionCallStack.length) {
-        self.jumpTo(self.parent.callTree.functionCallStack[0])
-      }
-    })
-
-    this._parent.event.register('indexChanged', this, (index) => {
-      if (index < 0) return
-      if (self._parent.currentStepIndex !== index) return
-
-      self.traceManager.buildCallPath(index, (error, callsPath) => {
-        if (error) {
-          console.log(error)
-          return self.event.trigger('revertWarning', [''])
-          // if (self.buttonNavigator) {
-          //   self.buttonNavigator.resetWarning('')
-          // }
-          // return
-        }
-        self.currentCall = callsPath[callsPath.length - 1]
-        if (self.currentCall.reverted) {
-          let revertedReason = self.currentCall.outofgas ? 'outofgas' : ''
-          self.revertionPoint = self.currentCall.return
-          return self.event.trigger('revertWarning', [revertedReason])
-          // if (self.buttonNavigator) {
-          //   self.buttonNavigator.resetWarning(revertedReason)
-          // }
-          // return
-        }
-        for (var k = callsPath.length - 2; k >= 0; k--) {
-          var parent = callsPath[k]
-          if (!parent.reverted) continue
-          self.revertionPoint = parent.return
-          self.event.trigger('revertWarning', ['parenthasthrown'])
-          // if (self.buttonNavigator) {
-          //   self.buttonNavigator.resetWarning('parenthasthrown')
-          // }
-        }
-        self.event.trigger('revertWarning', [''])
-        // if (self.buttonNavigator) {
-        //   self.buttonNavigator.resetWarning('')
-        // }
-      })
-    })
-  }
-
-  triggerStepChanged (step) {
-    const self = this
-    this.traceManager.getLength(function (error, length) {
-      let stepState = 'valid'
-
-      if (error) {
-        stepState = 'invalid'
-      } else if (step <= 0) {
-        stepState = 'initial'
-      } else if (step >= length - 1) {
-        stepState = 'end'
-      }
-
-      let jumpOutDisabled = (step === self.traceManager.findStepOut(step))
-
-      self.event.trigger('stepChanged', [step, stepState, jumpOutDisabled])
-    })
-  }
-
-  stepIntoBack () {
-    if (!this.traceManager.isLoaded()) return
-    var step = this.currentStepIndex - 1
-    this.currentStepIndex = step
-    if (!this.traceManager.inRange(step)) {
-      return
-    }
-    this.event.trigger('stepChanged', [step])
-  }
-
-  stepIntoForward () {
-    if (!this.traceManager.isLoaded()) return
-    var step = this.currentStepIndex + 1
-    this.currentStepIndex = step
-    if (!this.traceManager.inRange(step)) {
-      return
-    }
-    this.event.trigger('stepChanged', [step])
-  }
-
-  stepOverBack () {
-    if (!this.traceManager.isLoaded()) return
-    var step = this.traceManager.findStepOverBack(this.currentStepIndex)
-    this.currentStepIndex = step
-    this.event.trigger('stepChanged', [step])
-  }
-
-  stepOverForward () {
-    if (!this.traceManager.isLoaded()) return
-    var step = this.traceManager.findStepOverForward(this.currentStepIndex)
-    this.currentStepIndex = step
-    this.event.trigger('stepChanged', [step])
-  }
-
-  jumpOut () {
-    if (!this.traceManager.isLoaded()) return
-    var step = this.traceManager.findStepOut(this.currentStepIndex)
-    this.currentStepIndex = step
-    this.event.trigger('stepChanged', [step])
-  }
-
-  jumpTo (step) {
-    if (!this.traceManager.inRange(step)) return
-    this.currentStepIndex = step
-    this.event.trigger('stepChanged', [step])
-  }
-
-  jumpToException () {
-    this.jumpTo(this.revertionPoint)
-  }
-
-  jumpNextBreakpoint () {
-    // TODO: this is the same currentStepIndex var but currently coupled all the way up to EthDebuggerUI
-    // the trigger in updateStep is updating it in EthDebuggerUI
-    // the refactor should remove it
-    this.parent.breakpointManager.jumpNextBreakpoint(this._parent.currentStepIndex, true)
-  }
-
-  jumpPreviousBreakpoint () {
-    this.parent.breakpointManager.jumpPreviousBreakpoint(this._parent.currentStepIndex, true)
-  }
-
-}
-
-function StepManager (_parent, _traceManager) {
+function StepManager (_debugger) {
   this.event = new EventManager()
-  this._parent = _parent
-  this.parent = _parent.debugger
-  this.traceManager = _traceManager
-  this.revertionPoint = null
-
-  this.step_manager = new DebuggerStepManager(_parent, _traceManager)
-
+  this.step_manager = _debugger.step_manager
   this.startSlider()
   this.startButtonNavigator()
 }
diff --git a/src/app/debugger/stepManager.js b/src/app/debugger/stepManager.js
new file mode 100644
index 0000000000..cf8a1a3295
--- /dev/null
+++ b/src/app/debugger/stepManager.js
@@ -0,0 +1,163 @@
+var remixLib = require('remix-lib')
+var EventManager = remixLib.EventManager
+
+class DebuggerStepManager {
+
+  constructor (_parent, _traceManager) {
+    this.event = new EventManager()
+    this._parent = _parent
+    this.parent = _parent.debugger
+    this.traceManager = _traceManager
+    this.currentStepIndex = 0
+    this.traceLength = 0
+    this.revertionPoint = null
+
+    this.listenToEvents()
+  }
+
+  listenToEvents () {
+    const self = this
+
+    this.parent.event.register('newTraceLoaded', this, function () {
+      self.traceManager.getLength(function (error, newLength) {
+        if (error) {
+          return console.log(error)
+        }
+        if (self.traceLength !== newLength) {
+          self.event.trigger('traceLengthChanged', [newLength])
+          self.traceLength = newLength
+        }
+        self.jumpTo(0)
+      })
+    })
+
+    this.parent.callTree.event.register('callTreeReady', () => {
+      if (self.parent.callTree.functionCallStack.length) {
+        self.jumpTo(self.parent.callTree.functionCallStack[0])
+      }
+    })
+
+    this._parent.event.register('indexChanged', this, (index) => {
+      if (index < 0) return
+      if (self._parent.currentStepIndex !== index) return
+
+      self.traceManager.buildCallPath(index, (error, callsPath) => {
+        if (error) {
+          console.log(error)
+          return self.event.trigger('revertWarning', [''])
+          // if (self.buttonNavigator) {
+          //   self.buttonNavigator.resetWarning('')
+          // }
+          // return
+        }
+        self.currentCall = callsPath[callsPath.length - 1]
+        if (self.currentCall.reverted) {
+          let revertedReason = self.currentCall.outofgas ? 'outofgas' : ''
+          self.revertionPoint = self.currentCall.return
+          return self.event.trigger('revertWarning', [revertedReason])
+          // if (self.buttonNavigator) {
+          //   self.buttonNavigator.resetWarning(revertedReason)
+          // }
+          // return
+        }
+        for (var k = callsPath.length - 2; k >= 0; k--) {
+          var parent = callsPath[k]
+          if (!parent.reverted) continue
+          self.revertionPoint = parent.return
+          self.event.trigger('revertWarning', ['parenthasthrown'])
+          // if (self.buttonNavigator) {
+          //   self.buttonNavigator.resetWarning('parenthasthrown')
+          // }
+        }
+        self.event.trigger('revertWarning', [''])
+        // if (self.buttonNavigator) {
+        //   self.buttonNavigator.resetWarning('')
+        // }
+      })
+    })
+  }
+
+  triggerStepChanged (step) {
+    const self = this
+    this.traceManager.getLength(function (error, length) {
+      let stepState = 'valid'
+
+      if (error) {
+        stepState = 'invalid'
+      } else if (step <= 0) {
+        stepState = 'initial'
+      } else if (step >= length - 1) {
+        stepState = 'end'
+      }
+
+      let jumpOutDisabled = (step === self.traceManager.findStepOut(step))
+
+      self.event.trigger('stepChanged', [step, stepState, jumpOutDisabled])
+    })
+  }
+
+  stepIntoBack () {
+    if (!this.traceManager.isLoaded()) return
+    var step = this.currentStepIndex - 1
+    this.currentStepIndex = step
+    if (!this.traceManager.inRange(step)) {
+      return
+    }
+    this.event.trigger('stepChanged', [step])
+  }
+
+  stepIntoForward () {
+    if (!this.traceManager.isLoaded()) return
+    var step = this.currentStepIndex + 1
+    this.currentStepIndex = step
+    if (!this.traceManager.inRange(step)) {
+      return
+    }
+    this.event.trigger('stepChanged', [step])
+  }
+
+  stepOverBack () {
+    if (!this.traceManager.isLoaded()) return
+    var step = this.traceManager.findStepOverBack(this.currentStepIndex)
+    this.currentStepIndex = step
+    this.event.trigger('stepChanged', [step])
+  }
+
+  stepOverForward () {
+    if (!this.traceManager.isLoaded()) return
+    var step = this.traceManager.findStepOverForward(this.currentStepIndex)
+    this.currentStepIndex = step
+    this.event.trigger('stepChanged', [step])
+  }
+
+  jumpOut () {
+    if (!this.traceManager.isLoaded()) return
+    var step = this.traceManager.findStepOut(this.currentStepIndex)
+    this.currentStepIndex = step
+    this.event.trigger('stepChanged', [step])
+  }
+
+  jumpTo (step) {
+    if (!this.traceManager.inRange(step)) return
+    this.currentStepIndex = step
+    this.event.trigger('stepChanged', [step])
+  }
+
+  jumpToException () {
+    this.jumpTo(this.revertionPoint)
+  }
+
+  jumpNextBreakpoint () {
+    // TODO: this is the same currentStepIndex var but currently coupled all the way up to EthDebuggerUI
+    // the trigger in updateStep is updating it in EthDebuggerUI
+    // the refactor should remove it
+    this.parent.breakpointManager.jumpNextBreakpoint(this._parent.currentStepIndex, true)
+  }
+
+  jumpPreviousBreakpoint () {
+    this.parent.breakpointManager.jumpPreviousBreakpoint(this._parent.currentStepIndex, true)
+  }
+
+}
+
+module.exports = DebuggerStepManager