use new tx browser; move code to upper class

pull/3094/head
Iuri Matias 6 years ago committed by yann300
parent ba7efb0820
commit dd9edcf379
  1. 39
      src/app/debugger/debuggerUI.js
  2. 206
      src/app/debugger/debuggerUI/TxBrowser.js
  3. 1
      src/app/debugger/remix-debugger/index.js
  4. 49
      src/app/debugger/remix-debugger/src/ui/EthdebuggerUI.js

@ -1,6 +1,9 @@
var OldEthdebuggerUI = require('./remix-debugger/src/ui/EthdebuggerUI')
var Debugger = require('../debugger/debugger')
var SourceHighlighter = require('../editor/sourceHighlighter')
var TxBrowser = require('./debuggerUI/TxBrowser')
var remixLib = require('remix-lib')
var executionContext = remixLib.execution.executionContext
class DebuggerUI {
@ -8,7 +11,12 @@ class DebuggerUI {
this.transactionDebugger = new Debugger(new SourceHighlighter())
this.isActive = false
this.debugger_ui = new OldEthdebuggerUI({debugger: this.transactionDebugger.debugger})
this.debugger_ui = new OldEthdebuggerUI({
debugger: this.transactionDebugger.debugger
})
this.startTxBrowser()
container.appendChild(this.debugger_ui.render())
this.listenToEvents()
@ -29,6 +37,25 @@ class DebuggerUI {
})
}
startTxBrowser () {
const self = this
let txBrowser = new TxBrowser(this.debugger_ui, {displayConnectionSetting: false, web3: executionContext.web3()})
this.debugger_ui.txBrowser = txBrowser
txBrowser.event.register('newTxLoading', this, function () {
self.debugger_ui.unLoad()
})
txBrowser.event.register('newTraceRequested', this, function (blockNumber, txIndex, tx) {
self.debugger_ui.startDebugging(blockNumber, txIndex, tx)
})
txBrowser.event.register('unloadRequested', this, function (blockNumber, txIndex, tx) {
self.debugger_ui.unLoad()
})
this.txBrowser = this.debugger_ui.txBrowser
}
view () {
return this.transactionDebugger
}
@ -43,7 +70,15 @@ class DebuggerUI {
if (error) {
return console.error("coudn't get txHash: " + error)
}
self.debugger_ui.debug(tx)
self.transactionDebugger.debugger.solidityProxy.reset({})
if (tx instanceof Object) {
self.txBrowser.load(tx.hash, tx)
} else if (tx instanceof String) {
self.txBrowser.load(tx)
}
// self.debugger_ui.debug(tx)
})
}
}

@ -0,0 +1,206 @@
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,4 +1,5 @@
'use strict'
// TODO: this file doesn't seem to be used any more and can be removed
var VMDebugger = require('./src/ui/VmDebugger')
var Debugger = require('./src/ui/EthdebuggerUI')
var DebuggerBackend = require('remix-debug').EthDebugger

@ -1,5 +1,5 @@
'use strict'
var TxBrowser = require('./TxBrowser')
// var TxBrowser = require('./TxBrowser')
var StepManager = require('./StepManager')
var VmDebugger = require('./VmDebugger')
@ -24,7 +24,7 @@ function EthdebuggerUI (opts) {
this.opts = opts || {}
this.debugger = opts.debugger
if (!this.opts.compilationResult) this.opts.compilationResult = () => { return null }
// if (!this.opts.compilationResult) this.opts.compilationResult = () => { return null }
var self = this
this.event = new EventManager()
@ -42,17 +42,6 @@ function EthdebuggerUI (opts) {
executionContext.event.register('contextChanged', this, function () {
self.updateWeb3Reference()
})
this.txBrowser = new TxBrowser(this, {displayConnectionSetting: false, web3: executionContext.web3()})
this.txBrowser.event.register('newTxLoading', this, function () {
self.unLoad()
})
this.txBrowser.event.register('newTraceRequested', this, function (blockNumber, txIndex, tx) {
self.startDebugging(blockNumber, txIndex, tx)
})
this.txBrowser.event.register('unloadRequested', this, function (blockNumber, txIndex, tx) {
self.unLoad()
})
}
EthdebuggerUI.prototype.setBreakpointManager = function (breakpointManager) {
@ -68,22 +57,24 @@ EthdebuggerUI.prototype.updateWeb3Reference = function (web3) {
this.txBrowser.web3 = web3 || executionContext.web3()
}
EthdebuggerUI.prototype.setCompilationResult = function (compilationResult) {
if (compilationResult && compilationResult.sources && compilationResult.contracts) {
this.debugger.solidityProxy.reset(compilationResult)
} else {
this.debugger.solidityProxy.reset({})
}
}
EthdebuggerUI.prototype.debug = function (tx) {
this.setCompilationResult(this.opts.compilationResult())
if (tx instanceof Object) {
this.txBrowser.load(tx.hash, tx)
} else if (tx instanceof String) {
this.txBrowser.load(tx)
}
}
// EthdebuggerUI.prototype.setCompilationResult = function (compilationResult) {
// if (compilationResult && compilationResult.sources && compilationResult.contracts) {
// this.debugger.solidityProxy.reset(compilationResult)
// } else {
// this.debugger.solidityProxy.reset({})
// }
// }
// EthdebuggerUI.prototype.debug = function (tx) {
// // this.setCompilationResult(this.opts.compilationResult())
//
// this.debugger.solidityProxy.reset({})
// if (tx instanceof Object) {
// this.txBrowser.load(tx.hash, tx)
// } else if (tx instanceof String) {
// this.txBrowser.load(tx)
// }
// }
EthdebuggerUI.prototype.render = function () {
this.debuggerPanelsView = yo`<div class="${css.innerShift}"></div>`

Loading…
Cancel
Save