Merge pull request #2006 from ethereum/master_l

src/app/debugger/debuggerUI/TxBrowser.js

@@ -18,6 +18,10 @@ var css = csjs`
   }
   .txinput {
     width: inherit;
+    font-size: small;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
   .txbuttons {
     width: 100%;
@@ -80,7 +84,14 @@ TxBrowser.prototype.render = function () {
   var view = yo`<div class="${css.container}">
         <div class="${css.txContainer}">
           <div class="${css.txinputs} p-1 input-group">
-            <input value="${this.state.txNumber || ''}" class="form-control ${css.txinput}" id='txinput' onkeyup=${function () { self.updateTxN(arguments[0]) }} type='text' placeholder=${'Transaction hash'} />
+            <input
+              value="${this.state.txNumber || ''}"
+              class="form-control m-0 ${css.txinput}"
+              id='txinput'
+              onkeyup=${function () { self.updateTxN(arguments[0]) }}
+              type='text'
+              placeholder=${'Transaction hash'}
+            />
           </div>
           <div class="${css.txbuttons} btn-group p-1">
             <button class='btn btn-primary btn-sm ${css.txbutton}' id='load' title='${this.state.debugging ? 'Stop' : 'Start'} debugging' onclick=${function () { self.submit() }}>${this.state.debugging ? 'Stop' : 'Start'} debugging</button>

src/app/tabs/compile-tab.js

@@ -182,14 +182,20 @@ class CompileTab extends CompilerApi {
    * @param {string[]} contractList Names of the compiled contracts
    */
   contractSelection (contractList = [], sourceFile) {
-    return contractList.length !== 0
+    let selectEl = yo`
+      <select
+        onchange="${e => this.selectContract(e.target.value)}"
+        id="compiledContracts" class="custom-select"
+      >
+        ${contractList.map((name) => yo`<option value="${name}">${name}</option>`)}
+      </select>
+    `
+    let result = contractList.length
     ? yo`<section class="${css.container} clearfix">
       <!-- Select Compiler Version -->
       <div class="navbar navbar-light bg-light input-group mb-3">
-          <label class="border-0 input-group-text" for="compiledContracts">Contract</label>
-          <select onchange="${e => this.selectContract(e.target.value)}" onload="${e => { this.selectedContract = e.value }}" id="compiledContracts" class="custom-select">
-          ${contractList.map((name) => yo`<option value="${name}">${name}</option>`)}
-        </select>  
+        <label class="border-0 input-group-text" for="compiledContracts">Contract</label>
+        ${selectEl}
       </div>
         
       <article class="${css.compilerArticle}">
@@ -220,6 +226,13 @@ class CompileTab extends CompilerApi {
     : yo`<section class="${css.container} clearfix"><article class="${css.compilerArticle}">
       <span class="alert alert-warning" role="alert">No Contract Compiled Yet</span>
     </article></section>`
+
+    if (contractList.length) {
+      this.selectedContract = selectEl.value
+    } else {
+      delete this.selectedContract
+    }
+    return result
   }
 
   // TODO : Add success alert when compilation succeed

src/app/ui/tooltip.js

@@ -8,6 +8,7 @@ var modal = require('./modal-dialog-custom')
  * @param {function} [action] Returns An HTMLElement to display for action
  */
 module.exports = function addTooltip (tooltipText, action, opts) {
+  action = action || function () { return yo`<div></div>` }
   let t = new Toaster()
   return t.render(tooltipText, action(t), opts)
 }
@@ -27,9 +28,16 @@ class Toaster {
     return new Promise((resolve, reject) => {
       const shortTooltipText = tooltipText.length > 201 ? tooltipText.substring(0, 200) + '...' : tooltipText
 
+      let button = tooltipText.length > 201 ? yo`
+      <button class="btn btn-secondary btn-sm" onclick=${() => { modal.alert(tooltipText) }}>show full message</button>
+      ` : ``
+
       this.tooltip = yo`
     <div class="${css.tooltip} alert alert-info" onmouseenter=${() => { over() }} onmouseleave=${() => { out() }}>
-      <span>${shortTooltipText}<button class="btn btn-secondary btn-sm" onclick=${() => { modal.alert(tooltipText) }}>show full message</button></span>
+      <span>
+        ${shortTooltipText}
+        ${button}
+      </span>
       ${action}
     </div>`
       let timeOut = () => {