Added plugin manager tests

package.json

@@ -176,6 +176,7 @@
     "nightwatch_local_gist": "nightwatch ./test-browser/tests/gist.js --config nightwatch.js --env chrome ",
     "nightwatch_local_workspace": "nightwatch ./test-browser/tests/workspace.js --config nightwatch.js --env chrome ",
     "nightwatch_local_defaultLayout": "nightwatch ./test-browser/tests/defaultLayout.js --config nightwatch.js --env chrome ",
+    "nightwatch_local_plugin": "nightwatch ./test-browser/tests/plugin.js --config nightwatch.js --env chrome ",
     "onchange": "onchange build/app.js -- npm-run-all lint",
     "prepublish": "mkdirp build; npm-run-all -ls downloadsolc_root build",
     "remixd": "remixd -s ./contracts --remix-ide http://127.0.0.1:8080",

src/app/components/plugin-manager-component.js

@@ -106,11 +106,11 @@ class PluginManagerComponent extends ViewPlugin {
 
     const activationButton = isActive
       ? yo`
-      <button onclick="${_ => this.appManager.deactivateOne(name)}" class="btn btn-secondary btn-sm">
+      <button onclick="${_ => this.appManager.deactivateOne(name)}" class="btn btn-secondary btn-sm" data-id="pluginManagerComponentDeactivateButton${name}">
         Deactivate
       </button>`
       : yo`
-      <button onclick="${_ => this.appManager.activateOne(name)}" class="btn btn-success btn-sm">
+      <button onclick="${_ => this.appManager.activateOne(name)}" class="btn btn-success btn-sm" data-id="pluginManagerComponentActivateButton${name}">
         Activate
       </button>`
 
@@ -179,34 +179,34 @@ class PluginManagerComponent extends ViewPlugin {
       ? yo`
       <nav class="plugins-list-header justify-content-between navbar navbar-expand-lg bg-light navbar-light align-items-center">
         <span class="navbar-brand plugins-list-title">Active Modules</span>
-        <span class="badge badge-primary">${actives.length}</span>
+        <span class="badge badge-primary" data-id="pluginManagerComponentActiveTilesCount">${actives.length}</span>
       </nav>`
       : ''
     const inactiveTile = inactives.length !== 0
       ? yo`
       <nav class="plugins-list-header justify-content-between navbar navbar-expand-lg bg-light navbar-light align-items-center">
         <span class="navbar-brand plugins-list-title h6 mb-0 mr-2">Inactive Modules</span>
-        <span class="badge badge-primary" style = "cursor: default;">${inactives.length}</span>
+        <span class="badge badge-primary" style = "cursor: default;" data-id="pluginManagerComponentInactiveTilesCount">${inactives.length}</span>
       </nav>`
       : ''
 
     const settings = new PluginManagerSettings().render()
 
     const rootView = yo`
-      <div id='pluginManager'>
+      <div id='pluginManager' data-id="pluginManagerComponentPluginManager">
-        <header class="form-group ${css.pluginSearch} plugins-header py-3 px-4 border-bottom">
+        <header class="form-group ${css.pluginSearch} plugins-header py-3 px-4 border-bottom" data-id="pluginManagerComponentPluginManagerHeader">
-          <input onkeyup="${e => this.filterPlugins(e)}" class="${css.pluginSearchInput} form-control" placeholder="Search">
+          <input onkeyup="${e => this.filterPlugins(e)}" class="${css.pluginSearchInput} form-control" placeholder="Search" data-id="pluginManagerComponentSearchInput">
           <button onclick="${_ => this.openLocalPlugin()}" class="${css.pluginSearchButton} btn bg-transparent text-dark border-0 mt-2 text-underline">
             Connect to a Local Plugin
           </button>
         </header>
-        <section>
+        <section data-id="pluginManagerComponentPluginManagerSection">
           ${activeTile}
-          <div class="list-group list-group-flush plugins-list-group">
+          <div class="list-group list-group-flush plugins-list-group" data-id="pluginManagerComponentActiveTile">
             ${actives.map(name => this.renderItem(name))}
           </div>
           ${inactiveTile}
-          <div class="list-group list-group-flush plugins-list-group">
+          <div class="list-group list-group-flush plugins-list-group" data-id="pluginManagerComponentInactiveTile">
             ${inactives.map(name => this.renderItem(name))}
           </div>
         </section>

test-browser/tests/plugin.js

@@ -0,0 +1,50 @@
+'use strict'
+const init = require('../helpers/init')
+const sauce = require('./sauce')
+
+module.exports = {
+  before: function (browser, done) {
+    init(browser, done, 'http://127.0.0.1:8080', false)
+  },
+
+  'Should Load Plugin Manager': function (browser) {
+    browser.waitForElementVisible('div[data-id="remixIdeSidePanel"]')
+    .pause(3000)
+    .click('div[plugin="pluginManager"]')
+    .waitForElementVisible('div[data-id="pluginManagerComponentPluginManager"]')
+    .assert.containsText('h6[data-id="sidePanelSwapitTitle"]', 'PLUGIN MANAGER')
+  },
+
+  'Should Search for plugins': function (browser) {
+     browser.waitForElementVisible('div[data-id="pluginManagerComponentPluginManager"]')
+     .click('input[data-id="pluginManagerComponentSearchInput"]')
+     .keys('debugger')
+     .waitForElementVisible('button[data-id="pluginManagerComponentActivateButtondebugger"]')
+     .clearValue('input[data-id="pluginManagerComponentSearchInput"]')
+     .click('input[data-id="pluginManagerComponentSearchInput"]')
+     .keys('Deploy & run transactions')
+     .waitForElementVisible('button[data-id="pluginManagerComponentActivateButtonudapp"]')
+     .clearValue('input[data-id="pluginManagerComponentSearchInput"]')
+     .click('input[data-id="pluginManagerComponentSearchInput"]')
+     .keys('ZoKrates')
+     .waitForElementVisible('button[data-id="pluginManagerComponentActivateButtonZoKrates"]')
+     .clearValue('input[data-id="pluginManagerComponentSearchInput"]')
+     .click('input[data-id="pluginManagerComponentSearchInput"]')
+     .keys(browser.Keys.ENTER)
+   },
+
+
+   'Should activate plugins': function (browser) {
+    browser.waitForElementVisible('div[data-id="pluginManagerComponentPluginManager"]')
+    .click('div[data-id="pluginManagerComponentPluginManager"]')
+    .scrollAndClick('button[data-id="pluginManagerComponentActivateButtondebugger"]')
+    .waitForElementVisible('button[data-id="pluginManagerComponentDeactivateButtondebugger"]')
+    .scrollAndClick('button[data-id="pluginManagerComponentActivateButtonudapp"]')
+    .waitForElementVisible('button[data-id="pluginManagerComponentDeactivateButtonudapp"]')
+    .scrollAndClick('button[data-id="pluginManagerComponentActivateButtonZoKrates"]')
+    .waitForElementVisible('button[data-id="pluginManagerComponentDeactivateButtonZoKrates"]')
+    .end()
+  },
+
+  tearDown: sauce
+}