test: BDD / acceptance tests

Implement acceptance testing using codeceptjs and puppeteer.

codecept.conf.js

@@ -0,0 +1,22 @@
+
+exports.config = {
+  tests: './test/acceptance/*_test.js',
+  output: './test/acceptance/output',
+  helpers: {
+    Puppeteer: {
+      url: 'http://localhost:8080',
+      // "show": true,
+      chrome: {
+        // headless: false
+      }
+    }
+  },
+  include: {
+    I: './test/acceptance/steps_file.js'
+  },
+  smartWait: 30000,
+  bootstrap: null,
+  plugins: {},
+  mocha: {},
+  name: '@verdaccio/ui-theme'
+}

package.json

@@ -20,6 +20,7 @@
     "@verdaccio/types": "5.0.0-beta.4",
     "autosuggest-highlight": "3.1.1",
     "bundlesize": "0.17.1",
+    "codeceptjs": "2.1.0",
     "codecov": "3.2.0",
     "concurrently": "4.1.0",
     "cross-env": "5.2.0",
@@ -66,7 +67,7 @@
     "ora": "1.4.0",
     "prettier": "1.14.3",
     "prop-types": "15.7.2",
-    "puppeteer": "1.8.0",
+    "puppeteer": "1.15.0",
     "react": "16.8.3",
     "react-autosuggest": "9.4.2",
     "react-dom": "16.8.3",
@@ -110,6 +111,8 @@
     "flow": "flow check",
     "release": "standard-version -a -s",
     "test:clean": "npx jest --clearCache",
+    "test:acceptance": "codeceptjs run --steps",
+    "test:acceptance:server": "concurrently --kill-others \"npm run verdaccio:server\" \"npm run test:acceptance\"",
     "test": "cross-env NODE_ENV=test BABEL_ENV=test TZ=UTC jest --config ./jest.config.js --maxWorkers 2 --passWithNoTests",
     "test:size": "bundlesize",
     "lint": "npm run flow && npm run lint:js && npm run lint:css",

test/acceptance/.gitignore

@@ -0,0 +1 @@
+output

test/acceptance/Menu_test.js

@@ -0,0 +1,9 @@
+Feature('Menu');
+
+Scenario('check if we find the npm commands to set the registry', (I) => {
+  I.amOnPage('http://localhost:8080');
+  I.waitForElement('#header--button-registryInfo', 5);
+  I.click('#header--button-registryInfo');
+  I.waitForElement('#registryInfo--dialog-container');
+  I.see('npm set registry http://localhost:8080');
+});

test/acceptance/SearchResult_test.js

@@ -0,0 +1,10 @@
+Feature('SearchResult');
+
+Scenario('check if we get the "no results found" text', (I) => {
+  I.amOnPage('http://localhost:8080');
+  I.seeElement('header .react-autosuggest__input input');
+  I.fillField('header .react-autosuggest__input input', 'test');
+  I.waitForElement('header .react-autosuggest__suggestions-container');
+  I.wait(1);
+  I.see('No results found.', 'header .react-autosuggest__suggestions-container');
+});

test/acceptance/steps_file.js

@@ -0,0 +1,11 @@
+
+// in this file you can append custom step methods to 'I' object
+
+module.exports = function() {
+  return actor({
+
+    // Define custom steps here, use 'this' to access default methods of I.
+    // It is recommended to place a general 'login' function here.
+
+  });
+}