fixing review comment by David Disu

apps/remix-ide-e2e/src/tests/defaultLayout.test.ts

@@ -53,8 +53,6 @@ module.exports = {
       .assert.elementPresent('div[data-id="terminalContainerDisplay"]')
       .click('i[data-id="terminalToggleIcon"]')
       .checkElementStyle('div[data-id="terminalContainer-view"]', 'height', '36px')
-      // .click('i[data-id="terminalToggleIcon"]')
-      // .assert.visible('div[data-id="terminalContainerDisplay"]')
   },
 
   'Switch Tabs using tabs icon': function (browser: NightwatchBrowser) {

apps/remix-ide-e2e/src/tests/libraryDeployment.test.ts

@@ -77,7 +77,7 @@ function checkDeployShouldFail (browser: NightwatchBrowser, callback: VoidFuncti
     .clickLaunchIcon('udapp')
     .selectContract('test') // deploy lib
     .createContract('')
-    .pause(60000)
+    .pause(2000)
     .getText('div[class^="terminal"]', (value) => {
       console.log('value: ', value)
     })

apps/remix-ide-e2e/src/tests/solidityUnittests.spec.ts

@@ -150,7 +150,7 @@ module.exports = {
       .clickLaunchIcon('solidityUnitTesting')
       .waitForElementPresent('*[data-id="uiPathInput"]', 3000)
       .clearValue('*[data-id="uiPathInput"]')
-      .setValue('*[data-id="uiPathInput"]', 'tests')
+      .setValue('*[data-id="uiPathInput"]', 'tests1')
       .click('*[data-id="testTabGenerateTestFolder"]')
       .clickLaunchIcon('filePanel')
       // creating a new workspace
@@ -198,13 +198,13 @@ module.exports = {
       .waitForElementVisible('*[data-id="testTabSolidityUnitTestsOutputheader"]', 120000)
       .waitForElementPresent('#solidityUnittestsOutput div[class^="testPass"]', 60000)
       .waitForElementContainsText('#solidityUnittestsOutput', 'tests/hhLogs_test.sol', 60000)
-      .assert.containsText('#journal > div:nth-child(2) > span ', 'Before all:')
-      .assert.containsText('#journal > div:nth-child(2) > span', 'Inside beforeAll')
-      .assert.containsText('#journal > div:nth-child(3) > span', 'Check sender:')
-      .assert.containsText('#journal > div:nth-child(3) > span', 'msg.sender is 0x5B38Da6a701c568545dCfcB03FcB875f56beddC4')
-      .assert.containsText('#journal > div:nth-child(4) > span', 'Check int logs:')
-      .assert.containsText('#journal > div:nth-child(4) > span', '10 20')
-      .assert.containsText('#journal > div:nth-child(4) > span', 'Number is 25')
+      .assert.containsText('#journal > div:nth-child(3) > span', 'Before all:')
+      .assert.containsText('#journal > div:nth-child(3) > span', 'Inside beforeAll')
+      .assert.containsText('#journal > div:nth-child(4) > span', 'Check sender:')
+      .assert.containsText('#journal > div:nth-child(4) > span', 'msg.sender is 0x5B38Da6a701c568545dCfcB03FcB875f56beddC4')
+      .assert.containsText('#journal > div:nth-child(5) > span', 'Check int logs:')
+      .assert.containsText('#journal > div:nth-child(5) > span', '10 20')
+      .assert.containsText('#journal > div:nth-child(5) > span', 'Number is 25')
       .openFile('tests/hhLogs_test.sol')
       .removeFile('tests/hhLogs_test.sol', 'workspace_new')
   },

apps/remix-ide-e2e/src/tests/workspace.test.ts

@@ -50,7 +50,7 @@ module.exports = {
       .execute(function () { document.querySelector('*[data-id="modalDialogCustomPromptTextCreate"]')['value'] = 'workspace_name_1' })
       .waitForElementVisible('span[data-id="workspacesModalDialog-modal-footer-ok-react"]')
     // eslint-disable-next-line dot-notation
-      // .execute(function () { document.querySelector('span[data-id="workspacesModalDialog-modal-footer-ok-react"]') })
+      .execute(function () { document.querySelector('span[data-id="workspacesModalDialog-modal-footer-ok-react"]') })
       .pause(2000)
       .click('span[data-id="workspacesModalDialog-modal-footer-ok-react"]')
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtests"]')

apps/remix-ide/src/app/panels/terminal.js

@@ -108,12 +108,20 @@ class Terminal extends Plugin {
     // console.log({ html: html.innerText })
     this.logHtmlResponse.push(html.innerText)
     this.renderComponent()
+    this.resetLogHtml()
+  }
+
+  resetLogHtml () {
     this.logHtmlResponse = []
   }
 
   log (message) {
     this.logResponse.push(message)
     this.renderComponent()
+    this.resetLog()
+  }
+
+  resetLog () {
     this.logResponse = []
   }
 
@@ -124,25 +132,7 @@ class Terminal extends Plugin {
   renderComponent () {
     ReactDOM.render(
       <RemixUiTerminal
-        event = {this.event}
-        blockchain = {this.blockchain}
-        api = {this._api}
-        options = {this._opts}
-        registerCommand = {this.registerCommand}
-        version = {this.version}
-        config = {this.config}
-        thisState = {this}
-        blockchain = {this.blockchain}
-        event = {this.event}
-        _deps = {this._deps}
-        fileImport = {this.fileImport}
-        sourceHighlighter = {this.sourceHighlighter}
-        gistHandler ={this.gistHandler}
-        registry = {this.registry}
-        txListener = {this.txListener}
-        eventsDecoder = {this.eventsDecoder}
-        logHtml = {this.logHtmlResponse}
-        logResponse = {this.logResponse}
+        plugin = {this}
       />,
       this.element
     )

apps/remix-ide/src/lib/cmdInterpreterAPI.js

@@ -93,7 +93,6 @@ class CmdInterpreterAPI {
         if (cb) cb()
         return
       }
-      console.log({ content }, ' contents')
       self._components.terminal.commands.script(content)
     }
 

libs/remix-lib/src/types/ICompilerApi.ts

@@ -50,8 +50,4 @@ export interface ConfigurationSettings {
     language: string,
     optimize: boolean,
     runs: string
-<<<<<<< HEAD
-
-=======
->>>>>>> 0e36c001f098047cf4fec47ae9611d1e4e4a8355
 }

libs/remix-ui/terminal/src/lib/actions/terminalAction.ts

+import { EmptyBlock, KnownTransaction, NewBlock, NewCall, NewTransaction, UnknownTransaction } from '../types/terminalTypes'
+
 export const registerCommandAction = (name, command, activate, dispatch) => {
   const commands: any = {}
   const _commands: any = {}
   _commands[name] = command
   const data: any = {
-    // lineLength: props.options.lineLength || 80,
     session: [],
     activeFilters: { commands: {}, input: '' },
     filterFns: {}
@@ -25,7 +26,6 @@ export const registerCommandAction = (name, command, activate, dispatch) => {
     const root = { steps, cmd: name, gidx: 0, idx: 0 }
     const ITEM = { root, cmd: name }
     root.gidx = _INDEX.allMain.push(ITEM) - 1
-    // root.idx = _INDEX.commandsMain[name].push(ITEM) - 1
     let item
     function append (cmd, params, el) {
       if (cmd) { // subcommand
@@ -39,11 +39,9 @@ export const registerCommandAction = (name, command, activate, dispatch) => {
       item.idx = _INDEX.commands[cmd].push(item) - 1
       item.step = steps.push(item) - 1
       item.args = params
-      // _appendItem(item)
-      // self._appendItem(item)
     }
-    var scopedCommands = _scopeCommands(append)
-    command(args, scopedCommands, el => append(null, args, blockify(el)))
+    const scopedCommands = _scopeCommands(append)
+    command(args, scopedCommands, el => append(null, args, el))
   }
   const help = typeof command.help === 'string' ? command.help : [
     '// no help available for:', `terminal.command.${name}`
@@ -54,20 +52,17 @@ export const registerCommandAction = (name, command, activate, dispatch) => {
   if (activate.filterFn) {
     registerFilter(name, activate.filterFn)
   }
-  if (name !== ('knownTransaction' || 'unkownTransaction' || 'emptyBlock')) {
+  if (name !== (KnownTransaction || UnknownTransaction || EmptyBlock)) {
     dispatch({ type: name, payload: { commands: commands, _commands: _commands, data: data } })
   }
-  const blockify = (el) => {
-    return `<div class="px-4 block_2A0YE0" data-id="block_null">${el}</div>`
-  }
 
   const _scopeCommands = (append) => {
     const scopedCommands = {}
     Object.keys(commands).forEach(function makeScopedCommand (cmd) {
-      var command = _commands[cmd]
+      const command = _commands[cmd]
       scopedCommands[cmd] = function _command () {
-        var args = [...arguments]
-        command(args, scopedCommands, el => append(cmd, args, blockify(el)))
+        const args = [...arguments]
+        command(args, scopedCommands, el => append(cmd, args, el))
       }
     })
     return scopedCommands
@@ -76,89 +71,85 @@ export const registerCommandAction = (name, command, activate, dispatch) => {
 
 export const filterFnAction = (name, filterFn, dispatch) => {
   const data: any = {
-    // session: [],
-    // activeFilters: { commands: {}, input: '' },
     filterFns: {}
   }
   data.filterFns[name] = filterFn
   dispatch({ type: name, payload: { data: data } })
 }
 
-export const registerLogScriptRunnerAction = (event, commandName, commandFn, dispatch) => {
-  event.on('scriptRunner', commandName, (msg) => {
+export const registerLogScriptRunnerAction = (on, commandName, commandFn, dispatch) => {
+  on('scriptRunner', commandName, (msg) => {
     commandFn.log.apply(commandFn, msg.data)
     dispatch({ type: commandName, payload: { commandFn, message: msg.data } })
   })
 }
 
-export const registerInfoScriptRunnerAction = (event, commandName, commandFn, dispatch) => {
-  event.on('scriptRunner', commandName, (msg) => {
+export const registerInfoScriptRunnerAction = (on, commandName, commandFn, dispatch) => {
+  on('scriptRunner', commandName, (msg) => {
     commandFn.info.apply(commandFn, msg.data)
     dispatch({ type: commandName, payload: { commandFn, message: msg.data } })
   })
 }
 
-export const registerWarnScriptRunnerAction = (event, commandName, commandFn, dispatch) => {
-  event.on('scriptRunner', commandName, (msg) => {
+export const registerWarnScriptRunnerAction = (on, commandName, commandFn, dispatch) => {
+  on('scriptRunner', commandName, (msg) => {
     commandFn.warn.apply(commandFn, msg.data)
     dispatch({ type: commandName, payload: { commandFn, message: msg.data } })
   })
 }
 
-export const registerErrorScriptRunnerAction = (event, commandName, commandFn, dispatch) => {
-  event.on('scriptRunner', commandName, (msg) => {
+export const registerErrorScriptRunnerAction = (on, commandName, commandFn, dispatch) => {
+  on('scriptRunner', commandName, (msg) => {
     commandFn.error.apply(commandFn, msg.data)
     dispatch({ type: commandName, payload: { commandFn, message: msg.data } })
   })
 }
 
-export const registerRemixWelcomeTextAction = (welcomeText, dispatch) => {
-  dispatch({ type: 'welcomeText', payload: { welcomeText } })
-}
+// export const registerRemixWelcomeTextAction = (welcomeText, dispatch) => {
+//   dispatch({ type: 'welcomeText', payload: { welcomeText } })
+// }
 
-export const listenOnNetworkAction = async (props, isListening) => {
-  props.event.trigger('listenOnNetWork', [isListening])
+export const listenOnNetworkAction = async (event, isListening) => {
+  event.trigger('listenOnNetWork', [isListening])
 }
 
 export const initListeningOnNetwork = (props, dispatch) => {
-  props.txListener.event.register('newBlock', (block) => {
+  props.txListener.event.register(NewBlock, (block) => {
     if (!block.transactions || (block.transactions && !block.transactions.length)) {
-      dispatch({ type: 'emptyBlock', payload: { message: 0 } })
+      dispatch({ type: EmptyBlock, payload: { message: 0 } })
     }
   })
-  props.txListener.event.register('knownTransaction', () => {
+  props.txListener.event.register(KnownTransaction, () => {
   })
-  props.txListener.event.register('newCall', (tx, receipt) => {
+  props.txListener.event.register(NewCall, (tx, receipt) => {
     log(props, tx, receipt, dispatch)
     // log(this, tx, null)
   })
-  props.txListener.event.register('newTransaction', (tx, receipt) => {
+  props.txListener.event.register(NewTransaction, (tx, receipt) => {
     log(props, tx, receipt, dispatch)
   })
 
   const log = async (props, tx, receipt, dispatch) => {
     const resolvedTransaction = await props.txListener.resolvedTransaction(tx.hash)
     if (resolvedTransaction) {
-      var compiledContracts = null
+      let compiledContracts = null
       if (props._deps.compilersArtefacts.__last) {
         compiledContracts = await props._deps.compilersArtefacts.__last.getContracts()
       }
       await props.eventsDecoder.parseLogs(tx, resolvedTransaction.contractName, compiledContracts, async (error, logs) => {
         if (!error) {
-          await dispatch({ type: 'knownTransaction', payload: { message: [{ tx: tx, receipt: receipt, resolvedData: resolvedTransaction, logs: logs }] } })
+          await dispatch({ type: KnownTransaction, payload: { message: [{ tx: tx, receipt: receipt, resolvedData: resolvedTransaction, logs: logs }] } })
         }
       })
     } else {
-      // contract unknown - just displaying raw tx.
-      // logUnknownTX({ tx: tx, receipt: receipt })
-      await dispatch({ type: 'unknownTransaction', payload: { message: [{ tx: tx, receipt: receipt }] } })
+      await dispatch({ type: UnknownTransaction, payload: { message: [{ tx: tx, receipt: receipt }] } })
     }
   }
 
   props.txListener.event.register('debuggingRequested', async (hash) => {
     // TODO should probably be in the run module
     if (!await props.options.appManager.isActive('debugger')) await props.options.appManager.activatePlugin('debugger')
-    props.thisState.call('menuicons', 'select', 'debugger')
-    props.thisState.call('debugger', 'debug', hash)
+    props.call('menuicons', 'select', 'debugger')
+    props.call('debugger', 'debug', hash)
   })
 }

libs/remix-ui/terminal/src/lib/components/ChechTxStatus.tsx

 import React from 'react' // eslint-disable-line
 
-const checkTxStatus = (tx, type) => {
+const CheckTxStatus = ({ tx, type }) => {
   if (tx.status === '0x1' || tx.status === true) {
     return (<i className='txStatus succeeded fas fa-check-circle'></i>)
   }
@@ -13,4 +13,4 @@ const checkTxStatus = (tx, type) => {
   }
 }
 
-export default checkTxStatus
+export default CheckTxStatus

libs/remix-ui/terminal/src/lib/components/Context.tsx

@@ -4,7 +4,7 @@ import helper from 'apps/remix-ide/src/lib/helper'
 const remixLib = require('@remix-project/remix-lib')
 var typeConversion = remixLib.execution.typeConversion
 
-const context = (opts, blockchain) => {
+const Context = ({ opts, blockchain }) => {
   const data = opts.tx || ''
   const from = opts.from ? helper.shortenHexData(opts.from) : ''
   let to = opts.to
@@ -59,4 +59,4 @@ const context = (opts, blockchain) => {
   }
 }
 
-export default context
+export default Context

libs/remix-ui/terminal/src/lib/components/RenderCall.tsx

 import React, { useState } from 'react'  // eslint-disable-line
 
 import helper from 'apps/remix-ide/src/lib/helper'
-import checkTxStatus from './ChechTxStatus'
+import CheckTxStatus from './ChechTxStatus' // eslint-disable-line
 import showTable from './Table'
 import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line
 
 const remixLib = require('@remix-project/remix-lib')
 var typeConversion = remixLib.execution.typeConversion
 
-const renderCall = (tx, resolvedData, logs, index, props, showTableHash, txDetails) => {
+const RenderCall = ({ tx, resolvedData, logs, index, plugin, showTableHash, txDetails }) => {
   const to = resolvedData.contractName + '.' + resolvedData.fn
   const from = tx.from ? tx.from : ' - '
   const input = tx.input ? helper.shortenHexData(tx.input) : ''
@@ -23,14 +23,14 @@ const renderCall = (tx, resolvedData, logs, index, props, showTableHash, txDetai
         message="Cannot debug this call. Debugging calls is only possible in JavaScript VM mode."
       />)
     } else {
-      props.event.trigger('debuggingRequested', [tx.hash])
+      plugin.event.trigger('debuggingRequested', [tx.hash])
     }
   }
 
   return (
     <span id={`tx${tx.hash}`} key={index}>
       <div className="log" onClick={(event) => txDetails(event, tx)}>
-        {checkTxStatus(tx, txType)}
+        <CheckTxStatus tx={tx} type={txType} />
         <span className="txLog">
           <span className="tx">[call]</span>
           <div className='txItem'><span className='txItemTitle'>from:</span> {from}</div>
@@ -62,4 +62,4 @@ const renderCall = (tx, resolvedData, logs, index, props, showTableHash, txDetai
   )
 }
 
-export default renderCall
+export default RenderCall

libs/remix-ui/terminal/src/lib/components/RenderKnownTransactions.tsx

 
 import React, { useState } from 'react' // eslint-disable-line
 import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line
-import checkTxStatus from './ChechTxStatus'
-import context from './Context'
+import CheckTxStatus from './ChechTxStatus' // eslint-disable-line
+import Context from './Context' // eslint-disable-line
 import showTable from './Table'
 
 const remixLib = require('@remix-project/remix-lib')
 const typeConversion = remixLib.execution.typeConversion
 
-const renderKnownTransactions = (tx, receipt, resolvedData, logs, index, props, showTableHash, txDetails) => {
+const RenderKnownTransactions = ({ tx, receipt, resolvedData, logs, index, plugin, showTableHash, txDetails }) => {
   const debug = (event, tx) => {
     event.stopPropagation()
     if (tx.isCall && tx.envMode !== 'vm') {
@@ -18,7 +18,7 @@ const renderKnownTransactions = (tx, receipt, resolvedData, logs, index, props,
         message="Cannot debug this call. Debugging calls is only possible in JavaScript VM mode."
       />)
     } else {
-      props.event.trigger('debuggingRequested', [tx.hash])
+      plugin.event.trigger('debuggingRequested', [tx.hash])
     }
   }
 
@@ -26,11 +26,12 @@ const renderKnownTransactions = (tx, receipt, resolvedData, logs, index, props,
   const to = resolvedData.contractName + '.' + resolvedData.fn
   // const obj = { from, to }
   const txType = 'knownTx'
+  const options = { from, to, tx }
   return (
     <span id={`tx${tx.hash}`} key={index}>
       <div className="log" onClick={(event) => txDetails(event, tx)}>
-        {checkTxStatus(receipt, txType)}
-        {context({ from, to, tx }, props.blockchain)}
+        <CheckTxStatus tx={tx} type={txType} />
+        <Context opts = { options } blockchain={plugin.blockchain} />
         <div className='buttons'>
           <div className='debug btn btn-primary btn-sm' data-shared='txLoggerDebugButton' data-id={`txLoggerDebugButton${tx.hash}`} onClick={(event) => debug(event, tx)}>Debug</div>
         </div>
@@ -58,4 +59,4 @@ const renderKnownTransactions = (tx, receipt, resolvedData, logs, index, props,
   )
 }
 
-export default renderKnownTransactions
+export default RenderKnownTransactions

libs/remix-ui/terminal/src/lib/components/RenderUnknownTransactions.tsx

 import React, { useState } from 'react' // eslint-disable-line
 import { ModalDialog } from '@remix-ui/modal-dialog'// eslint-disable-line
-import checkTxStatus from './ChechTxStatus'
-import context from './Context'
+import CheckTxStatus from './ChechTxStatus' // eslint-disable-line
+import Context from './Context' // eslint-disable-line
 import showTable from './Table'
 
-const renderUnKnownTransactions = (tx, receipt, index, props, showTableHash, txDetails) => {
+const RenderUnKnownTransactions = ({ tx, receipt, index, plugin, showTableHash, txDetails }) => {
   const debug = (event, tx) => {
     event.stopPropagation()
     if (tx.isCall && tx.envMode !== 'vm') {
@@ -14,7 +14,7 @@ const renderUnKnownTransactions = (tx, receipt, index, props, showTableHash, txD
         message="Cannot debug this call. Debugging calls is only possible in JavaScript VM mode."
       />)
     } else {
-      props.event.trigger('debuggingRequested', [tx.hash])
+      plugin.event.trigger('debuggingRequested', [tx.hash])
     }
   }
 
@@ -22,11 +22,12 @@ const renderUnKnownTransactions = (tx, receipt, index, props, showTableHash, txD
   const to = tx.to
   // const obj = { from, to }
   const txType = 'unknown' + (tx.isCall ? 'Call' : 'Tx')
+  const options = { from, to, tx }
   return (
     <span id={`tx${tx.hash}`} key={index}>
       <div className="log" onClick={(event) => txDetails(event, tx)}>
-        {checkTxStatus(receipt || tx, txType)}
-        {context({ from, to, tx }, props.blockchain)}
+        <CheckTxStatus tx={tx} type={txType} />
+        <Context opts = { options } blockchain={plugin.blockchain} />
         <div className='buttons'>
           <div className='debug btn btn-primary btn-sm' data-shared='txLoggerDebugButton' data-id={`txLoggerDebugButton${tx.hash}`} onClick={(event) => debug(event, tx)}>Debug</div>
         </div>
@@ -51,4 +52,4 @@ const renderUnKnownTransactions = (tx, receipt, index, props, showTableHash, txD
   )
 }
 
-export default renderUnKnownTransactions
+export default RenderUnKnownTransactions

libs/remix-ui/terminal/src/lib/reducers/remixWelcome.ts

-export const remixWelcome = () => {
-  return `<div>
-    <div> - Welcome to Remix {props.version} - </div>
-    <br/>
-    <div>You can use this terminal to: </div>
-    <ul className='ul'>
-      <li>Check transactions details and start debugging.</li>
-      <li>Execute JavaScript scripts:
-        <br />
-        <i> - Input a script directly in the command line interface </i>
-        <br />
-        <i> - Select a Javascript file in the file explorer and then run \`remix.execute()\` or \`remix.exeCurrent()\`  in the command line interface  </i>
-        <br />
-        <i> - Right click on a JavaScript file in the file explorer and then click \`Run\` </i>
-      </li>
-    </ul>
-    <div>The following libraries are accessible:</div>
-    <ul className='ul'>
-      <li><a target="_blank" href="https://web3js.readthedocs.io/en/1.0/">web3 version 1.0.0</a></li>
-      <li><a target="_blank" href="https://docs.ethers.io">ethers.js</a> </li>
-      <li><a target="_blank" href="https://www.npmjs.com/package/swarmgw">swarmgw</a> </li>
-      <li>remix (run remix.help() for more info)</li>
-    </ul>
-  </div>`
-}

libs/remix-ui/terminal/src/lib/types/terminalTypes.ts

@@ -6,24 +6,13 @@ export interface ROOTS {
     idx: number
 }
 
+export const KnownTransaction = 'knownTransaction'
+export const UnknownTransaction = 'unkownTransaction'
+export const EmptyBlock = 'emptyBlock'
+export const NewTransaction = 'newTransaction'
+export const NewBlock = 'newBlock'
+export const NewCall = 'newCall'
+
 export interface RemixUiTerminalProps {
-    propterties: any
-    event: any
-    blockchain: any
-    api: any
-    options: any
-    version: any
-    config: any
-    thisState: any
-    commandHelp: any,
-    _deps: any,
-    fileImport: any,
-    gistHandler: any,
-    sourceHighlighter: any,
-    registry: any,
-    commands: any,
-    txListener: any,
-    eventsDecoder: any,
-    logHtml: any,
-    logResponse: any
+    plugin: any
 }

nx.json

@@ -122,12 +122,6 @@
       "tags": []
     },
     "remix-ui-terminal": {
-<<<<<<< HEAD
-=======
-          "tags": []
-    },
-    "solidity-compiler": {
->>>>>>> 0e36c001f098047cf4fec47ae9611d1e4e4a8355
       "tags": []
     },
     "solidity-compiler": {