add E2E terminal search

apps/remix-ide-e2e/src/commands/checkTerminalFilter.ts

@@ -2,9 +2,9 @@ import EventEmitter from 'events'
 import { NightwatchBrowser } from 'nightwatch'
 
 class CheckTerminalFilter extends EventEmitter {
-  command (this: NightwatchBrowser, filter: string, test: string): NightwatchBrowser {
+  command (this: NightwatchBrowser, filter: string, test: string, notContain: boolean): NightwatchBrowser {
     this.api.perform((done) => {
-      checkFilter(this.api, filter, test, () => {
+      checkFilter(this.api, filter, test, notContain, () => {
         done()
         this.emit('complete')
       })
@@ -13,20 +13,30 @@ class CheckTerminalFilter extends EventEmitter {
   }
 }
 
-function checkFilter (browser: NightwatchBrowser, filter: string, test: string, done: VoidFunction) {
+function checkFilter (browser: NightwatchBrowser, filter: string, inputTest: string, notContain: boolean, done: VoidFunction) {
-  if (browser.options.desiredCapabilities.browserName === 'chrome') { // nightwatch deos not handle well that part.... works locally
+  /*if (browser.options.desiredCapabilities.browserName === 'chrome') { // nightwatch deos not handle well that part.... works locally
     done()
     return
-  }
+  }*/
-  const filterClass = '[data-id="terminalInputSearch"]'
+  const filterClass = '[data-id="terminalInputSearchTerminal"]'
-  browser.setValue(filterClass, filter, function () {
+  browser.clearValue(filterClass).setValue(filterClass, filter, function () {
     browser.execute(function () {
-      return document.querySelector('[data-id="terminalJournal"]').innerHTML === test || ''
+      return document.querySelector('[data-id="terminalJournal"]').innerHTML   
     }, [], function (result) {
-      browser.clearValue(filterClass).setValue(filterClass, '', function () {
+      console.log(notContain, result.value, filter)
-        if (!result.value) {
+      if (!notContain) {
-          browser.assert.fail('useFilter on ' + filter + ' ' + test, 'info about error', '')
+        // the input text should be contained in the result
+        if ((result.value as string).indexOf(filter) === -1) {
+          browser.assert.fail('useFilter on ' + filter + ' ' + test, 'the input text should be contained in the result', '')
+        }
+      }
+      if (notContain) {
+        // the input text should not be contained in the result
+        if ((result.value as string).indexOf(filter) !== -1) {
+          browser.assert.fail('useFilter on ' + filter + ' ' + test, 'the input text should not be contained in the result', '')
         }
+      }     
+      browser.clearValue(filterClass).perform(() => {
         done()
       })
     })

apps/remix-ide-e2e/src/commands/getLastTransactionHash.ts

@@ -15,7 +15,7 @@ class GetLastTransactionHash extends EventEmitter {
 }
 
 function getLastTransactionHash (browser: NightwatchBrowser, callback: (hash: string) => void) {
-  browser.waitForElementPresent('*[data-shared="universalDappUiInstance"]')
+  browser.waitForElementPresent('*[data-id="terminalJournal"]')
     .execute(function () {
       const deployedContracts = document.querySelectorAll('*[data-id="terminalJournal"] > div')
       for (let i = deployedContracts.length - 1; i >= 0; i--) {

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

@@ -150,6 +150,14 @@ module.exports = {
       .click('*[data-id="deployAndRunClearInstances"]')
   },
 
+  'Should filter displayed transactions #group2': function (browser: NightwatchBrowser) {
+    browser
+      // it should contain: 0xd9145CCE52D386f254917e481eB44e9943F39138
+      .checkTerminalFilter('0xd9145CCE52D386f254917e481eB44e9943F39138', '0xd9145CCE52D386f254917e481eB44e9943F39138', false)
+      // it should not contain: 0xd9145CCE52D386f254917e481eB44e9943F39140 (it ends with 40)
+      .checkTerminalFilter('0xd9145CCE52D386f254917e481eB44e9943F39140', '0xd9145CCE52D386f254917e481eB44e9943F39138', true)
+  },
+
   'Should Compile and Deploy a contract which define a custom error, the error should be logged in the terminal #group3': function (browser: NightwatchBrowser) {
     browser.testContracts('customError.sol', sources[4]['customError.sol'], ['C'])
       .clickLaunchIcon('udapp')

apps/remix-ide-e2e/src/types/index.d.ts

@@ -54,7 +54,7 @@ declare module 'nightwatch' {
     notContainsText(cssSelector: string, text: string): NightwatchBrowser
     sendLowLevelTx(address: string, value: string, callData: string): NightwatchBrowser
     journalLastChild(val: string): NightwatchBrowser
-    checkTerminalFilter(filter: string, test: string): NightwatchBrowser
+    checkTerminalFilter(filter: string, test: string, notContain: boolean): NightwatchBrowser
     noWorkerErrorFor(version: string): NightwatchBrowser
     validateValueInput(selector: string, valueTosSet: string[], expectedValue: string): NightwatchBrowser
     checkAnnotations(type: string): NightwatchBrowser

libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx

@@ -181,7 +181,7 @@ function HomeTabTitle() {
           className="border form-control border-right-0"
           id="homeTabSearchInput"
           placeholder={intl.formatMessage({id: 'home.searchDocumentation'})}
-          data-id="terminalInputSearch"
+          data-id="terminalInputSearchHome"
         />
         <button
           className="form-control border d-flex align-items-center p-2 justify-content-center fas fa-search bg-light"

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

@@ -10,6 +10,7 @@ import {
   listenOnNetworkAction,
   initListeningOnNetwork,
 } from './actions/terminalAction'
+import { isBigInt } from 'web3-validator'
 import { initialState, registerCommandReducer, addCommandHistoryReducer, registerScriptRunnerReducer } from './reducers/terminalReducer'
 import { getKeyOf, getValueOf, Objectfilter, matched } from './utils/utils'
 import { allCommands, allPrograms } from './commands' // eslint-disable-line
@@ -583,6 +584,22 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
 
   const classNameBlock = 'remix_ui_terminal_block px-4 py-1 text-break'
 
+  const replacer = (key, value) => {
+    if (isBigInt(value)) value = value.toString()
+    if (typeof value === 'function') value = value.toString()
+    return value
+  }
+
+  const includeSearch = (x, searchInput) => {
+    try {
+      const value = JSON.stringify(x, replacer)
+      return value.indexOf(searchInput) !== -1 || value.indexOf(searchInput.toLowerCase()) !== -1
+    } catch (e) {
+      console.error(e)
+      return true
+    }    
+  }
+
   return (
     ( !props.visible? <></>: 
       <div style={{ flexGrow: 1 }} className="remix_ui_terminal_panel" ref={panelRef}>
@@ -642,7 +659,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
                 className="remix_ui_terminal_filter border form-control"
                 id="searchInput"
                 placeholder={intl.formatMessage({ id: 'terminal.search' })}
-                data-id="terminalInputSearch"
+                data-id="terminalInputSearchTerminal"
               />
             </div>
           </div>
@@ -666,7 +683,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
                   )
                 } else if (x.name === UNKNOWN_TRANSACTION) {
                   return x.message
-                    .filter((x) => x.tx.hash.includes(searchInput) || x.tx.from.includes(searchInput) || (x.tx.to && x.tx.to.includes(searchInput)))
+                    .filter((x) => includeSearch(x, searchInput))
                     .map((trans) => {
                       return (
                         <div className={classNameBlock} data-id={`block_tx${trans.tx.hash}`} key={index}>
@@ -688,38 +705,38 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
                     })
                 } else if (x.name === KNOWN_TRANSACTION) {
                   return x.message
-                    .filter((x) => x.tx.hash.includes(searchInput) || x.tx.from.includes(searchInput) || (x.tx.to && x.tx.to.includes(searchInput)))
+                    .filter((x) => includeSearch(x, searchInput))
                     .map((trans) => {
-                    return (
+                      return (
-                      <div className={classNameBlock} data-id={`block_tx${trans.tx.hash}`} key={index}>
+                        <div className={classNameBlock} data-id={`block_tx${trans.tx.hash}`} key={index}>
-                        {trans.tx.isCall ? (
+                          {trans.tx.isCall ? (
-                          <RenderCall
+                            <RenderCall
-                            tx={trans.tx}
+                              tx={trans.tx}
-                            resolvedData={trans.resolvedData}
+                              resolvedData={trans.resolvedData}
-                            logs={trans.logs}
+                              logs={trans.logs}
-                            index={index}
+                              index={index}
-                            plugin={props.plugin}
+                              plugin={props.plugin}
-                            showTableHash={showTableHash}
+                              showTableHash={showTableHash}
-                            txDetails={txDetails}
+                              txDetails={txDetails}
-                            modal={modal}
+                              modal={modal}
-                          />
+                            />
-                        ) : (
+                          ) : (
-                          <RenderKnownTransactions
+                            <RenderKnownTransactions
-                            tx={trans.tx}
+                              tx={trans.tx}
-                            receipt={trans.receipt}
+                              receipt={trans.receipt}
-                            resolvedData={trans.resolvedData}
+                              resolvedData={trans.resolvedData}
-                            logs={trans.logs}
+                              logs={trans.logs}
-                            index={index}
+                              index={index}
-                            plugin={props.plugin}
+                              plugin={props.plugin}
-                            showTableHash={showTableHash}
+                              showTableHash={showTableHash}
-                            txDetails={txDetails}
+                              txDetails={txDetails}
-                            modal={modal}
+                              modal={modal}
-                            provider={x.provider}
+                              provider={x.provider}
-                          />
+                            />
-                        )}
+                          )}
-                      </div>
+                        </div>
-                    )
+                      )
-                  })
+                    })
                 } else if (Array.isArray(x.message)) {
                   if (searchInput !== '') return []
                   return x.message.map((msg, i) => {