Add SHOW DATABASES integration test with Nightwatch.js.

.gitignore

@@ -17,3 +17,4 @@ npm-debug.log
 .jssrc
 .dev-jssrc
 .bindata
+ui/reports

ui/.eslintrc

@@ -102,7 +102,7 @@
     'no-iterator': 2,
     'no-lone-blocks': 2,
     'no-loop-func': 2,
-    'no-magic-numbers': [2, {ignore: [-1, 0, 1, 2]}],
+    'no-magic-numbers': [0, {ignore: [-1, 0, 1, 2]}],
     'no-multi-spaces': 2,
     'no-multi-str': 2,
     'no-native-reassign': 2,

ui/nightwatch.json

@@ -0,0 +1,37 @@
+{
+  "src_folders": ["tests"],
+  "output_folder": "reports",
+  "custom_commands_path": "",
+  "custom_assertions_path": "",
+  "page_objects_path": "",
+  "globals_path": "",
+
+  "use_xpath": true,
+
+  "selenium": {
+    "start_process": false,
+    "host": "hub-cloud.browserstack.com",
+    "port": 80
+  },
+
+  "test_settings": {
+    "default": {
+      "selenium_port": 80,
+      "selenium_host": "hub-cloud.browserstack.com",
+      "silent": false,
+      "screenshots": {
+        "enabled": true,
+        "path": "screenshots"
+      },
+      "desiredCapabilities": {
+        "browser": "chrome",
+        "build": "nightwatch-browserstack",
+        "browserstack.user": "${BROWSERSTACK_USER}",
+        "browserstack.key": "${BROWSERSTACK_KEY}",
+        "browserstack.debug": true,
+        "browserstack.local": true,
+        "resolution": "1920x1080"
+      }
+    }
+  }
+}

ui/package.json

@@ -16,6 +16,7 @@
     "test": "karma start",
     "test:lint": "npm run lint; npm run test",
     "test:dev": "nodemon --exec npm run test:lint",
+    "test:integration": "nightwatch tests --skip",
     "clean": "rm -rf build",
     "storybook": "node ./storybook",
     "prettier": "prettier --single-quote --trailing-comma es5 --bracket-spacing false --semi false --write \"{src,spec}/**/*.js\"; eslint src --fix"

ui/tests/DataExplorer.js

@@ -0,0 +1,34 @@
+const src = process.argv.find(s => s.includes('--src=')).replace('--src=', '')
+const url = `http://localhost:8888/sources/${src}/chronograf/data-explorer`
+
+module.exports = {
+  'Data Explorer (functional) - SHOW DATABASES'(browser) {
+    browser
+      .url(url)
+      .useXpath()
+      .waitForElementVisible(
+        '//div[@class="btn btn-primary"][contains(.,"Add a Query")]',
+        1000
+      )
+      .click('//div[@class="btn btn-primary"][contains(.,"Add a Query")]')
+      .pause(500)
+      .waitForElementVisible(
+        '//textarea[contains(@class,"query-editor--field")]',
+        1000
+      )
+      .setValue(
+        '//textarea[contains(@class,"query-editor--field")]',
+        'SHOW DATABASES\n'
+      )
+      .pause(1000)
+      .waitForElementVisible(
+        '*//div[@class="fixedDataTableCellLayout_main public_fixedDataTableCell_main"]/span[contains(.,"_internal")]',
+        5000
+      )
+      .assert.containsText(
+        '*//div[@class="fixedDataTableCellLayout_main public_fixedDataTableCell_main"]/span[contains(.,"_internal")]',
+        '_internal'
+      )
+      .end()
+  },
+}