delete old remix debugger files

pull/3094/head
Iuri Matias 6 years ago committed by yann300
parent b8fa1a4e8a
commit 73385468ec
  1. 0
      src/app/debugger/debuggerUI/styles/basicStyles.js
  2. 0
      src/app/debugger/debuggerUI/styles/dropdownPanel.js
  3. 0
      src/app/debugger/debuggerUI/styles/sliderStyles.js
  4. 0
      src/app/debugger/debuggerUI/styles/treeView.js
  5. 2
      src/app/debugger/debuggerUI/vmDebugger/CodeListView.js
  6. 184
      src/app/debugger/remix-debugger/src/ui/ButtonNavigator.js
  7. 33
      src/app/debugger/remix-debugger/src/ui/CalldataPanel.js
  8. 33
      src/app/debugger/remix-debugger/src/ui/CallstackPanel.js
  9. 88
      src/app/debugger/remix-debugger/src/ui/CodeListView.js
  10. 208
      src/app/debugger/remix-debugger/src/ui/DropdownPanel.js
  11. 210
      src/app/debugger/remix-debugger/src/ui/Ethdebugger.js
  12. 72
      src/app/debugger/remix-debugger/src/ui/FullStoragesChanges.js
  13. 39
      src/app/debugger/remix-debugger/src/ui/MemoryPanel.js
  14. 75
      src/app/debugger/remix-debugger/src/ui/Slider.js
  15. 83
      src/app/debugger/remix-debugger/src/ui/SolidityLocals.js
  16. 103
      src/app/debugger/remix-debugger/src/ui/SolidityState.js
  17. 71
      src/app/debugger/remix-debugger/src/ui/SolidityTypeFormatter.js
  18. 33
      src/app/debugger/remix-debugger/src/ui/StackPanel.js
  19. 101
      src/app/debugger/remix-debugger/src/ui/StepDetail.js
  20. 205
      src/app/debugger/remix-debugger/src/ui/StepManager.js
  21. 50
      src/app/debugger/remix-debugger/src/ui/StoragePanel.js
  22. 206
      src/app/debugger/remix-debugger/src/ui/TxBrowser.js
  23. 126
      src/app/debugger/remix-debugger/src/ui/VmDebugger.js
  24. 2
      src/lib/cmdInterpreterAPI.js

@ -1,5 +1,5 @@
'use strict'
var style = require('../../remix-debugger/src/ui/styles/basicStyles')
var style = require('../styles/basicStyles')
var yo = require('yo-yo')
var remixLib = require('remix-lib')
var DropdownPanel = require('./DropdownPanel')

@ -1,184 +0,0 @@
'use strict'
var remixLib = require('remix-lib')
var EventManager = remixLib.EventManager
var yo = require('yo-yo')
var csjs = require('csjs-inject')
var styleGuide = require('../../../../ui/styles-guide/theme-chooser')
var styles = styleGuide.chooser()
var css = csjs`
.buttons {
display: flex;
flex-wrap: wrap;
}
.stepButtons {
width: 100%;
display: flex;
justify-content: center;
}
.stepButton {
${styles.rightPanel.debuggerTab.button_Debugger}
}
.jumpButtons {
width: 100%;
display: flex;
justify-content: center;
}
.jumpButton {
${styles.rightPanel.debuggerTab.button_Debugger}
}
.navigator {
color: ${styles.rightPanel.debuggerTab.text_Primary};
}
.navigator:hover {
color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_HoverColor};
}
`
function ButtonNavigator (_parent, _traceManager) {
this.event = new EventManager()
this.intoBackDisabled = true
this.overBackDisabled = true
this.intoForwardDisabled = true
this.overForwardDisabled = true
this.jumpOutDisabled = true
this.jumpNextBreakpointDisabled = true
this.jumpPreviousBreakpointDisabled = true
this.traceManager = _traceManager
this.currentCall = null
this.revertionPoint = null
_parent.event.register('indexChanged', this, (index) => {
if (!this.view) return
if (index < 0) return
if (_parent.currentStepIndex !== index) return
this.traceManager.buildCallPath(index, (error, callsPath) => {
if (error) {
console.log(error)
resetWarning(this)
} else {
this.currentCall = callsPath[callsPath.length - 1]
if (this.currentCall.reverted) {
this.revertionPoint = this.currentCall.return
this.view.querySelector('#reverted').style.display = 'block'
this.view.querySelector('#reverted #outofgas').style.display = this.currentCall.outOfGas ? 'inline' : 'none'
this.view.querySelector('#reverted #parenthasthrown').style.display = 'none'
} else {
var k = callsPath.length - 2
while (k >= 0) {
var parent = callsPath[k]
if (parent.reverted) {
this.revertionPoint = parent.return
this.view.querySelector('#reverted').style.display = 'block'
this.view.querySelector('#reverted #parenthasthrown').style.display = parent ? 'inline' : 'none'
this.view.querySelector('#reverted #outofgas').style.display = 'none'
return
}
k--
}
resetWarning(this)
}
}
})
})
this.view
}
module.exports = ButtonNavigator
ButtonNavigator.prototype.render = function () {
var self = this
var view = yo`<div class="${css.buttons}">
<div class="${css.stepButtons}">
<button id='overback' title='Step over back' class='${css.navigator} ${css.stepButton} fa fa-reply' onclick=${function () { self.event.trigger('stepOverBack') }} disabled=${this.overBackDisabled} ></button>
<button id='intoback' title='Step back' class='${css.navigator} ${css.stepButton} fa fa-level-up' onclick=${function () { self.event.trigger('stepIntoBack') }} disabled=${this.intoBackDisabled} ></button>
<button id='intoforward' title='Step into' class='${css.navigator} ${css.stepButton} fa fa-level-down' onclick=${function () { self.event.trigger('stepIntoForward') }} disabled=${this.intoForwardDisabled} ></button>
<button id='overforward' title='Step over forward' class='${css.navigator} ${css.stepButton} fa fa-share' onclick=${function () { self.event.trigger('stepOverForward') }} disabled=${this.overForwardDisabled} ></button>
</div>
<div class="${css.jumpButtons}">
<button id='jumppreviousbreakpoint' title='Jump to the previous breakpoint' class='${css.navigator} ${css.jumpButton} fa fa-step-backward' onclick=${function () { self.event.trigger('jumpPreviousBreakpoint') }} disabled=${this.jumpPreviousBreakpointDisabled} ></button>
<button id='jumpout' title='Jump out' class='${css.navigator} ${css.jumpButton} fa fa-eject' onclick=${function () { self.event.trigger('jumpOut') }} disabled=${this.jumpOutDisabled} ></button>
<button id='jumpnextbreakpoint' title='Jump to the next breakpoint' class='${css.navigator} ${css.jumpButton} fa fa-step-forward' onclick=${function () { self.event.trigger('jumpNextBreakpoint') }} disabled=${this.jumpNextBreakpointDisabled} ></button>
</div>
<div id='reverted' style="display:none">
<button id='jumptoexception' title='Jump to exception' class='${css.navigator} ${css.button} fa fa-exclamation-triangle' onclick=${function () { self.event.trigger('jumpToException', [self.revertionPoint]) }} disabled=${this.jumpOutDisabled} >
</button>
<span>State changes made during this call will be reverted.</span>
<span id='outofgas' style="display:none">This call will run out of gas.</span>
<span id='parenthasthrown' style="display:none">The parent call will throw an exception</span>
</div>
</div>`
if (!this.view) {
this.view = view
}
return view
}
ButtonNavigator.prototype.reset = function () {
this.intoBackDisabled = true
this.overBackDisabled = true
this.intoForwardDisabled = true
this.overForwardDisabled = true
this.jumpOutDisabled = true
this.jumpNextBreakpointDisabled = true
this.jumpPreviousBreakpointDisabled = true
resetWarning(this)
}
ButtonNavigator.prototype.stepChanged = function (step) {
this.intoBackDisabled = step <= 0
this.overBackDisabled = step <= 0
if (!this.traceManager) {
this.intoForwardDisabled = true
this.overForwardDisabled = true
} else {
var self = this
this.traceManager.getLength(function (error, length) {
if (error) {
self.reset()
console.log(error)
} else {
self.jumpNextBreakpointDisabled = step >= length - 1
self.jumpPreviousBreakpointDisabled = step <= 0
self.intoForwardDisabled = step >= length - 1
self.overForwardDisabled = step >= length - 1
var stepOut = self.traceManager.findStepOut(step)
self.jumpOutDisabled = stepOut === step
}
self.updateAll()
})
}
this.updateAll()
}
ButtonNavigator.prototype.updateAll = function () {
this.updateDisabled('intoback', this.intoBackDisabled)
this.updateDisabled('overback', this.overBackDisabled)
this.updateDisabled('overforward', this.overForwardDisabled)
this.updateDisabled('intoforward', this.intoForwardDisabled)
this.updateDisabled('jumpout', this.jumpOutDisabled)
this.updateDisabled('jumptoexception', this.jumpOutDisabled)
this.updateDisabled('jumpnextbreakpoint', this.jumpNextBreakpointDisabled)
this.updateDisabled('jumppreviousbreakpoint', this.jumpPreviousBreakpointDisabled)
}
ButtonNavigator.prototype.updateDisabled = function (id, disabled) {
if (disabled) {
document.getElementById(id).setAttribute('disabled', true)
} else {
document.getElementById(id).removeAttribute('disabled')
}
}
function resetWarning (self) {
self.view.querySelector('#reverted #outofgas').style.display = 'none'
self.view.querySelector('#reverted #parenthasthrown').style.display = 'none'
self.view.querySelector('#reverted').style.display = 'none'
}
module.exports = ButtonNavigator

@ -1,33 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var yo = require('yo-yo')
function CalldataPanel (_parentUI, _traceManager) {
this._parentUI = _parentUI
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Call Data', {json: true})
this.init()
}
CalldataPanel.prototype.render = function () {
return yo`<div id='calldatapanel' >${this.basicPanel.render()}</div>`
}
CalldataPanel.prototype.init = function () {
var self = this
this._parentUI.event.register('indexChanged', this, function (index) {
if (index < 0) return
if (self._parentUI.currentStepIndex !== index) return
self.traceManager.getCallDataAt(index, function (error, calldata) {
if (error) {
self.basicPanel.update({})
console.log(error)
} else if (self._parentUI.currentStepIndex === index) {
self.basicPanel.update(calldata)
}
})
})
}
module.exports = CalldataPanel

@ -1,33 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var yo = require('yo-yo')
function CallstackPanel (_parent, _traceManager) {
this.parent = _parent
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Call Stack', {json: true})
this.init()
}
CallstackPanel.prototype.render = function () {
return yo`<div id='callstackpanel' >${this.basicPanel.render()}</div>`
}
CallstackPanel.prototype.init = function () {
var self = this
this.parent.event.register('indexChanged', this, function (index) {
if (index < 0) return
if (self.parent.currentStepIndex !== index) return
self.traceManager.getCallStackAt(index, function (error, callstack) {
if (error) {
console.log(error)
self.basicPanel.update({})
} else if (self.parent.currentStepIndex === index) {
self.basicPanel.update(callstack)
}
})
})
}
module.exports = CallstackPanel

@ -1,88 +0,0 @@
'use strict'
var style = require('./styles/basicStyles')
var yo = require('yo-yo')
var remixLib = require('remix-lib')
var DropdownPanel = require('./DropdownPanel')
var EventManager = remixLib.EventManager
var csjs = require('csjs-inject')
var styleGuide = require('../../../../ui/styles-guide/theme-chooser')
var styles = styleGuide.chooser()
var css = csjs`
.instructions {
${styles.rightPanel.debuggerTab.box_Debugger}
overflow-y: scroll;
max-height: 150px;
}
`
function CodeListView (_parent, _codeManager) {
this.event = new EventManager()
this.parent = _parent
this.codeManager = _codeManager
this.code
this.address
this.codeView
this.itemSelected
this.basicPanel = new DropdownPanel('Instructions', {json: false, displayContentOnly: true})
this.basicPanel.event.register('hide', () => {
this.event.trigger('hide', [])
})
this.basicPanel.event.register('show', () => {
this.event.trigger('show', [])
})
this.init()
}
CodeListView.prototype.render = function () {
return yo`<div id='asmcodes' >${this.basicPanel.render({height: style.instructionsList.height})}</div>`
}
CodeListView.prototype.init = function () {
var self = this
this.codeManager.event.register('changed', this, this.changed)
this.parent.event.register('traceUnloaded', this, function () {
self.changed([], '', -1)
})
}
CodeListView.prototype.indexChanged = function (index) {
if (index >= 0) {
if (this.itemSelected) {
this.itemSelected.removeAttribute('selected')
this.itemSelected.removeAttribute('style')
if (this.itemSelected.firstChild) {
this.itemSelected.firstChild.removeAttribute('style')
}
}
this.itemSelected = this.codeView.children[index]
this.itemSelected.setAttribute('style', 'background-color: ' + styles.rightPanel.debuggerTab.text_BgHighlight)
this.itemSelected.setAttribute('selected', 'selected')
if (this.itemSelected.firstChild) {
this.itemSelected.firstChild.setAttribute('style', 'margin-left: 2px')
}
this.codeView.scrollTop = this.itemSelected.offsetTop - parseInt(this.codeView.offsetTop)
}
}
CodeListView.prototype.changed = function (code, address, index) {
if (this.address !== address) {
this.code = code
this.address = address
this.codeView = this.renderAssemblyItems()
this.basicPanel.setContent(this.codeView)
}
this.indexChanged(index)
}
CodeListView.prototype.renderAssemblyItems = function () {
if (this.code) {
var codeView = this.code.map(function (item, i) {
return yo`<div key=${i} value=${i}><span>${item}</span></div>`
})
return yo`<div class=${css.instructions} id='asmitems' ref='itemsList'>
${codeView}
</div>`
}
}
module.exports = CodeListView

@ -1,208 +0,0 @@
'use strict'
var yo = require('yo-yo')
const copy = require('clipboard-copy')
var remixLib = require('remix-lib')
var TreeView = require('../../../../ui/TreeView') // TODO setup a direct reference to the UI components
var EventManager = remixLib.EventManager
var csjs = require('csjs-inject')
var styleGuide = require('../../../../ui/styles-guide/theme-chooser')
var styles = styleGuide.chooser()
var css = csjs`
.title {
margin-top: 10px;
${styles.rightPanel.debuggerTab.dropdown_Debugger};
display: flex;
align-items: center;
}
.name {
font-weight: bold;
}
.nameDetail {
font-weight: bold;
margin-left: 3px;
}
.icon {
color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_Color};
margin-right: 5%;
}
.eyeButton {
margin: 3px;
}
.eyeButton:hover {
color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_HoverColor};
}
.dropdownpanel {
${styles.rightPanel.debuggerTab.dropdown_Debugger};
width: 100%;
}
.dropdownrawcontent {
padding: 2px;
word-break: break-all;
}
.message {
padding: 2px;
word-break: break-all;
}
.refresh {
display: none;
margin-left: 4px;
margin-top: 4px;
animation: spin 2s linear infinite;
}
`
function DropdownPanel (_name, _opts) {
this.event = new EventManager()
if (!_opts) {
_opts = {}
}
this.name = _name
this.header = ''
this.json = _opts.json
this.displayContentOnly = _opts.displayContentOnly
if (this.json) {
this.treeView = new TreeView(_opts)
}
this.view
}
DropdownPanel.prototype.setMessage = function (message) {
if (this.view) {
this.view.querySelector('.dropdownpanel .dropdownrawcontent').style.display = 'none'
this.view.querySelector('.dropdownpanel .dropdowncontent').style.display = 'none'
this.view.querySelector('.dropdownpanel .fa-refresh').style.display = 'none'
this.message(message)
}
}
DropdownPanel.prototype.setLoading = function () {
if (this.view) {
this.view.querySelector('.dropdownpanel .dropdownrawcontent').style.display = 'none'
this.view.querySelector('.dropdownpanel .dropdowncontent').style.display = 'none'
this.view.querySelector('.dropdownpanel .fa-refresh').style.display = 'inline-block'
this.message('')
}
}
DropdownPanel.prototype.setUpdating = function () {
if (this.view) {
this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = styles.appProperties.greyedText_color
}
}
DropdownPanel.prototype.update = function (_data, _header) {
if (this.view) {
this.view.querySelector('.dropdownpanel .fa-refresh').style.display = 'none'
this.view.querySelector('.dropdownpanel .dropdowncontent').style.display = 'block'
this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = styles.appProperties.mainText_Color
this.view.querySelector('.dropdownpanel .dropdownrawcontent').innerText = JSON.stringify(_data, null, '\t')
if (!this.displayContentOnly) {
this.view.querySelector('.title div.btn').style.display = 'block'
this.view.querySelector('.title span').innerText = _header || ' '
}
this.message('')
if (this.json) {
this.treeView.update(_data)
}
}
}
DropdownPanel.prototype.setContent = function (node) {
if (this.view) {
var parent = this.view.querySelector('.dropdownpanel div.dropdowncontent')
parent.replaceChild(node, parent.firstElementChild)
}
}
DropdownPanel.prototype.render = function (overridestyle) {
var content = yo`<div>Empty</div>`
if (this.json) {
content = this.treeView.render({})
}
overridestyle === undefined ? {} : overridestyle
var self = this
var title = !self.displayContentOnly ? yo`<div class="${css.title} title">
<div class="${css.icon} fa fa-caret-right" onclick=${function () { self.toggle() }} ></div>
<div class="${css.name}" onclick=${function () { self.toggle() }} >${this.name}</div><span class="${css.nameDetail}" onclick=${function () { self.toggle() }} ></span>
<div onclick=${function () { self.copyClipboard() }} title='raw' class="${css.eyeButton} btn fa fa-clipboard"></div>
</div>` : yo`<div></div>`
var contentNode = yo`<div class='dropdownpanel' style='display:none'>
<i class="${css.refresh} fa fa-refresh" aria-hidden="true"></i>
<div class='dropdowncontent'>${content}</div>
<div class='dropdownrawcontent' style='display:none'></div>
<div class='message' style='display:none'></div>
</div>`
var view = yo`
<div>
<style>
@-moz-keyframes spin {
to { -moz-transform: rotate(359deg); }
}
@-webkit-keyframes spin {
to { -webkit-transform: rotate(359deg); }
}
@keyframes spin {
to {transform:rotate(359deg);}
}
</style>
${title}
${contentNode}
</div>`
if (!this.view) {
this.view = view
}
if (self.displayContentOnly) contentNode.style.display = 'block'
return view
}
DropdownPanel.prototype.copyClipboard = function () {
var content = this.view.querySelector('.dropdownpanel .dropdownrawcontent')
if (content) copy(content.innerText ? content.innerText : content.textContent)
}
DropdownPanel.prototype.toggle = function () {
var el = this.view.querySelector('.dropdownpanel')
var caret = this.view.querySelector('.title').firstElementChild
if (el.style.display === '') {
el.style.display = 'none'
caret.className = `${css.icon} fa fa-caret-right`
this.event.trigger('hide', [])
} else {
el.style.display = ''
caret.className = `${css.icon} fa fa-caret-down`
this.event.trigger('show', [])
}
}
DropdownPanel.prototype.hide = function () {
if (this.view && !this.displayContentOnly) {
var caret = this.view.querySelector('.title').firstElementChild
var el = this.view.querySelector('.dropdownpanel')
el.style.display = 'none'
caret.className = `${css.icon} fa fa-caret-right`
this.event.trigger('hide', [])
}
}
DropdownPanel.prototype.show = function () {
if (this.view && !this.displayContentOnly) {
var caret = this.view.querySelector('.title').firstElementChild
var el = this.view.querySelector('.dropdownpanel')
el.style.display = ''
caret.className = `${css.icon} fa fa-caret-down`
this.event.trigger('show', [])
}
}
DropdownPanel.prototype.message = function (message) {
if (this.view) {
var mes = this.view.querySelector('.dropdownpanel .message')
mes.innerText = message
mes.style.display = (message === '') ? 'none' : 'block'
}
}
module.exports = DropdownPanel

@ -1,210 +0,0 @@
'use strict'
var TxBrowser = require('./TxBrowser')
var StepManager = require('./StepManager')
var remixLib = require('remix-lib')
var TraceManager = remixLib.trace.TraceManager
var VmDebugger = require('./VmDebugger')
var init = remixLib.init
var executionContext = remixLib.execution.executionContext
var EventManager = remixLib.EventManager
var yo = require('yo-yo')
var csjs = require('csjs-inject')
var Web3Providers = remixLib.vm.Web3Providers
var DummyProvider = remixLib.vm.DummyProvider
var CodeManager = remixLib.code.CodeManager
var remixDebug = require('remix-debug')
var SolidityProxy = remixDebug.SolidityDecoder.SolidityProxy
var InternalCallTree = remixDebug.SolidityDecoder.InternalCallTree
var css = csjs`
.statusMessage {
margin-left: 15px;
}
.innerShift {
padding: 2px;
margin-left: 10px;
}
`
function Ethdebugger (opts) {
this.opts = opts || {}
if (!this.opts.compilationResult) this.opts.compilationResult = () => { return null }
var self = this
this.event = new EventManager()
this.currentStepIndex = -1
this.tx
this.statusMessage = ''
this.view
this.web3Providers = new Web3Providers()
this.addProvider('DUMMYWEB3', new DummyProvider())
this.switchProvider('DUMMYWEB3')
this.traceManager = new TraceManager()
this.codeManager = new CodeManager(this.traceManager)
this.solidityProxy = new SolidityProxy(this.traceManager, this.codeManager)
var callTree = new InternalCallTree(this.event, this.traceManager, this.solidityProxy, this.codeManager, { includeLocalVariables: true })
this.callTree = callTree // TODO: currently used by browser solidity, we should improve the API
this.event.register('indexChanged', this, function (index) {
self.codeManager.resolveStep(index, self.tx)
})
this.txBrowser = new TxBrowser(this)
this.txBrowser.event.register('newTxLoading', this, function () {
self.unLoad()
})
this.txBrowser.event.register('newTraceRequested', this, function (blockNumber, txIndex, tx) {
console.dir('newTraceRequestd')
console.dir(arguments)
self.startDebugging(blockNumber, txIndex, tx)
})
this.txBrowser.event.register('unloadRequested', this, function (blockNumber, txIndex, tx) {
self.unLoad()
})
this.stepManager = new StepManager(this, this.traceManager)
this.stepManager.event.register('stepChanged', this, function (stepIndex) {
self.stepChanged(stepIndex)
})
this.vmDebugger = new VmDebugger(this, this.traceManager, this.codeManager, this.solidityProxy, callTree)
this.codeManager.event.register('changed', this, (code, address, instIndex) => {
this.callTree.sourceLocationTracker.getSourceLocationFromVMTraceIndex(address, this.currentStepIndex, this.solidityProxy.contracts, (error, sourceLocation) => {
if (!error) {
this.event.trigger('sourceLocationChanged', [sourceLocation])
}
})
})
}
Ethdebugger.prototype.setManagers = function () {
this.traceManager = new TraceManager({web3: this.web3})
this.codeManager = new CodeManager(this.traceManager)
this.solidityProxy = new SolidityProxy(this.traceManager, this.codeManager)
this.storageResolver = null
var callTree = new InternalCallTree(this.event, this.traceManager, this.solidityProxy, this.codeManager, { includeLocalVariables: true })
this.callTree = callTree // TODO: currently used by browser solidity, we should improve the API
this.vmDebugger = new VmDebugger(this, this.traceManager, this.codeManager, this.solidityProxy, callTree)
this.callTree = new InternalCallTree(this.event, this.traceManager, this.solidityProxy, this.codeManager, { includeLocalVariables: true })
}
Ethdebugger.prototype.setBreakpointManager = function (breakpointManager) {
this.breakpointManager = breakpointManager
}
Ethdebugger.prototype.web3 = function () {
return global.web3
}
Ethdebugger.prototype.addProvider = function (type, obj) {
this.web3Providers.addProvider(type, obj)
this.event.trigger('providerAdded', [type])
}
Ethdebugger.prototype.updateWeb3Reference = function () {
if (!this.txBrowser) return
this.txBrowser.web3 = this.web3
}
Ethdebugger.prototype.switchProvider = function (type) {
var self = this
this.web3Providers.get(type, function (error, obj) {
if (error) {
console.log('provider ' + type + ' not defined')
} else {
self.web3 = obj
self.setManagers()
self.updateWeb3Reference()
executionContext.detectNetwork((error, network) => {
if (error || !network) {
global.web3Debug = obj
} else {
var webDebugNode = init.web3DebugNode(network.name)
global.web3Debug = !webDebugNode ? obj : webDebugNode
}
self.updateWeb3Reference()
})
self.event.trigger('providerChanged', [type])
}
})
}
Ethdebugger.prototype.setCompilationResult = function (compilationResult) {
if (compilationResult && compilationResult.sources && compilationResult.contracts) {
this.solidityProxy.reset(compilationResult)
} else {
this.solidityProxy.reset({})
}
}
Ethdebugger.prototype.debug = function (tx) {
this.setCompilationResult(this.opts.compilationResult())
if (tx instanceof Object) {
this.txBrowser.load(tx.hash)
} else if (tx instanceof String) {
this.txBrowser.load(tx)
}
}
Ethdebugger.prototype.render = function () {
var view = yo`<div>
<div class="${css.innerShift}">
${this.txBrowser.render()}
${this.vmDebugger.renderHead()}
${this.stepManager.render()}
</div>
<div class="${css.statusMessage}" >${this.statusMessage}</div>
${this.vmDebugger.render()}
</div>`
if (!this.view) {
this.view = view
}
return view
}
Ethdebugger.prototype.unLoad = function () {
this.traceManager.init()
this.codeManager.clear()
this.stepManager.reset()
this.event.trigger('traceUnloaded')
}
Ethdebugger.prototype.stepChanged = function (stepIndex) {
this.currentStepIndex = stepIndex
this.event.trigger('indexChanged', [stepIndex])
}
Ethdebugger.prototype.startDebugging = function (blockNumber, txIndex, tx) {
console.dir('startDebugging')
console.dir(arguments)
if (this.traceManager.isLoading) {
return
}
this.setCompilationResult(this.opts.compilationResult())
this.statusMessage = 'Loading trace...'
yo.update(this.view, this.render())
console.log('loading trace...')
this.tx = tx
var self = this
console.dir('resolving a trace with tx: ')
console.dir(tx)
this.traceManager.resolveTrace(tx, function (error, result) {
console.log('trace loaded ' + result)
if (result) {
self.statusMessage = ''
yo.update(self.view, self.render())
self.event.trigger('newTraceLoaded', [self.traceManager.trace])
if (self.breakpointManager && self.breakpointManager.hasBreakpoint()) {
self.breakpointManager.jumpNextBreakpoint(0, false)
}
} else {
self.statusMessage = error ? error.message : 'Trace not loaded'
yo.update(self.view, self.render())
}
})
}
module.exports = Ethdebugger

@ -1,72 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var remixDebug = require('remix-debug')
var StorageViewer = remixDebug.storage.StorageViewer
var yo = require('yo-yo')
function FullStoragesChanges (_parent, _traceManager) {
this.storageResolver = null
this.parent = _parent
this.debugger = _parent.debugger
this.traceManager = _traceManager
this.addresses = []
this.view
this.traceLength
this.basicPanel = new DropdownPanel('Full Storages Changes', {json: true})
this.init()
}
FullStoragesChanges.prototype.render = function () {
var view = yo`<div id='fullstorageschangespanel' >${this.basicPanel.render()}</div>`
if (!this.view) {
this.view = view
}
return view
}
FullStoragesChanges.prototype.init = function () {
var self = this
this.debugger.event.register('newTraceLoaded', this, function (length) {
self.panels = []
self.traceManager.getAddresses(function (error, addresses) {
if (!error) {
self.addresses = addresses
self.basicPanel.update({})
}
})
self.traceManager.getLength(function (error, length) {
if (!error) {
self.traceLength = length
}
})
})
this.debugger.event.register('indexChanged', this, function (index) {
if (index < 0) return
if (self.parent.currentStepIndex !== index) return
if (!self.storageResolver) return
if (index === self.traceLength - 1) {
var storageJSON = {}
for (var k in self.addresses) {
var address = self.addresses[k]
var storageViewer = new StorageViewer({
stepIndex: self.parent.currentStepIndex,
tx: self.parent.tx,
address: address
}, self.storageResolver, self.traceManager)
storageViewer.storageRange(function (error, result) {
if (!error) {
storageJSON[address] = result
self.basicPanel.update(storageJSON)
}
})
}
} else {
self.basicPanel.update({})
}
})
}
module.exports = FullStoragesChanges

@ -1,39 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var remixLib = require('remix-lib')
var ui = remixLib.helpers.ui
var yo = require('yo-yo')
function MemoryPanel (_parent, _traceManager) {
this.parent = _parent
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Memory', {
json: true,
css: {
'font-family': 'monospace'
}})
this.init()
}
MemoryPanel.prototype.render = function () {
return yo`<div id='memorypanel' >${this.basicPanel.render()}</div>`
}
MemoryPanel.prototype.init = function () {
var self = this
this.parent.event.register('indexChanged', this, function (index) {
if (index < 0) return
if (self.parent.currentStepIndex !== index) return
self.traceManager.getMemoryAt(index, function (error, memory) {
if (error) {
console.log(error)
self.basicPanel.update({})
} else if (self.parent.currentStepIndex === index) {
self.basicPanel.update(ui.formatMemory(memory, 16))
}
})
})
}
module.exports = MemoryPanel

@ -1,75 +0,0 @@
'use strict'
var remixLib = require('remix-lib')
var EventManager = remixLib.EventManager
var yo = require('yo-yo')
class Slider {
constructor (_traceManager, _stepOverride) {
this.event = new EventManager()
this.traceManager = _traceManager
this.max
this.disabled = true
this.view
this.solidityMode = false
this.stepOverride = _stepOverride
this.previousValue = null
}
render () {
var self = this
var view = yo`<div>
<input
id='slider'
style='width: 100%'
type='range'
min=0
max=${this.max}
value=0
onchange=${function () { self.onChange() }}
oninput=${function () { self.onChange() }}
disabled=${this.disabled} />
</div>`
if (!this.view) {
this.view = view
}
return view
}
init (length) {
var slider = this.view.querySelector('#slider')
slider.setAttribute('max', length - 1)
this.max = length - 1
this.updateDisabled(length === 0)
this.disabled = length === 0
this.setValue(0)
}
onChange (event) {
var value = parseInt(this.view.querySelector('#slider').value)
if (this.stepOverride) {
var correctedValue = this.stepOverride(value)
if (correctedValue !== value) {
this.setValue(correctedValue)
value = correctedValue
}
}
if (value === this.previousValue) return
this.previousValue = value
this.event.trigger('moved', [value])
}
setValue (value) {
this.view.querySelector('#slider').value = value
}
updateDisabled (disabled) {
if (disabled) {
this.view.querySelector('#slider').setAttribute('disabled', true)
} else {
this.view.querySelector('#slider').removeAttribute('disabled')
}
}
}
module.exports = Slider

@ -1,83 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var remixDebug = require('remix-debug')
var localDecoder = remixDebug.SolidityDecoder.localDecoder
var solidityTypeFormatter = require('./SolidityTypeFormatter')
var StorageViewer = remixDebug.storage.StorageViewer
var yo = require('yo-yo')
class SolidityLocals {
constructor (_parent, _traceManager, _internalTreeCall) {
this.parent = _parent
this.internalTreeCall = _internalTreeCall
this.storageResolver = null
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Solidity Locals', {
json: true,
formatSelf: solidityTypeFormatter.formatSelf,
extractData: solidityTypeFormatter.extractData
})
this.init()
this.view
}
render () {
this.view = yo`<div id='soliditylocals' >
${this.basicPanel.render()}
</div>`
return this.view
}
init () {
var decodeTimeout = null
this.parent.event.register('sourceLocationChanged', this, (sourceLocation) => {
if (!this.storageResolver) {
this.basicPanel.setMessage('storage not ready')
return
}
if (decodeTimeout) {
window.clearTimeout(decodeTimeout)
}
this.basicPanel.setUpdating()
decodeTimeout = setTimeout(() => {
decode(this, sourceLocation)
}, 500)
})
}
}
function decode (self, sourceLocation) {
self.basicPanel.setMessage('')
self.traceManager.waterfall([
self.traceManager.getStackAt,
self.traceManager.getMemoryAt,
self.traceManager.getCurrentCalledAddressAt],
self.parent.currentStepIndex,
(error, result) => {
if (!error) {
var stack = result[0].value
var memory = result[1].value
try {
var storageViewer = new StorageViewer({
stepIndex: self.parent.currentStepIndex,
tx: self.parent.tx,
address: result[2].value
}, self.storageResolver, self.traceManager)
localDecoder.solidityLocals(self.parent.currentStepIndex, self.internalTreeCall, stack, memory, storageViewer, sourceLocation).then((locals) => {
if (!locals.error) {
self.basicPanel.update(locals)
}
if (!Object.keys(locals).length) {
self.basicPanel.setMessage('no locals')
}
})
} catch (e) {
self.basicPanel.setMessage(e.message)
}
} else {
console.log(error)
}
})
}
module.exports = SolidityLocals

@ -1,103 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var remixDebug = require('remix-debug')
var stateDecoder = remixDebug.SolidityDecoder.stateDecoder
var solidityTypeFormatter = require('./SolidityTypeFormatter')
var StorageViewer = remixDebug.storage.StorageViewer
var yo = require('yo-yo')
function SolidityState (_parent, _traceManager, _codeManager, _solidityProxy) {
this.storageResolver = null
this.parent = _parent
this.traceManager = _traceManager
this.codeManager = _codeManager
this.solidityProxy = _solidityProxy
this.basicPanel = new DropdownPanel('Solidity State', {
json: true,
formatSelf: solidityTypeFormatter.formatSelf,
extractData: solidityTypeFormatter.extractData
})
this.init()
this.view
this.stateVariablesByAddresses = {}
_parent.event.register('traceUnloaded', () => { this.stateVariablesByAddresses = {} })
_parent.event.register('newTraceLoaded', () => { this.stateVariablesByAddresses = {} })
}
SolidityState.prototype.render = function () {
if (!this.view) {
this.view = yo`<div id='soliditystate' >
${this.basicPanel.render()}
</div>`
}
return this.view
}
SolidityState.prototype.init = function () {
var self = this
var decodeTimeout = null
this.parent.event.register('indexChanged', this, function (index) {
if (index < 0) {
self.basicPanel.setMessage('invalid step index')
return
}
if (self.parent.currentStepIndex !== index) return
if (!self.solidityProxy.loaded()) {
self.basicPanel.setMessage('no source has been specified')
return
}
if (!self.storageResolver) {
return
}
if (decodeTimeout) {
window.clearTimeout(decodeTimeout)
}
self.basicPanel.setUpdating()
decodeTimeout = setTimeout(() => {
decode(self, index)
}, 500)
})
}
function decode (self, index) {
self.traceManager.getCurrentCalledAddressAt(self.parent.currentStepIndex, (error, address) => {
if (error) {
self.basicPanel.update({})
console.log(error)
} else {
if (self.stateVariablesByAddresses[address]) {
extractStateVariables(self, self.stateVariablesByAddresses[address], address)
} else {
self.solidityProxy.extractStateVariablesAt(index, function (error, stateVars) {
if (error) {
self.basicPanel.update({})
console.log(error)
} else {
self.stateVariablesByAddresses[address] = stateVars
extractStateVariables(self, stateVars, address)
}
})
}
}
})
}
function extractStateVariables (self, stateVars, address) {
var storageViewer = new StorageViewer({
stepIndex: self.parent.currentStepIndex,
tx: self.parent.tx,
address: address
}, self.storageResolver, self.traceManager)
stateDecoder.decodeState(stateVars, storageViewer).then((result) => {
self.basicPanel.setMessage('')
if (!result.error) {
self.basicPanel.update(result)
} else {
self.basicPanel.setMessage(result.error)
}
})
}
module.exports = SolidityState

@ -1,71 +0,0 @@
'use strict'
var yo = require('yo-yo')
var BN = require('ethereumjs-util').BN
module.exports = {
formatSelf: formatSelf,
extractData: extractData
}
function formatSelf (key, data) {
var style = fontColor(data)
var keyStyle = data.isProperty ? 'color:#847979' : ''
if (data.type === 'string') {
data.self = JSON.stringify(data.self)
}
return yo`<label style=${keyStyle}>${key}: <label style=${style}>${data.self}</label><label style='font-style:italic'> ${data.isProperty || !data.type ? '' : ' ' + data.type}</label></label>`
}
function extractData (item, parent, key) {
var ret = {}
if (item.isProperty) {
return item
}
if (item.type.lastIndexOf(']') === item.type.length - 1) {
ret.children = (item.value || []).map(function (item, index) {
return {key: index, value: item}
})
ret.children.unshift({
key: 'length',
value: {
self: (new BN(item.length.replace('0x', ''), 16)).toString(10),
type: 'uint',
isProperty: true
}
})
ret.isArray = true
ret.self = parent.isArray ? '' : item.type
} else if (item.type.indexOf('struct') === 0) {
ret.children = Object.keys((item.value || {})).map(function (key) {
return {key: key, value: item.value[key]}
})
ret.self = item.type
ret.isStruct = true
} else if (item.type.indexOf('mapping') === 0) {
ret.children = Object.keys((item.value || {})).map(function (key) {
return {key: key, value: item.value[key]}
})
ret.isMapping = true
ret.self = item.type
} else {
ret.children = null
ret.self = item.value
ret.type = item.type
}
return ret
}
function fontColor (data) {
var color = '#124B46'
if (data.isArray || data.isStruct || data.isMapping) {
color = '#847979'
} else if (data.type.indexOf('uint') === 0 ||
data.type.indexOf('int') === 0 ||
data.type.indexOf('bool') === 0 ||
data.type.indexOf('enum') === 0) {
color = '#0F0CE9'
} else if (data.type === 'string') {
color = '#E91E0C'
}
return 'color:' + color
}

@ -1,33 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var yo = require('yo-yo')
function StackPanel (_parent, _traceManager) {
this.parent = _parent
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Stack', {json: true, displayContentOnly: false})
this.init()
}
StackPanel.prototype.render = function () {
return yo`<div id='stackpanel' >${this.basicPanel.render()}</div>`
}
StackPanel.prototype.init = function () {
var self = this
this.parent.event.register('indexChanged', this, function (index) {
if (index < 0) return
if (self.parent.currentStepIndex !== index) return
self.traceManager.getStackAt(index, function (error, stack) {
if (error) {
self.basicPanel.update({})
console.log(error)
} else if (self.parent.currentStepIndex === index) {
self.basicPanel.update(stack)
}
})
})
}
module.exports = StackPanel

@ -1,101 +0,0 @@
'use strict'
var yo = require('yo-yo')
var DropdownPanel = require('./DropdownPanel')
function StepDetail (_parentUI, _traceManager) {
this.debugger = _parentUI.debugger
this.parentUI = _parentUI
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Step detail', {json: true, displayContentOnly: true})
this.detail = initDetail()
this.view
this.init()
}
StepDetail.prototype.render = function () {
return yo`<div id='stepdetail' >${this.basicPanel.render()}</div>`
}
StepDetail.prototype.init = function () {
var self = this
this.debugger.event.register('traceUnloaded', this, function () {
self.detail = initDetail()
self.basicPanel.update(self.detail)
})
this.debugger.event.register('newTraceLoaded', this, function () {
self.detail = initDetail()
self.basicPanel.update(self.detail)
})
this.parentUI.event.register('indexChanged', this, function (index) {
if (index < 0) return
self.detail['vm trace step'] = index
self.traceManager.getCurrentStep(index, function (error, step) {
if (error) {
console.log(error)
self.detail['execution step'] = '-'
} else {
self.detail['execution step'] = step
}
self.basicPanel.update(self.detail)
})
self.traceManager.getMemExpand(index, function (error, addmem) {
if (error) {
console.log(error)
self.detail['add memory'] = '-'
} else {
self.detail['add memory'] = addmem
}
self.basicPanel.update(self.detail)
})
self.traceManager.getStepCost(index, function (error, gas) {
if (error) {
console.log(error)
self.detail.gas = '-'
} else {
self.detail.gas = gas
}
self.basicPanel.update(self.detail)
})
self.traceManager.getCurrentCalledAddressAt(index, function (error, address) {
if (error) {
console.log(error)
self.detail['loaded address'] = '-'
} else {
self.detail['loaded address'] = address
}
self.basicPanel.update(self.detail)
})
self.traceManager.getRemainingGas(index, function (error, remaingas) {
if (error) {
console.log(error)
self.detail['remaining gas'] = '-'
} else {
self.detail['remaining gas'] = remaingas
}
self.basicPanel.update(self.detail)
})
})
}
module.exports = StepDetail
function initDetail () {
return {
'vm trace step': '-',
'execution step': '-',
'add memory': '',
'gas': '',
'remaining gas': '-',
'loaded address': '-'
}
}

@ -1,205 +0,0 @@
'use strict'
var ButtonNavigator = require('./ButtonNavigator')
var Slider = require('./Slider')
var remixLib = require('remix-lib')
var EventManager = remixLib.EventManager
var yo = require('yo-yo')
var util = remixLib.util
function StepManager (_parent, _traceManager) {
this.event = new EventManager()
this.parent = _parent.debugger
this.traceManager = _traceManager
this.sourceMapByAddress = {}
this.solidityMode = false
var self = this
this.parent.event.register('newTraceLoaded', this, function () {
if (!this.slider) return
self.traceManager.getLength(function (error, length) {
if (error) {
console.log(error)
} else {
self.slider.init(length)
self.init()
}
})
})
this.slider = new Slider(this.traceManager, (step) => {
return this.solidityMode ? this.resolveToReducedTrace(step, 0) : step
})
this.slider.event.register('moved', this, function (step) {
self.sliderMoved(step)
})
this.parent.callTree.event.register('callTreeReady', () => {
if (!this.slider) return
if (this.parent.callTree.functionCallStack.length) {
this.jumpTo(this.parent.callTree.functionCallStack[0])
}
})
this.buttonNavigator = new ButtonNavigator(_parent, this.traceManager)
this.buttonNavigator.event.register('stepIntoBack', this, function () {
self.stepIntoBack()
})
this.buttonNavigator.event.register('stepIntoForward', this, function () {
self.stepIntoForward()
})
this.buttonNavigator.event.register('stepOverBack', this, function () {
self.stepOverBack()
})
this.buttonNavigator.event.register('stepOverForward', this, function () {
self.stepOverForward()
})
this.buttonNavigator.event.register('jumpOut', this, function () {
self.jumpOut()
})
this.buttonNavigator.event.register('jumpToException', this, function (exceptionIndex) {
self.jumpTo(exceptionIndex)
})
this.buttonNavigator.event.register('jumpNextBreakpoint', (exceptionIndex) => {
self.parent.breakpointManager.jumpNextBreakpoint(_parent.currentStepIndex, true)
})
this.buttonNavigator.event.register('jumpPreviousBreakpoint', (exceptionIndex) => {
self.parent.breakpointManager.jumpPreviousBreakpoint(_parent.currentStepIndex, true)
})
}
StepManager.prototype.remove = function () {
// used to stop listenning on event. bad and should be "refactored"
this.slider.view = null
this.slider = null
this.buttonNavigator.view = null
this.buttonNavigator = null
}
StepManager.prototype.resolveToReducedTrace = function (value, incr) {
if (this.parent.callTree.reducedTrace.length) {
var nextSource = util.findClosestIndex(value, this.parent.callTree.reducedTrace)
nextSource = nextSource + incr
if (nextSource <= 0) {
nextSource = 0
} else if (nextSource > this.parent.callTree.reducedTrace.length) {
nextSource = this.parent.callTree.reducedTrace.length - 1
}
return this.parent.callTree.reducedTrace[nextSource]
}
return value
}
StepManager.prototype.render = function () {
return yo`<div>
${this.slider.render()}
${this.buttonNavigator.render()}
</div>`
}
StepManager.prototype.reset = function () {
this.slider.setValue(0)
this.currentStepIndex = 0
this.buttonNavigator.reset()
}
StepManager.prototype.init = function () {
this.slider.setValue(0)
this.changeState(0)
}
StepManager.prototype.newTraceAvailable = function () {
this.init()
}
StepManager.prototype.jumpTo = function (step) {
if (!this.traceManager.inRange(step)) {
return
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.sliderMoved = function (step) {
if (!this.traceManager.inRange(step)) {
return
}
this.changeState(step)
}
StepManager.prototype.stepIntoForward = function () {
if (!this.traceManager.isLoaded()) {
return
}
var step = this.currentStepIndex
if (this.solidityMode) {
step = this.resolveToReducedTrace(step, 1)
} else {
step += 1
}
if (!this.traceManager.inRange(step)) {
return
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.stepIntoBack = function () {
if (!this.traceManager.isLoaded()) {
return
}
var step = this.currentStepIndex
if (this.solidityMode) {
step = this.resolveToReducedTrace(step, -1)
} else {
step -= 1
}
if (!this.traceManager.inRange(step)) {
return
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.stepOverForward = function () {
if (!this.traceManager.isLoaded()) {
return
}
var step = this.traceManager.findStepOverForward(this.currentStepIndex)
if (this.solidityMode) {
step = this.resolveToReducedTrace(step, 1)
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.stepOverBack = function () {
if (!this.traceManager.isLoaded()) {
return
}
var step = this.traceManager.findStepOverBack(this.currentStepIndex)
if (this.solidityMode) {
step = this.resolveToReducedTrace(step, -1)
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.jumpOut = function () {
if (!this.traceManager.isLoaded()) {
return
}
var step = this.traceManager.findStepOut(this.currentStepIndex)
if (this.solidityMode) {
step = this.resolveToReducedTrace(step, 0)
}
this.slider.setValue(step)
this.changeState(step)
}
StepManager.prototype.changeState = function (step) {
this.currentStepIndex = step
this.buttonNavigator.stepChanged(step)
this.event.trigger('stepChanged', [step])
}
module.exports = StepManager

@ -1,50 +0,0 @@
'use strict'
var DropdownPanel = require('./DropdownPanel')
var remixDebug = require('remix-debug')
var StorageViewer = remixDebug.storage.StorageViewer
var yo = require('yo-yo')
function StoragePanel (_parent, _traceManager) {
this.parent = _parent
this.storageResolver = null
this.traceManager = _traceManager
this.basicPanel = new DropdownPanel('Storage', {json: true})
this.init()
this.disabled = false
}
StoragePanel.prototype.render = function () {
return yo`<div id='storagepanel' >${this.basicPanel.render()}</div>`
}
StoragePanel.prototype.init = function () {
var self = this
this.parent.event.register('indexChanged', this, function (index) {
if (self.disabled) return
if (index < 0) return
if (self.parent.currentStepIndex !== index) return
if (!self.storageResolver) return
this.traceManager.getCurrentCalledAddressAt(index, (error, address) => {
if (!error) {
var storageViewer = new StorageViewer({
stepIndex: self.parent.currentStepIndex,
tx: self.parent.tx,
address: address
}, self.storageResolver, self.traceManager)
storageViewer.storageRange((error, storage) => {
if (error) {
console.log(error)
self.basicPanel.update({})
} else if (self.parent.currentStepIndex === index) {
var header = storageViewer.isComplete(address) ? 'completely loaded' : 'partially loaded...'
self.basicPanel.update(storage, header)
}
})
}
})
})
}
module.exports = StoragePanel

@ -1,206 +0,0 @@
var remixLib = require('remix-lib')
var EventManager = remixLib.EventManager
var traceHelper = remixLib.helpers.trace
var yo = require('yo-yo')
var init = remixLib.init
var csjs = require('csjs-inject')
var styleGuide = require('../../../../ui/styles-guide/theme-chooser')
var styles = styleGuide.chooser()
var css = csjs`
.container {
display: flex;
flex-direction: column;
}
.txContainer {
display: flex;
flex-direction: column;
}
.txinputs {
width: 100%;
display: flex;
justify-content: center;
}
.txinput {
${styles.rightPanel.debuggerTab.input_Debugger}
margin: 3px;
width: inherit;
}
.txbuttons {
width: 100%;
display: flex;
justify-content: center;
}
.txbutton {
${styles.rightPanel.debuggerTab.button_Debugger}
width: inherit;
}
.txbuttonstart {
${styles.rightPanel.debuggerTab.button_Debugger}
}
.txbutton:hover {
color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_HoverColor};
}
.vmargin {
margin-top: 10px;
margin-bottom: 10px;
}
`
function TxBrowser (_parent, opts) {
this.event = new EventManager()
this.blockNumber
this.txNumber
this.view
this.displayConnectionSetting = opts.displayConnectionSetting
this.web3 = opts.web3
var self = this
_parent.event.register('providerChanged', this, function (provider) {
self.setDefaultValues()
if (self.view) {
yo.update(self.view, self.render())
}
})
}
// creation 0xa9619e1d0a35b2c1d686f5b661b3abd87f998d2844e8e9cc905edb57fc9ce349
// invokation 0x71a6d583d16d142c5c3e8903060e8a4ee5a5016348a9448df6c3e63b68076ec4 0xcda2b2835add61af54cf83bd076664d98d7908c6cd98d86423b3b48d8b8e51ff
// test:
// creation: 0x72908de76f99fca476f9e3a3b5d352f350a98cd77d09cebfc59ffe32a6ecaa0b
// invokation: 0x20ef65b8b186ca942fcccd634f37074dde49b541c27994fc7596740ef44cfd51
TxBrowser.prototype.setDefaultValues = function () {
this.connectInfo = ''
if (this.view) {
yo.update(this.view, this.render())
}
}
TxBrowser.prototype.submit = function (tx) {
var self = this
self.event.trigger('newTxLoading', [this.blockNumber, this.txNumber])
if (tx) {
return self.update(null, tx)
}
if (!this.txNumber) {
self.update('no tx index or tx hash to look for')
return
}
try {
if (this.txNumber.indexOf('0x') !== -1) {
self.web3.eth.getTransaction(this.txNumber, function (error, result) {
self.update(error, result)
})
} else {
self.web3.eth.getTransactionFromBlock(this.blockNumber, this.txNumber, function (error, result) {
self.update(error, result)
})
}
} catch (e) {
self.update(e.message)
}
}
TxBrowser.prototype.update = function (error, tx) {
var info = {}
if (error) {
this.view.querySelector('#error').innerHTML = error
} else {
if (tx) {
this.view.querySelector('#error').innerHTML = ''
if (!tx.to) {
tx.to = traceHelper.contractCreationToken('0')
}
info.from = tx.from
info.to = tx.to
info.hash = tx.hash
this.event.trigger('newTraceRequested', [this.blockNumber, this.txNumber, tx])
} else {
var mes = '<not found>'
info.from = mes
info.to = mes
info.hash = mes
this.view.querySelector('#error').innerHTML = 'Cannot find transaction with reference. Block number: ' + this.blockNumber + '. Transaction index/hash: ' + this.txNumber
}
}
}
TxBrowser.prototype.updateWeb3Url = function (newhost) {
init.setProvider(global.web3, newhost)
var self = this
this.checkWeb3(function (error, block) {
if (!error) {
self.connectInfo = 'Connected to ' + global.web3.currentProvider.host + '. Current block number: ' + block
} else {
self.connectInfo = 'Unable to connect to ' + global.web3.currentProvider.host + '. ' + error.message
}
yo.update(self.view, self.render())
})
}
TxBrowser.prototype.checkWeb3 = function (callback) {
try {
global.web3.eth.getBlockNumber(function (error, block) {
callback(error, block)
})
} catch (e) {
console.log(e)
callback(e.message, null)
}
}
TxBrowser.prototype.updateBlockN = function (ev) {
this.blockNumber = ev.target.value
}
TxBrowser.prototype.updateTxN = function (ev) {
this.txNumber = ev.target.value
}
TxBrowser.prototype.load = function (txHash, tx) {
this.txNumber = txHash
this.submit(tx)
}
TxBrowser.prototype.unload = function (txHash) {
this.event.trigger('unloadRequested')
this.init()
}
TxBrowser.prototype.init = function (ev) {
this.setDefaultValues()
}
TxBrowser.prototype.connectionSetting = function () {
if (this.displayConnectionSetting) {
var self = this
return yo`<div class="${css.vmargin}"><span>Node URL: </span><input onkeyup=${function () { self.updateWeb3Url(arguments[0].target.value) }} value=${global.web3.currentProvider ? global.web3.currentProvider.host : ' - none - '} type='text' />
<span>${this.connectInfo}</span></div>`
} else {
return ''
}
}
TxBrowser.prototype.render = function () {
var self = this
var view = yo`<div class="${css.container}">
${this.connectionSetting()}
<div class="${css.txContainer}">
<div class="${css.txinputs}">
<input class="${css.txinput}" onkeyup=${function () { self.updateBlockN(arguments[0]) }} type='text' placeholder=${'Block number'} />
<input class="${css.txinput}" id='txinput' onkeyup=${function () { self.updateTxN(arguments[0]) }} type='text' placeholder=${'Transaction index or hash'} />
</div>
<div class="${css.txbuttons}">
<button id='load' class='${css.txbutton}' title='start debugging' onclick=${function () { self.submit() }}>Start debugging</button>
<button id='unload' class='${css.txbutton}' title='stop debugging' onclick=${function () { self.unload() }}>Stop</button>
</div>
</div>
<span id='error'></span>
</div>`
if (!this.view) {
this.view = view
}
return view
}
module.exports = TxBrowser

@ -1,126 +0,0 @@
'use strict'
var csjs = require('csjs-inject')
var CodeListView = require('./CodeListView')
var CalldataPanel = require('./CalldataPanel')
var MemoryPanel = require('./MemoryPanel')
var CallstackPanel = require('./CallstackPanel')
var StackPanel = require('./StackPanel')
var StoragePanel = require('./StoragePanel')
var FullStoragesChangesPanel = require('./FullStoragesChanges')
var StepDetail = require('./StepDetail')
var DropdownPanel = require('./DropdownPanel')
var SolidityState = require('./SolidityState')
var SolidityLocals = require('./SolidityLocals')
var remixDebug = require('remix-debug')
var StorageResolver = remixDebug.storage.StorageResolver
var yo = require('yo-yo')
var css = csjs`
.asmCode {
float: left;
width: 50%;
}
.stepDetail {
}
.vmheadView {
margin-top:10px;
}
`
function VmDebugger (_parentUI, _traceManager, _codeManager, _solidityProxy, _callTree) {
let _parent = _parentUI.debugger
var self = this
this.view
this.asmCode = new CodeListView(_parent, _codeManager)
this.stackPanel = new StackPanel(_parentUI, _traceManager)
this.storagePanel = new StoragePanel(_parentUI, _traceManager)
this.memoryPanel = new MemoryPanel(_parentUI, _traceManager)
this.calldataPanel = new CalldataPanel(_parentUI, _traceManager)
this.callstackPanel = new CallstackPanel(_parentUI, _traceManager)
this.stepDetail = new StepDetail(_parentUI, _traceManager)
this.solidityState = new SolidityState(_parentUI, _traceManager, _codeManager, _solidityProxy)
this.solidityLocals = new SolidityLocals(_parentUI, _traceManager, _callTree)
/* Return values - */
this.returnValuesPanel = new DropdownPanel('Return Value', {json: true})
this.returnValuesPanel.data = {}
_parentUI.event.register('indexChanged', this.returnValuesPanel, function (index) {
if (!self.view) return
var innerself = this
_traceManager.getReturnValue(index, function (error, returnValue) {
if (error) {
innerself.update([error])
} else if (_parentUI.currentStepIndex === index) {
innerself.update([returnValue])
}
})
})
/* Return values - */
this.fullStoragesChangesPanel = new FullStoragesChangesPanel(_parentUI, _traceManager)
_parent.event.register('newTraceLoaded', this, function () {
if (!self.view) return
var storageResolver = new StorageResolver({web3: _parent.web3})
self.storagePanel.storageResolver = storageResolver
self.solidityState.storageResolver = storageResolver
self.solidityLocals.storageResolver = storageResolver
self.fullStoragesChangesPanel.storageResolver = storageResolver
self.asmCode.basicPanel.show()
self.stackPanel.basicPanel.show()
self.storagePanel.basicPanel.show()
self.memoryPanel.basicPanel.show()
self.calldataPanel.basicPanel.show()
self.callstackPanel.basicPanel.show()
})
_parent.event.register('traceUnloaded', this, function () {
if (!self.view) return
})
_parent.callTree.event.register('callTreeReady', () => {
if (!self.view) return
if (_parent.callTree.reducedTrace.length) {
self.solidityLocals.basicPanel.show()
self.solidityState.basicPanel.show()
}
})
}
VmDebugger.prototype.renderHead = function () {
var headView = yo`<div id='vmheadView' class=${css.vmheadView}>
<div>
<div class=${css.asmCode}>${this.asmCode.render()}</div>
<div class=${css.stepDetail}>${this.stepDetail.render()}</div>
</div>
</div>`
if (!this.headView) {
this.headView = headView
}
return headView
}
VmDebugger.prototype.remove = function () {
// used to stop listenning on event. bad and should be "refactored"
this.view = null
}
VmDebugger.prototype.render = function () {
var view = yo`<div id='vmdebugger'>
<div>
${this.solidityLocals.render()}
${this.solidityState.render()}
${this.stackPanel.render()}
${this.memoryPanel.render()}
${this.storagePanel.render()}
${this.callstackPanel.render()}
${this.calldataPanel.render()}
${this.returnValuesPanel.render()}
${this.fullStoragesChangesPanel.render()}
</div>
</div>`
if (!this.view) {
this.view = view
}
return view
}
module.exports = VmDebugger

@ -10,7 +10,7 @@ var globalRegistry = require('../global/registry')
var SourceHighlighter = require('../app/editor/sourceHighlighter')
var RemixDebug = require('remix-debug').EthDebugger
var TreeView = require('../app/ui/TreeView') // TODO setup a direct reference to the UI components
var solidityTypeFormatter = require('../app/debugger/remix-debugger/src/ui/SolidityTypeFormatter')
var solidityTypeFormatter = require('../app/debugger/debuggerUI/vmDebugger/utils/SolidityTypeFormatter')
class CmdInterpreterAPI {
constructor (terminal, localRegistry) {

Loading…
Cancel
Save