Reconstruct from bigquery-datasets-selector

.gitignore

@@ -0,0 +1 @@
+test/credentials.json

.jshintrc

@@ -0,0 +1,36 @@
+{
+  "esversion": 6,
+  "undef": true,
+  "unused": true,
+  "white": true,
+  "globals": {
+    "google": false,
+    "gapi": false,
+    "HTMLElement": false,
+    "window": false,
+    "module": false,
+    "__dirname": false,
+    "log": false,
+    "global": false,
+    "messages": false,
+    "describe": false,
+    "document": false,
+    "chrome": false,
+    "setTimeout": false,
+    "setInterval": false,
+    "clearInterval": false,
+    "clearTimeout": false,
+    "require": false,
+    "console": false,
+    "process": false,
+    "driver": false,
+    "XMLHttpRequest": false,
+    "logger": false,
+    "it": false,
+    "afterEach": false,
+    "beforeEach": false,
+    "before": false,
+    "after": false,
+    "requireRoot": false
+  }
+}

README.md

@@ -0,0 +1,27 @@
+## Bigquery datasets selector
+Tables will be listed and available for selection after a dataset is selected.
+
+### Usage
+Requires a [bigquery-datasets-selector](https://github.com/tejohnso/bigquery-datasets-selector) somewhere on the page.  See the test section for a working example.
+
+### Development set up
+```
+bower install bigquery-datasets-selector
+cd bower_components
+rm -rf bigquery-tables-selector && git clone https://github.com/tejohnso/bigquery-tables-selector.git
+cd bigquery-tables-selector
+npm install
+```
+
+### Test
+
+ - Expects Chrome via /usr/bin/google-chrome-stable
+ - Requires an http server (eg: `npm install -g http-server`)
+
+```
+npm install -g http-server
+npm install -g selenium-standalone
+npm run setup-test-env
+npm test
+npm run teardown-test-env
+```

bigquery-tables-selector.html

@@ -0,0 +1,5 @@
+<select>
+  <option value="" disabled selected>Waiting for datasets</option>
+</select>
+
+<script src="bigquery-tables-selector.js"></script>

bigquery-tables-selector.js

@@ -0,0 +1,36 @@
+(function() {
+  var thisImportDoc = document.currentScript.ownerDocument,
+  selectElement = thisImportDoc.querySelector("select"),
+  proto = Object.create(HTMLElement.prototype);
+  proto.createdCallback = function() {
+    this.appendChild(selectElement);
+  };
+
+  document.registerElement("bigquery-tables-selector", {prototype: proto});
+
+  document.querySelector("bigquery-datasets-selector").addEventListener("change", populateTables);
+
+  function populateTables(e) {
+    var projectId = document.querySelector("bigquery-projects-selector select").value;
+    var datasetId = document.querySelector("bigquery-datasets-selector select").value;
+    reset();
+    gapi.client.bigquery.tables.list({"projectId": projectId, "datasetId": datasetId})
+    .then((resp)=>{
+      resp.result.tables.forEach((val)=>{
+        var option = document.createElement("option");
+        option.text = val.friendlyName || val.tableReference.tableId;
+        selectElement.add(option);
+      });
+
+      selectElement.options[0].textContent = "Choose table";
+    });
+  }
+
+  function reset() {
+    if (!selectElement) {return;}
+    for (var i = 1, j = selectElement.children.length; i < j; i += 1) {
+      selectElement.removeChild(selectElement.children[1]);
+    }
+    selectElement.children[0].innerHTML = "Select a dataset";
+  }
+}());

bower.json

@@ -0,0 +1,23 @@
+{
+  "name": "bigquery-tables-selector",
+  "version": "0.1.0",
+  "authors": [
+    "Tyler Johnson <mail@tyler-johnson.ca>"
+  ],
+  "description": "Shows a dropdown list of user tables",
+  "main": "bigquery-tables-selector.html",
+  "keywords": [
+    "web-components"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "bigquery-datasets-selector": "^0.1.0"
+  }
+}

package.json

@@ -0,0 +1,16 @@
+{
+  "name": "bigquery-tables-selector",
+  "version": "0.1.0",
+  "description": "Shows a dropdown list of user tables",
+  "main": "bigquery-tables-selector.html",
+  "devDependencies": {
+    "webdriverio": "^3.4.0"
+  },
+  "scripts": {
+    "setup-test-env": "http-server .. -c-1 & selenium-standalone start &",
+    "test": "mocha test",
+    "teardown-test-env": "(pgrep -f selenium && pgrep -f http-server) |xargs kill 2>/dev/null"
+  },
+  "author": "Tyler Johnson <mail@tyler-johnson.ca> (http://github.com/tejohnso)",
+  "license": "ISC"
+}

test/importing-doc.html

@@ -0,0 +1,20 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Bigquery Tables Selector Test</title>
+    <link rel="import" href="../../google-signin/google-signin.html">
+    <link rel="import" href="../../bigquery-projects-selector/bigquery-projects-selector.html">
+    <link rel="import" href="../../bigquery-datasets-selector/bigquery-datasets-selector.html">
+    <link rel="import" href="../bigquery-tables-selector.html">
+  </head>
+  <body>
+    <google-signin
+      client-id=""
+      scopes="https://www.googleapis.com/auth/cloud-platform.read-only">
+    </google-signin>
+
+    <bigquery-projects-selector></bigquery-projects-selector>
+    <bigquery-datasets-selector></bigquery-datasets-selector>
+    <bigquery-tables-selector></bigquery-tables-selector>
+  </body>
+</html>

test/test.js

@@ -0,0 +1,114 @@
+var webdriverio = require("webdriverio"),
+assert = require("assert"),
+fs = require("fs"),
+options = {
+  host: "localhost",
+  port: 4444,
+  desiredCapabilities: {
+    browserName: "chrome",
+    chromeOptions: {
+      binary: "/usr/bin/google-chrome-stable"
+    }
+  }
+},
+timeForSeleniumInitialRun = 20000;
+
+describe("end to end tests", function() {
+  var client,
+  id = require("./credentials.json").clientId,
+  email = require("./credentials.json").email,
+  pass = require("./credentials.json").pass;
+
+  this.timeout(timeForSeleniumInitialRun);
+
+  before(()=>{
+    client = webdriverio.remote(options);
+    return client.init();
+  });
+
+  describe("basic functionality", function() {
+    it("can read the page title", ()=>{
+      return client
+      .url("localhost:8080/bigquery-tables-selector/test/importing-doc.html")
+      .getTitle()
+      .then((title)=> {
+        console.log("Title was: " + title);
+        assert.equal(title, "Bigquery Tables Selector Test");
+      });
+    });
+  });
+
+  describe("Datasets", function() {
+    it("shows the list of bigquery tables", function() {
+      return client.waitForExist("google-signin")
+      .then(()=>{return client.execute((id)=>{
+        document.querySelector("google-signin").setAttribute("client-id", id);
+      }, id)})
+      .then(()=>{return client.waitForEnabled("google-signin");})
+      .then(()=>{return client.click("google-signin");})
+      .then(()=>{return client.getTabIds();})
+      .then((ids)=>{return ids.pop()})
+      .then((id)=>{return client.switchTab(id);})
+      .then(()=>{return client.waitForExist("#Email", 10000);})
+      .then(()=>{return client.setValue("#Email", email + "\n");})
+      .then(()=>{return client.waitForExist("#Passwd", 10000);})
+      .then(()=>{return client.waitForEnabled("#Passwd", 10000);})
+      .then(()=>{return client.setValue("#Passwd", pass + "\n");})
+      .then(()=>{return client.switchTab();})
+      .then(()=>{return client.waitUntil(projectListingHasBeenRetrieved, 10000);})
+      .then(()=>{return client.selectByIndex("bigquery-projects-selector", 1);})
+      .then(()=>{return client.waitUntil(datasetsHaveBeenRetrieved, 10000);})
+      .then(()=>{return client.selectByIndex("bigquery-datasets-selector", 1);})
+      .then(()=>{return client.waitUntil(tablesHaveBeenRetrieved, 10000);})
+
+      function projectListingHasBeenRetrieved() {
+        return client.execute(function() {
+          var selectElement = document.querySelector("bigquery-projects-selector select");
+          if (!selectElement) {return {value: 0};}
+          return selectElement.children.length;
+        })
+        .then((domResult)=>{
+          if (domResult.value > 1) {
+            console.log(`Project count: ${domResult.value}`);
+          }
+
+          return domResult.value > 1;
+        });
+      }
+
+      function datasetsHaveBeenRetrieved() {
+        return client.execute(function() {
+          var selectElement = document.querySelector("bigquery-datasets-selector select");
+          if (!selectElement) {return {value: 0};}
+          return selectElement.children.length;
+        })
+        .then((domResult)=>{
+          if (domResult.value > 1) {
+            console.log(`Dataset count: ${domResult.value}`);
+          }
+
+          return domResult.value > 1;
+        });
+      }
+
+      function tablesHaveBeenRetrieved() {
+        return client.execute(function() {
+          var selectElement = document.querySelector("bigquery-tables-selector select");
+          if (!selectElement) {return {value: 0};}
+          return selectElement.children.length;
+        })
+        .then((domResult)=>{
+          if (domResult.value > 1) {
+            console.log(`Dataset count: ${domResult.value}`);
+          }
+
+          return domResult.value > 1;
+        });
+      }
+    });
+  });
+
+  after(()=>{
+    return client.end();
+  });
+});