initial commit for querytabv2

Adds e2e baseline SQL test in puppeteer (#160 )
* Adds e2e baseline SQL test in puppeteer * fix lint * Skip index test * add to ci * Stop waiting for server * Switch to headless mode * Adds wait-for-server to package.json and uses it in puppeteer CI * Adds waiton * top level wait on * Adds env var to secrets ci.yml * use existing connection string * redo tests * nits and hopefully fix timeout issue * Fix config file * try waiting for delete container menu * Removes statuseval * Remove unused var * Slow down and add quotes to selector * Fix blocking point, remove wait * Reduce to 50 * Adds database delete stuff * remove logs, add back waitFors * Finish container SQL spec test
2025-12-24 19:31:36 +00:00 · 2020-09-10 06:22:56 -07:00 · 2020-09-09 13:18:27 -04:00 · 2020-09-09 09:28:30 -07:00
57 changed files with 572 additions and 362 deletions
--- a/.env.example
+++ b/.env.example
@@ -4,3 +4,4 @@ PORTAL_RUNNER_PASSWORD=
 PORTAL_RUNNER_SUBSCRIPTION=
 PORTAL_RUNNER_RESOURCE_GROUP=
 PORTAL_RUNNER_DATABASE_ACCOUNT=
+PORTAL_RUNNER_CONNECTION_STRING=
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -196,6 +196,26 @@ jobs:
        shell: bash
        env:
          NODE_TLS_REJECT_UNAUTHORIZED: 0
+  endtoendpuppeteer:
+    name: "End to end puppeteer tests"
+    needs: [lint, format, compile, unittest]
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js 12.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12.x
+      - name: End to End Puppeteer Tests
+        run: |
+          npm ci
+          npm start &
+          npm run wait-for-server
+          npm run test:e2e
+        shell: bash
+        env:
+          NODE_TLS_REJECT_UNAUTHORIZED: 0
+          PORTAL_RUNNER_CONNECTION_STRING: ${{ secrets.CONNECTION_STRING_SQL }}
  nuget:
    name: Publish Nuget
    if: github.ref == 'refs/heads/master' || contains(github.ref, 'hotfix/') || contains(github.ref, 'release/')
--- a/jest-puppeteer.config.js
+++ b/jest-puppeteer.config.js
@@ -3,7 +3,8 @@ const isCI = require("is-ci");
 module.exports = {
  launch: {
    headless: isCI,
-    slowMo: isCI ? null : 20,
-    defaultViewport: null
+    slowMo: 50,
+    defaultViewport: null,
+    ignoreHTTPSErrors: true
  }
 };
--- a/less/Common/Constants.less
+++ b/less/Common/Constants.less
@@ -54,7 +54,7 @@

@SelectionColor: #3074B0;

-@FocusColor: #00bcf2;
+@FocusColor: #605e5c;

 /******************************************************************************
                                METRICS
--- a/less/documentDB.less
+++ b/less/documentDB.less
@@ -1646,7 +1646,7 @@ p {
 }

 .contextual-pane .collid {
-    border: 1px solid #bbbbbb;
+    border: 1px solid #605e5c;
    font-size: 10px;
    padding: 5px 10px;
    color: #000;
@@ -2423,22 +2423,6 @@ a:link {
    display: none;
 }

-::-webkit-input-placeholder {
-    color: #969696;
-}
-
-::-moz-placeholder {
-    color: #969696;
-}
-
-:-ms-input-placeholder {
-    color: #969696;
-}
-
-:-moz-placeholder {
-    color: #969696;
-}
-
 ::-ms-expand {
    color: #969696;
 }
@@ -3021,4 +3005,8 @@ settings-pane {

 .warningErrorContent a {
    color: @AccentMediumHigh
-}
+}
+
+.infoBoxContent a {
+    color: @AccentMediumHigh
+} 
--- a/package-lock.json
+++ b/package-lock.json
@@ -3490,9 +3490,9 @@
      }
    },
    "@fluentui/date-time-utilities": {
-      "version": "7.7.0",
-      "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-7.7.0.tgz",
-      "integrity": "sha512-rgtGX5x1AeYUfilfkgP6ag+ZKx41BJcUs16k6iSxXxd/mt00DAPOGY8ODGikKFpjGKcUwjKfYBssyKkVHDucfA==",
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/@fluentui/date-time-utilities/-/date-time-utilities-7.8.0.tgz",
+      "integrity": "sha512-qzlTp3t+PghebJsLK9JwZr91qBRZ/fOml8TQCIjdtsEn4mH6/ciCwir7Fj8iOEkwwTC0iKsEr1jfsITtJKWSmA==",
      "requires": {
        "@uifabric/set-version": "^7.0.22",
        "tslib": "^1.10.0"
@@ -3517,9 +3517,9 @@
      }
    },
    "@fluentui/react-focus": {
-      "version": "7.15.0",
-      "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-7.15.0.tgz",
-      "integrity": "sha512-xbxB0cbyEoUfQZ19pAqBeWCYJ/4IOu1FG4bhVjDimqSD7qKwJbLlJSDNwmHr05SWprdhmqJe23KOwsHMgyvnrw==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@fluentui/react-focus/-/react-focus-7.16.0.tgz",
+      "integrity": "sha512-TwB4Av7ID70ejisDIGkCZGKOxlquSazr6W+9Jv1JQAvsBLuj5XOspFJH4/Igjniw1LeO9QmAvFZeh/XRShiObw==",
      "requires": {
        "@fluentui/keyboard-key": "^0.2.11",
        "@uifabric/merge-styles": "^7.18.0",
@@ -3685,6 +3685,12 @@
      "integrity": "sha512-1dVNHT76Uu5N3eJNTYcvxee+jzX4Z9lfciqRRHCU27ihbUcYi+iSc2iml5Ke1LXe1SyJCLA0+14Jh4tXJgOppA==",
      "dev": true
    },
+    "@hapi/formula": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@hapi/formula/-/formula-2.0.0.tgz",
+      "integrity": "sha512-V87P8fv7PI0LH7LiVi8Lkf3x+KCO7pQozXRssAHNXXL9L1K+uyu4XypLXwxqVDKgyQai6qj3/KteNlrqDx4W5A==",
+      "dev": true
+    },
    "@hapi/hoek": {
      "version": "8.5.1",
      "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-8.5.1.tgz",
@@ -3703,6 +3709,12 @@
        "@hapi/topo": "3.x.x"
      }
    },
+    "@hapi/pinpoint": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@hapi/pinpoint/-/pinpoint-2.0.0.tgz",
+      "integrity": "sha512-vzXR5MY7n4XeIvLpfl3HtE3coZYO4raKXW766R6DZw/6aLqR26iuZ109K7a0NtF2Db0jxqh7xz2AxkUwpUFybw==",
+      "dev": true
+    },
    "@hapi/topo": {
      "version": "3.1.6",
      "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-3.1.6.tgz",
@@ -7616,6 +7628,16 @@
        "@types/enzyme": "*"
      }
    },
+    "@types/expect-puppeteer": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/@types/expect-puppeteer/-/expect-puppeteer-4.4.3.tgz",
+      "integrity": "sha512-jWZOO9d8ST2vutV5yxZ1OYxxtYD0lOufIgOUlDjyTNBGo8um67shJs2NQDLVDG06wWrabpPPOUQlI8GSvsdKVQ==",
+      "dev": true,
+      "requires": {
+        "@types/jest": "*",
+        "@types/puppeteer": "*"
+      }
+    },
    "@types/geojson": {
      "version": "7946.0.7",
      "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.7.tgz",
@@ -7691,6 +7713,33 @@
      "integrity": "sha512-DC8xTuW/6TYgvEg3HEXS7cu9OijFqprVDXXiOcdOKZCU/5PJNLZU37VVvmZHdtMiGOa8wAA/We+JzbdxFzQTRQ==",
      "dev": true
    },
+    "@types/jest-environment-puppeteer": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/@types/jest-environment-puppeteer/-/jest-environment-puppeteer-4.3.2.tgz",
+      "integrity": "sha512-QVR49cGaQMOrWRN7CXlvtPMuVAxa3Z+W3APxhWoSQLG/lvz1y03ECPvS7Y9eK+hgfndK+39400rO6IifDJV9YA==",
+      "dev": true,
+      "requires": {
+        "@jest/environment": "^24",
+        "@jest/fake-timers": "^24",
+        "@jest/types": "^24",
+        "@types/puppeteer": "*",
+        "jest-mock": "^24"
+      },
+      "dependencies": {
+        "@jest/environment": {
+          "version": "24.9.0",
+          "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-24.9.0.tgz",
+          "integrity": "sha512-5A1QluTPhvdIPFYnO3sZC3smkNeXPVELz7ikPbhUj0bQjB07EoE9qtLrem14ZUYWdVayYbsjVwIiL4WBIMV4aQ==",
+          "dev": true,
+          "requires": {
+            "@jest/fake-timers": "^24.9.0",
+            "@jest/transform": "^24.9.0",
+            "@jest/types": "^24.9.0",
+            "jest-mock": "^24.9.0"
+          }
+        }
+      }
+    },
    "@types/json-schema": {
      "version": "7.0.4",
      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.4.tgz",
@@ -7766,6 +7815,15 @@
      "integrity": "sha512-3AQoUxQcQtLHsK25wtTWIoIpgYjH3vSDroZOUr7PpCHw/jLY1RB9z9E8dBT/OSmwStVgkRNvdh+ZHNiomRieaw==",
      "dev": true
    },
+    "@types/puppeteer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@types/puppeteer/-/puppeteer-3.0.1.tgz",
+      "integrity": "sha512-t03eNKCvWJXhQ8wkc5C6GYuSqMEdKLOX0GLMGtks25YZr38wKZlKTwGM/BoAPVtdysX7Bb9tdwrDS1+NrW3RRA==",
+      "dev": true,
+      "requires": {
+        "@types/node": "*"
+      }
+    },
    "@types/pvutils": {
      "version": "0.0.1",
      "resolved": "https://registry.npmjs.org/@types/pvutils/-/pvutils-0.0.1.tgz",
@@ -8389,46 +8447,6 @@
        }
      }
    },
-    "@uifabric/react-hooks": {
-      "version": "7.11.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/react-hooks/-/react-hooks-7.11.0.tgz",
-      "integrity": "sha512-iU7c+JR+rY5kBTPmrF8F6iJBQw309MX/MvOx6ElhmNceBaa8BqDuqR9+TVfkH+Bxp37bmZnCaQF5w4+QWHZ81g==",
-      "requires": {
-        "@uifabric/set-version": "^7.0.22",
-        "@uifabric/utilities": "^7.31.0",
-        "tslib": "^1.10.0"
-      },
-      "dependencies": {
-        "@uifabric/merge-styles": {
-          "version": "7.18.0",
-          "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-7.18.0.tgz",
-          "integrity": "sha512-805WIbN7lAJATXKxZjjRbIgN7raRMwWYWeDkJJ52PCPuCesOvbpdr0GkH8rC6GQ7EB0MB7YM2i6Fiye7SFewbw==",
-          "requires": {
-            "@uifabric/set-version": "^7.0.22",
-            "tslib": "^1.10.0"
-          }
-        },
-        "@uifabric/set-version": {
-          "version": "7.0.22",
-          "resolved": "https://registry.npmjs.org/@uifabric/set-version/-/set-version-7.0.22.tgz",
-          "integrity": "sha512-IG35UNJNxqI7NC2eYuobGTD+v4W0VHQcC3bYd5Na9EgoC9jVgguS8n6EXUtP/lC1vJEYEyPEZdVwhPxKw4F4Sw==",
-          "requires": {
-            "tslib": "^1.10.0"
-          }
-        },
-        "@uifabric/utilities": {
-          "version": "7.31.0",
-          "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-7.31.0.tgz",
-          "integrity": "sha512-m4Yeyn4gyW7xS8LvOnCesokPModYS2YuE9GQmO++MDZ/vC5RRNlvlyktUZDuxCZ84cNCiXyTQ8nImBaPGnxHVQ==",
-          "requires": {
-            "@uifabric/merge-styles": "^7.18.0",
-            "@uifabric/set-version": "^7.0.22",
-            "prop-types": "^15.7.2",
-            "tslib": "^1.10.0"
-          }
-        }
-      }
-    },
    "@uifabric/set-version": {
      "version": "7.0.15",
      "resolved": "https://registry.npmjs.org/@uifabric/set-version/-/set-version-7.0.15.tgz",
@@ -8929,9 +8947,9 @@
      }
    },
    "acorn-jsx": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.2.0.tgz",
-      "integrity": "sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.1.tgz",
+      "integrity": "sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng==",
      "dev": true
    },
    "acorn-walk": {
@@ -9316,6 +9334,13 @@
      "integrity": "sha512-yG89F0j9B4B0MKIcFyWWxnpZPLaNTjCj4tkE3fjbAoo0qmpGw0PYYqSbX/4ebnd9Icn8ZgK4K1fvDyEtW1JYtQ==",
      "requires": {
        "pvutils": "^1.0.17"
+      },
+      "dependencies": {
+        "pvutils": {
+          "version": "1.0.17",
+          "resolved": "https://registry.npmjs.org/pvutils/-/pvutils-1.0.17.tgz",
+          "integrity": "sha512-wLHYUQxWaXVQvKnwIDWFVKDJku9XDCvyhhxoq8dc5MFdIlRenyPI9eSfEtcvgHgD7FlvCyGAlWgOzRnZD99GZQ=="
+        }
      }
    },
    "assert": {
@@ -15041,12 +15066,6 @@
            "pinkie-promise": "^2.0.0"
          }
        },
-        "fsevents": {
-          "version": "2.1.3",
-          "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
-          "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
-          "optional": true
-        },
        "get-caller-file": {
          "version": "1.0.3",
          "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.3.tgz",
@@ -15095,7 +15114,6 @@
            "@types/graceful-fs": "^4.1.2",
            "anymatch": "^3.0.3",
            "fb-watchman": "^2.0.0",
-            "fsevents": "^2.1.2",
            "graceful-fs": "^4.2.4",
            "jest-serializer": "^25.5.0",
            "jest-util": "^25.5.0",
@@ -17657,6 +17675,19 @@
          "requires": {
            "has-flag": "^4.0.0"
          }
+        },
+        "wait-on": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/wait-on/-/wait-on-3.3.0.tgz",
+          "integrity": "sha512-97dEuUapx4+Y12aknWZn7D25kkjMk16PbWoYzpSdA8bYpVfS6hpl2a2pOWZ3c+Tyt3/i4/pglyZctG3J4V1hWQ==",
+          "dev": true,
+          "requires": {
+            "@hapi/joi": "^15.0.3",
+            "core-js": "^2.6.5",
+            "minimist": "^1.2.0",
+            "request": "^2.88.0",
+            "rx": "^4.1.0"
+          }
        }
      }
    },
@@ -22285,6 +22316,16 @@
            "tslib": "^1.10.0"
          }
        },
+        "@uifabric/react-hooks": {
+          "version": "7.12.0",
+          "resolved": "https://registry.npmjs.org/@uifabric/react-hooks/-/react-hooks-7.12.0.tgz",
+          "integrity": "sha512-vPrg7NVtjjZlDS33tDUiyJSov8PNHBBX8w+EN9eatxP0g6dDkvGv8uWd+9Xpxrliuzi7ad7vlmUMOQffYJntMg==",
+          "requires": {
+            "@uifabric/set-version": "^7.0.22",
+            "@uifabric/utilities": "^7.31.0",
+            "tslib": "^1.10.0"
+          }
+        },
        "@uifabric/set-version": {
          "version": "7.0.22",
          "resolved": "https://registry.npmjs.org/@uifabric/set-version/-/set-version-7.0.22.tgz",
@@ -23400,11 +23441,6 @@
        "tslib": "^1.10.0"
      }
    },
-    "pvutils": {
-      "version": "1.0.17",
-      "resolved": "https://registry.npmjs.org/pvutils/-/pvutils-1.0.17.tgz",
-      "integrity": "sha512-wLHYUQxWaXVQvKnwIDWFVKDJku9XDCvyhhxoq8dc5MFdIlRenyPI9eSfEtcvgHgD7FlvCyGAlWgOzRnZD99GZQ=="
-    },
    "q": {
      "version": "1.5.1",
      "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
@@ -23516,9 +23552,9 @@
      }
    },
    "react": {
-      "version": "16.13.1",
-      "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz",
-      "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==",
+      "version": "16.9.0",
+      "resolved": "https://registry.npmjs.org/react/-/react-16.9.0.tgz",
+      "integrity": "sha512-+7LQnFBwkiw+BobzOF6N//BdoNw0ouwmSJTEm9cglOOmsg/TMiFHZLe2sEoN5M7LgJTj9oHH0gxklfnQe66S1w==",
      "requires": {
        "loose-envify": "^1.1.0",
        "object-assign": "^4.1.1",
@@ -25755,23 +25791,6 @@
      "resolved": "https://registry.npmjs.org/svgpath/-/svgpath-2.2.3.tgz",
      "integrity": "sha512-xA0glXYpJ9SYT4JeMp3c0psbqdZsG1c0ywGvdJUPY2FKEgwJV7NgkeYuuQiOxMp+XsK9nCqjm3KDw0LkM1YLXw=="
    },
-    "swr": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/swr/-/swr-0.3.2.tgz",
-      "integrity": "sha512-Bs5Bihq1hQ66O5bdKaL47iZ2nlAaBsd8tTLRLkw9stZeuBEfH7zSuQI95S2TpchL0ybsMq3isWwuso2uPvCfHA==",
-      "dev": true,
-      "requires": {
-        "fast-deep-equal": "2.0.1"
-      },
-      "dependencies": {
-        "fast-deep-equal": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz",
-          "integrity": "sha1-ewUhjd+WZ79/Nwv3/bLLFf3Qqkk=",
-          "dev": true
-        }
-      }
-    },
    "symbol-observable": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
@@ -26918,16 +26937,65 @@
      }
    },
    "wait-on": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/wait-on/-/wait-on-3.3.0.tgz",
-      "integrity": "sha512-97dEuUapx4+Y12aknWZn7D25kkjMk16PbWoYzpSdA8bYpVfS6hpl2a2pOWZ3c+Tyt3/i4/pglyZctG3J4V1hWQ==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/wait-on/-/wait-on-4.0.2.tgz",
+      "integrity": "sha512-Qpmgm3Hw/sXm7xK68FBsYy5r+Uid94/QymwnEjn9GTpfiWTUVYm0bccivVwY/BXGYO2r+5Cd8S/DzrRZqHK/9w==",
      "dev": true,
      "requires": {
-        "@hapi/joi": "^15.0.3",
-        "core-js": "^2.6.5",
-        "minimist": "^1.2.0",
-        "request": "^2.88.0",
-        "rx": "^4.1.0"
+        "@hapi/joi": "^17.1.1",
+        "lodash": "^4.17.15",
+        "minimist": "^1.2.5",
+        "request": "^2.88.2",
+        "request-promise-native": "^1.0.8",
+        "rxjs": "^6.5.5"
+      },
+      "dependencies": {
+        "@hapi/address": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/@hapi/address/-/address-4.1.0.tgz",
+          "integrity": "sha512-SkszZf13HVgGmChdHo/PxchnSaCJ6cetVqLzyciudzZRT0jcOouIF/Q93mgjw8cce+D+4F4C1Z/WrfFN+O3VHQ==",
+          "dev": true,
+          "requires": {
+            "@hapi/hoek": "^9.0.0"
+          }
+        },
+        "@hapi/hoek": {
+          "version": "9.0.4",
+          "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.0.4.tgz",
+          "integrity": "sha512-EwaJS7RjoXUZ2cXXKZZxZqieGtc7RbvQhUy8FwDoMQtxWVi14tFjeFCYPZAM1mBCpOpiBpyaZbb9NeHc7eGKgw==",
+          "dev": true
+        },
+        "@hapi/joi": {
+          "version": "17.1.1",
+          "resolved": "https://registry.npmjs.org/@hapi/joi/-/joi-17.1.1.tgz",
+          "integrity": "sha512-p4DKeZAoeZW4g3u7ZeRo+vCDuSDgSvtsB/NpfjXEHTUjSeINAi/RrVOWiVQ1isaoLzMvFEhe8n5065mQq1AdQg==",
+          "dev": true,
+          "requires": {
+            "@hapi/address": "^4.0.1",
+            "@hapi/formula": "^2.0.0",
+            "@hapi/hoek": "^9.0.0",
+            "@hapi/pinpoint": "^2.0.0",
+            "@hapi/topo": "^5.0.0"
+          }
+        },
+        "@hapi/topo": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.0.0.tgz",
+          "integrity": "sha512-tFJlT47db0kMqVm3H4nQYgn6Pwg10GTZHb1pwmSiv1K4ks6drQOtfEF5ZnPjkvC+y4/bUPHK+bc87QvLcL+WMw==",
+          "dev": true,
+          "requires": {
+            "@hapi/hoek": "^9.0.0"
+          }
+        },
+        "rxjs": {
+          "version": "6.6.2",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
+          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "dev": true,
+          "requires": {
+            "tslib": "^1.9.0"
+          }
+        }
      }
    },
    "wait-port": {
--- a/package.json
+++ b/package.json
@@ -72,7 +72,7 @@
    "promise-polyfill": "8.1.0",
    "promise.prototype.finally": "3.1.0",
    "q": "1.5.1",
-    "react": "16.13.1",
+    "react": "16.9.0",
    "react-animate-height": "2.0.8",
    "react-dnd": "9.4.0",
    "react-dnd-html5-backend": "9.4.0",
@@ -102,12 +102,15 @@
    "@types/d3": "4.13.2",
    "@types/enzyme": "3.10.3",
    "@types/enzyme-adapter-react-16": "1.0.5",
+    "@types/expect-puppeteer": "4.4.3",
    "@types/hasher": "0.0.31",
    "@types/jest": "23.3.10",
+    "@types/jest-environment-puppeteer": "4.3.2",
    "@types/memoize-one": "4.1.1",
    "@types/node": "12.11.1",
    "@types/promise.prototype.finally": "2.0.3",
    "@types/prop-types": "15.5.8",
+    "@types/puppeteer": "3.0.1",
    "@types/q": "1.5.1",
    "@types/react": "16.8.25",
    "@types/react-dom": "16.0.7",
@@ -160,13 +163,13 @@
    "rimraf": "3.0.0",
    "sinon": "3.2.1",
    "style-loader": "0.23.0",
-    "swr": "0.3.2",
    "terser-webpack-plugin": "3.0.5",
    "ts-loader": "6.2.2",
    "tslint": "5.11.0",
    "tslint-microsoft-contrib": "6.0.0",
    "typescript": "4.0.2",
    "url-loader": "1.1.1",
+    "wait-on": "4.0.2",
    "webpack": "4.43.0",
    "webpack-bundle-analyzer": "3.6.1",
    "webpack-cli": "3.3.10",
@@ -185,6 +188,7 @@
    "test": "rimraf coverage && jest",
    "test:e2e": "jest -c ./jest.config.e2e.js --detectOpenHandles",
    "watch": "npm run start",
+    "wait-for-server": "wait-on -t 240000 -i 5000 -v https-get://0.0.0.0:1234/",
    "build:ase": "gulp build:ase",
    "compile": "tsc",
    "compile:contracts": "tsc -p ./tsconfig.contracts.json",
--- a/src/Common/Constants.ts
+++ b/src/Common/Constants.ts
@@ -122,6 +122,7 @@ export class Features {
  public static readonly enableTtl = "enablettl";
  public static readonly enableNotebooks = "enablenotebooks";
  public static readonly enableGalleryPublish = "enablegallerypublish";
+  public static readonly enableQueryTabV2 = "enablequerytabv2";
  public static readonly enableCodeOfConduct = "enablecodeofconduct";
  public static readonly enableLinkInjection = "enablelinkinjection";
  public static readonly enableSpark = "enablespark";
--- a/src/Common/dataAccess/createCollection.ts
+++ b/src/Common/dataAccess/createCollection.ts
@@ -6,26 +6,23 @@ import { ContainerRequest } from "@azure/cosmos/dist-esm/client/Container/Contai
 import { DatabaseRequest } from "@azure/cosmos/dist-esm/client/Database/DatabaseRequest";
 import { DefaultAccountExperienceType } from "../../DefaultAccountExperienceType";
 import { RequestOptions } from "@azure/cosmos/dist-esm";
-import * as ARMTypes from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/types";
+import * as ARMTypes from "../../Utils/arm/generatedClients/2020-04-01/types";
 import { client } from "../CosmosClient";
 import { createMongoCollectionWithProxy } from "../MongoProxyClient";
-import {
-  createUpdateSqlContainer,
-  getSqlContainer
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
+import { createUpdateSqlContainer, getSqlContainer } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
 import {
  createUpdateCassandraTable,
  getCassandraTable
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
 import {
  createUpdateMongoDBCollection,
  getMongoDBCollection
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
 import {
  createUpdateGremlinGraph,
  getGremlinGraph
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
-import { createUpdateTable, getTable } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
+import { createUpdateTable, getTable } from "../../Utils/arm/generatedClients/2020-04-01/tableResources";
 import { logConsoleProgress, logConsoleError, logConsoleInfo } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { refreshCachedResources } from "../DataAccessUtilityBase";
--- a/src/Common/dataAccess/createDatabase.ts
+++ b/src/Common/dataAccess/createDatabase.ts
@@ -9,24 +9,21 @@ import {
  MongoDBDatabaseCreateUpdateParameters,
  SqlDatabaseCreateUpdateParameters,
  CreateUpdateOptions
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/types";
+} from "../../Utils/arm/generatedClients/2020-04-01/types";
 import { client } from "../CosmosClient";
-import {
-  createUpdateSqlDatabase,
-  getSqlDatabase
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
+import { createUpdateSqlDatabase, getSqlDatabase } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
 import {
  createUpdateCassandraKeyspace,
  getCassandraKeyspace
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
 import {
  createUpdateMongoDBDatabase,
  getMongoDBDatabase
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
 import {
  createUpdateGremlinDatabase,
  getGremlinDatabase
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
 import { logConsoleProgress, logConsoleError, logConsoleInfo } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { refreshCachedOffers, refreshCachedResources } from "../DataAccessUtilityBase";
--- a/src/Common/dataAccess/deleteCollection.ts
+++ b/src/Common/dataAccess/deleteCollection.ts
@@ -1,10 +1,10 @@
 import { AuthType } from "../../AuthType";
 import { DefaultAccountExperienceType } from "../../DefaultAccountExperienceType";
-import { deleteSqlContainer } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
-import { deleteCassandraTable } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
-import { deleteMongoDBCollection } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
-import { deleteGremlinGraph } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
-import { deleteTable } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources";
+import { deleteSqlContainer } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
+import { deleteCassandraTable } from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
+import { deleteMongoDBCollection } from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
+import { deleteGremlinGraph } from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
+import { deleteTable } from "../../Utils/arm/generatedClients/2020-04-01/tableResources";
 import { logConsoleError, logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { sendNotificationForError } from "./sendNotificationForError";
--- a/src/Common/dataAccess/deleteDatabase.ts
+++ b/src/Common/dataAccess/deleteDatabase.ts
@@ -1,9 +1,9 @@
 import { AuthType } from "../../AuthType";
 import { DefaultAccountExperienceType } from "../../DefaultAccountExperienceType";
-import { deleteSqlDatabase } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
-import { deleteCassandraKeyspace } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
-import { deleteMongoDBDatabase } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
-import { deleteGremlinDatabase } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
+import { deleteSqlDatabase } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
+import { deleteCassandraKeyspace } from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
+import { deleteMongoDBDatabase } from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
+import { deleteGremlinDatabase } from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
 import { logConsoleError, logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { userContext } from "../../UserContext";
 import { client } from "../CosmosClient";
--- a/src/Common/dataAccess/readCollections.ts
+++ b/src/Common/dataAccess/readCollections.ts
@@ -2,11 +2,11 @@ import * as DataModels from "../../Contracts/DataModels";
 import { AuthType } from "../../AuthType";
 import { DefaultAccountExperienceType } from "../../DefaultAccountExperienceType";
 import { client } from "../CosmosClient";
-import { listSqlContainers } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
-import { listCassandraTables } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
-import { listMongoDBCollections } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
-import { listGremlinGraphs } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
-import { listTables } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources";
+import { listSqlContainers } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
+import { listCassandraTables } from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
+import { listMongoDBCollections } from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
+import { listGremlinGraphs } from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
+import { listTables } from "../../Utils/arm/generatedClients/2020-04-01/tableResources";
 import { logConsoleProgress, logConsoleError } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { sendNotificationForError } from "./sendNotificationForError";
--- a/src/Common/dataAccess/readDatabases.ts
+++ b/src/Common/dataAccess/readDatabases.ts
@@ -2,10 +2,10 @@ import * as DataModels from "../../Contracts/DataModels";
 import { AuthType } from "../../AuthType";
 import { DefaultAccountExperienceType } from "../../DefaultAccountExperienceType";
 import { client } from "../CosmosClient";
-import { listSqlDatabases } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
-import { listCassandraKeyspaces } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
-import { listMongoDBDatabases } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
-import { listGremlinDatabases } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
+import { listSqlDatabases } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
+import { listCassandraKeyspaces } from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
+import { listMongoDBDatabases } from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
+import { listGremlinDatabases } from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
 import { logConsoleProgress, logConsoleError } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { sendNotificationForError } from "./sendNotificationForError";
--- a/src/Common/dataAccess/updateCollection.ts
+++ b/src/Common/dataAccess/updateCollection.ts
@@ -6,26 +6,23 @@ import {
  ExtendedResourceProperties,
  SqlContainerCreateUpdateParameters,
  SqlContainerResource
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/types";
+} from "../../Utils/arm/generatedClients/2020-04-01/types";
 import { RequestOptions } from "@azure/cosmos/dist-esm";
 import { client } from "../CosmosClient";
-import {
-  createUpdateSqlContainer,
-  getSqlContainer
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources";
+import { createUpdateSqlContainer, getSqlContainer } from "../../Utils/arm/generatedClients/2020-04-01/sqlResources";
 import {
  createUpdateCassandraTable,
  getCassandraTable
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/cassandraResources";
 import {
  createUpdateMongoDBCollection,
  getMongoDBCollection
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/mongoDBResources";
 import {
  createUpdateGremlinGraph,
  getGremlinGraph
-} from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources";
-import { createUpdateTable, getTable } from "../../Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources";
+} from "../../Utils/arm/generatedClients/2020-04-01/gremlinResources";
+import { createUpdateTable, getTable } from "../../Utils/arm/generatedClients/2020-04-01/tableResources";
 import { logConsoleError, logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { logError } from "../Logger";
 import { refreshCachedResources } from "../DataAccessUtilityBase";
--- a/src/Contracts/DataModels.ts
+++ b/src/Contracts/DataModels.ts
@@ -709,6 +709,11 @@ export interface SparkPool extends ArmResource {
  properties: SparkPoolProperties;
 }

+export interface MemoryUsageInfo {
+  freeKB: number;
+  totalKB: number;
+}
+
 export interface resourceTokenConnectionStringProperties {
  accountEndpoint: string;
  collectionId: string;
--- a/src/Contracts/ViewModels.ts
+++ b/src/Contracts/ViewModels.ts
@@ -353,7 +353,8 @@ export enum CollectionTabKind {
  NotebookV2 = 15,
  SparkMasterTab = 16,
  Gallery = 17,
-  NotebookViewer = 18
+  NotebookViewer = 18,
+  QueryV2 = 19
 }

 export enum TerminalKind {
--- a/src/Explorer/ComponentRegisterer.ts
+++ b/src/Explorer/ComponentRegisterer.ts
@@ -35,6 +35,7 @@ ko.components.register("trigger-tab", new TabComponents.TriggerTab());
 ko.components.register("user-defined-function-tab", new TabComponents.UserDefinedFunctionTab());
 ko.components.register("settings-tab", new TabComponents.SettingsTab());
 ko.components.register("query-tab", new TabComponents.QueryTab());
+ko.components.register("query-tab-v2", new TabComponents.QueryTabV2());
 ko.components.register("tables-query-tab", new TabComponents.QueryTablesTab());
 ko.components.register("graph-tab", new TabComponents.GraphTab());
 ko.components.register("mongo-shell-tab", new TabComponents.MongoShellTab());
--- a/src/Explorer/Controls/Query/QueryComponent.tsx
+++ b/src/Explorer/Controls/Query/QueryComponent.tsx
@@ -0,0 +1,20 @@
+import * as React from "react";
+import QueryTabV2 from "../../Tabs/QueryTabV2";
+
+export interface QueryComponentProps {
+    queryTab: QueryTabV2
+}
+
+interface QueryComponentState {
+
+}
+
+export class QueryComponent extends React.Component<QueryComponentProps, QueryComponentState> {
+    public render() : JSX.Element {
+        return (
+            <h1>
+                Query tab v2 is here
+            </h1>
+        )
+    }
+}
--- a/src/Explorer/Controls/Query/QueryComponentAdapter.tsx
+++ b/src/Explorer/Controls/Query/QueryComponentAdapter.tsx
@@ -0,0 +1,21 @@
+import ko from "knockout";
+import * as React from "react";
+import { ReactAdapter } from "../../../Bindings/ReactBindingHandler";
+import { QueryComponent, QueryComponentProps } from "./QueryComponent";
+
+export class QueryComponentAdapter implements ReactAdapter {
+  public parameters: ko.Observable<number>;
+
+  constructor(private props: QueryComponentProps) {
+    this.parameters = ko.observable<number>(Date.now());
+    console.log("adapter intiialized")
+  }
+
+  public renderComponent(): JSX.Element {
+    return <QueryComponent {...this.props} />;
+  }
+
+  public triggerRender(): void {
+    window.requestAnimationFrame(() => this.parameters(Date.now()));
+  }
+}
--- a/src/Explorer/Explorer.ts
+++ b/src/Explorer/Explorer.ts
@@ -209,6 +209,7 @@ export default class Explorer {

  // features
  public isGalleryPublishEnabled: ko.Computed<boolean>;
+  public isQueryTabV2Enabled: ko.Computed<boolean>;
  public isCodeOfConductEnabled: ko.Computed<boolean>;
  public isLinkInjectionEnabled: ko.Computed<boolean>;
  public isGitHubPaneEnabled: ko.Observable<boolean>;
@@ -243,6 +244,7 @@ export default class Explorer {
  public arcadiaWorkspaces: ko.ObservableArray<ArcadiaWorkspaceItem>;
  public hasStorageAnalyticsAfecFeature: ko.Observable<boolean>;
  public isSynapseLinkUpdating: ko.Observable<boolean>;
+  public memoryUsageInfo: ko.Observable<DataModels.MemoryUsageInfo>;
  public notebookManager?: any; // This is dynamically loaded

  private _panes: ContextualPaneBase[] = [];
@@ -373,6 +375,7 @@ export default class Explorer {
        );
      }
    });
+    this.memoryUsageInfo = ko.observable<DataModels.MemoryUsageInfo>();
    this.notificationsClient = options.notificationsClient;
    this.isEmulator = options.isEmulator;

@@ -412,6 +415,9 @@ export default class Explorer {
    this.isGalleryPublishEnabled = ko.computed<boolean>(() =>
      this.isFeatureEnabled(Constants.Features.enableGalleryPublish)
    );
+    this.isQueryTabV2Enabled = ko.computed<boolean>(() =>
+    this.isFeatureEnabled(Constants.Features.enableQueryTabV2)
+    );
    this.isCodeOfConductEnabled = ko.computed<boolean>(() =>
      this.isFeatureEnabled(Constants.Features.enableCodeOfConduct)
    );
@@ -1891,6 +1897,9 @@ export default class Explorer {
  }

  public findSelectedDatabase(): ViewModels.Database {
+    if (!this.selectedNode()) {
+      return null;
+    }
    if (this.selectedNode().nodeKind === "Database") {
      return _.find(this.databases(), (database: ViewModels.Database) => database.rid === this.selectedNode().rid);
    }
--- a/src/Explorer/Menus/CommandBar/CommandBarComponentAdapter.tsx
+++ b/src/Explorer/Menus/CommandBar/CommandBarComponentAdapter.tsx
@@ -82,7 +82,9 @@ export class CommandBarComponentAdapter implements ReactAdapter {
    uiFabricControlButtons.forEach((btn: ICommandBarItemProps) => (btn.iconOnly = true));

    if (this.isNotebookTabActive()) {
-      uiFabricControlButtons.unshift(CommandBarUtil.createMemoryTracker("memoryTracker"));
+      uiFabricControlButtons.unshift(
+        CommandBarUtil.createMemoryTracker("memoryTracker", this.container.memoryUsageInfo)
+      );
    }

    return (
--- a/src/Explorer/Menus/CommandBar/CommandBarUtil.tsx
+++ b/src/Explorer/Menus/CommandBar/CommandBarUtil.tsx
@@ -1,14 +1,16 @@
-import { ICommandBarItemProps } from "office-ui-fabric-react/lib/CommandBar";
-import { Dropdown, IDropdownOption, IDropdownStyles } from "office-ui-fabric-react/lib/Dropdown";
+import _ from "underscore";
+import * as React from "react";
+import { Observable } from "knockout";
 import { IconType } from "office-ui-fabric-react/lib/Icon";
 import { IComponentAsProps } from "office-ui-fabric-react/lib/Utilities";
-import * as React from "react";
-import _ from "underscore";
-import ChevronDownIcon from "../../../../images/Chevron_down.svg";
 import { StyleConstants } from "../../../Common/Constants";
-import { ArcadiaMenuPicker } from "../../Controls/Arcadia/ArcadiaMenuPicker";
+import { ICommandBarItemProps } from "office-ui-fabric-react/lib/CommandBar";
+import { Dropdown, IDropdownStyles, IDropdownOption } from "office-ui-fabric-react/lib/Dropdown";
 import { CommandButtonComponentProps } from "../../Controls/CommandButton/CommandButtonComponent";
+import ChevronDownIcon from "../../../../images/Chevron_down.svg";
+import { ArcadiaMenuPicker } from "../../Controls/Arcadia/ArcadiaMenuPicker";
 import { MemoryTrackerComponent } from "./MemoryTrackerComponent";
+import { MemoryUsageInfo } from "../../../Contracts/DataModels";

 /**
 * Utilities for CommandBar
@@ -176,10 +178,10 @@ export class CommandBarUtil {
    };
  }

-  public static createMemoryTracker(key: string): ICommandBarItemProps {
+  public static createMemoryTracker(key: string, memoryUsageInfo: Observable<MemoryUsageInfo>): ICommandBarItemProps {
    return {
      key,
-      onRender: () => <MemoryTrackerComponent />
+      onRender: () => <MemoryTrackerComponent memoryUsageInfo={memoryUsageInfo} />
    };
  }
 }
--- a/src/Explorer/Menus/CommandBar/MemoryTrackerComponent.tsx
+++ b/src/Explorer/Menus/CommandBar/MemoryTrackerComponent.tsx
@@ -1,71 +1,50 @@
-import React, { FunctionComponent } from "react";
-import useSWR from "swr";
+import * as React from "react";
+import { Observable, Subscription } from "knockout";
+import { MemoryUsageInfo } from "../../../Contracts/DataModels";
 import { ProgressIndicator } from "office-ui-fabric-react/lib/ProgressIndicator";
 import { Spinner, SpinnerSize } from "office-ui-fabric-react/lib/Spinner";
 import { Stack } from "office-ui-fabric-react/lib/Stack";
-import { listConnectionInfo } from "../../../Utils/arm/generatedClients/2020-04-01-notebook/notebookWorkspaces";
-import { NotebookWorkspaceConnectionInfoResult } from "../../../Utils/arm/generatedClients/2020-04-01-notebook/types";
-import { userContext } from "../../../UserContext";

-export interface MemoryUsageInfo {
-  total: number;
-  free: number;
+interface MemoryTrackerProps {
+  memoryUsageInfo: Observable<MemoryUsageInfo>;
 }

-const kbInGB = 1048576;
+export class MemoryTrackerComponent extends React.Component<MemoryTrackerProps> {
+  private memoryUsageInfoSubscription: Subscription;

-const fetchMemoryInfo = async (_key: unknown, connectionInfo: NotebookWorkspaceConnectionInfoResult) => {
-  const response = await fetch(`${connectionInfo.notebookServerEndpoint}/api/metrics/memory`, {
-    method: "GET",
-    headers: {
-      Authorization: `Token ${connectionInfo.authToken}`,
-      "content-type": "application/json"
-    }
-  });
-  if (!response.ok) {
-    throw new Error(await response.text());
+  public componentDidMount(): void {
+    this.memoryUsageInfoSubscription = this.props.memoryUsageInfo.subscribe(() => {
+      this.forceUpdate();
+    });
  }
-  const memoryUsageInfo = (await response.json()) as MemoryUsageInfo;
-  return {
-    totalKB: memoryUsageInfo.total,
-    freeKB: memoryUsageInfo.free
-  };
-};

-export const MemoryTrackerComponent: FunctionComponent = () => {
-  const { data: connectionInfo } = useSWR(
-    [
-      "notebooksConnectionInfo",
-      userContext.subscriptionId,
-      userContext.resourceGroup,
-      userContext.databaseAccount.name,
-      "default"
-    ],
-    (_key, subscriptionId, resourceGroup, accountName, workspace) =>
-      listConnectionInfo(subscriptionId, resourceGroup, accountName, workspace)
-  );
-  const { data } = useSWR(connectionInfo ? ["memoryUsage", connectionInfo] : null, fetchMemoryInfo, {
-    refreshInterval: 2000
-  });
+  public componentWillUnmount(): void {
+    this.memoryUsageInfoSubscription && this.memoryUsageInfoSubscription.dispose();
+  }
+
+  public render(): JSX.Element {
+    const memoryUsageInfo: MemoryUsageInfo = this.props.memoryUsageInfo();
+    if (!memoryUsageInfo) {
+      return (
+        <Stack className="memoryTrackerContainer" horizontal>
+          <span>Memory</span>
+          <Spinner size={SpinnerSize.medium} />
+        </Stack>
+      );
+    }
+
+    const totalGB = memoryUsageInfo.totalKB / 1048576;
+    const usedGB = totalGB - memoryUsageInfo.freeKB / 1048576;

-  if (!data) {
    return (
      <Stack className="memoryTrackerContainer" horizontal>
        <span>Memory</span>
-        <Spinner size={SpinnerSize.medium} />
+        <ProgressIndicator
+          className={usedGB / totalGB > 0.8 ? "lowMemory" : ""}
+          description={usedGB.toFixed(1) + " of " + totalGB.toFixed(1) + " GB"}
+          percentComplete={usedGB / totalGB}
+        />
      </Stack>
    );
  }
-  const totalGB = data.totalKB / kbInGB;
-  const usedGB = totalGB - data.freeKB / kbInGB;
-  return (
-    <Stack className="memoryTrackerContainer" horizontal>
-      <span>Memory</span>
-      <ProgressIndicator
-        className={usedGB / totalGB > 0.8 ? "lowMemory" : ""}
-        description={usedGB.toFixed(1) + " of " + totalGB.toFixed(1) + " GB"}
-        percentComplete={usedGB / totalGB}
-      />
-    </Stack>
-  );
-};
+}
--- a/src/Explorer/Notebook/NotebookContainerClient.ts
+++ b/src/Explorer/Notebook/NotebookContainerClient.ts
@@ -2,13 +2,89 @@
 * Notebook container related stuff
 */
 import * as DataModels from "../../Contracts/DataModels";
+import * as Constants from "../../Common/Constants";
+import { ConsoleDataType } from "../Menus/NotificationConsole/NotificationConsoleComponent";
+import * as NotificationConsoleUtils from "../../Utils/NotificationConsoleUtils";
 import * as Logger from "../../Common/Logger";

 export class NotebookContainerClient {
  private reconnectingNotificationId: string;
  private isResettingWorkspace: boolean;

-  constructor(private notebookServerInfo: ko.Observable<DataModels.NotebookWorkspaceConnectionInfo>) {}
+  constructor(
+    private notebookServerInfo: ko.Observable<DataModels.NotebookWorkspaceConnectionInfo>,
+    private onConnectionLost: () => void,
+    private onMemoryUsageInfoUpdate: (update: DataModels.MemoryUsageInfo) => void
+  ) {
+    if (notebookServerInfo() && notebookServerInfo().notebookServerEndpoint) {
+      this.scheduleHeartbeat(Constants.Notebook.heartbeatDelayMs);
+    } else {
+      const subscription = notebookServerInfo.subscribe((newServerInfo: DataModels.NotebookWorkspaceConnectionInfo) => {
+        if (newServerInfo && newServerInfo.notebookServerEndpoint) {
+          this.scheduleHeartbeat(Constants.Notebook.heartbeatDelayMs);
+        }
+        subscription.dispose();
+      });
+    }
+  }
+
+  /**
+   * Heartbeat: each ping schedules another ping
+   */
+  private scheduleHeartbeat(delayMs: number): void {
+    setTimeout(() => {
+      this.getMemoryUsage()
+        .then(memoryUsageInfo => this.onMemoryUsageInfoUpdate(memoryUsageInfo))
+        .finally(() => this.scheduleHeartbeat(Constants.Notebook.heartbeatDelayMs));
+    }, delayMs);
+  }
+
+  private async getMemoryUsage(): Promise<DataModels.MemoryUsageInfo> {
+    if (!this.notebookServerInfo() || !this.notebookServerInfo().notebookServerEndpoint) {
+      const error = "No server endpoint detected";
+      Logger.logError(error, "NotebookContainerClient/getMemoryUsage");
+      return Promise.reject(error);
+    }
+
+    if (this.isResettingWorkspace) {
+      return undefined;
+    }
+
+    const { notebookServerEndpoint, authToken } = this.getNotebookServerConfig();
+    try {
+      const response = await fetch(`${notebookServerEndpoint}/api/metrics/memory`, {
+        method: "GET",
+        headers: {
+          Authorization: authToken,
+          "content-type": "application/json"
+        }
+      });
+      if (response.ok) {
+        if (this.reconnectingNotificationId) {
+          NotificationConsoleUtils.clearInProgressMessageWithId(this.reconnectingNotificationId);
+          this.reconnectingNotificationId = "";
+        }
+        const memoryUsageInfo = await response.json();
+        if (memoryUsageInfo) {
+          return {
+            totalKB: memoryUsageInfo.total,
+            freeKB: memoryUsageInfo.free
+          };
+        }
+      }
+      return undefined;
+    } catch (error) {
+      Logger.logError(error, "NotebookContainerClient/getMemoryUsage");
+      if (!this.reconnectingNotificationId) {
+        this.reconnectingNotificationId = NotificationConsoleUtils.logConsoleMessage(
+          ConsoleDataType.InProgress,
+          "Connection lost with Notebook server. Attempting to reconnect..."
+        );
+      }
+      this.onConnectionLost();
+      return undefined;
+    }
+  }

  public async resetWorkspace(): Promise<void> {
    this.isResettingWorkspace = true;
--- a/src/Explorer/Notebook/NotebookManager.ts
+++ b/src/Explorer/Notebook/NotebookManager.ts
@@ -16,6 +16,7 @@ import { NotebookContentProvider } from "./NotebookComponent/NotebookContentProv
 import { GitHubContentProvider } from "../../GitHub/GitHubContentProvider";
 import { contents } from "rx-jupyter";
 import { NotebookContainerClient } from "./NotebookContainerClient";
+import { MemoryUsageInfo } from "../../Contracts/DataModels";
 import { NotebookContentClient } from "./NotebookContentClient";
 import { DialogProps } from "../Controls/DialogReactComponent/DialogComponent";
 import { ResourceTreeAdapter } from "../Tree/ResourceTreeAdapter";
@@ -75,7 +76,11 @@ export default class NotebookManager {
      contents.JupyterContentProvider
    );

-    this.notebookClient = new NotebookContainerClient(this.params.container.notebookServerInfo);
+    this.notebookClient = new NotebookContainerClient(
+      this.params.container.notebookServerInfo,
+      () => this.params.container.initNotebooks(this.params.container.databaseAccount()),
+      (update: MemoryUsageInfo) => this.params.container.memoryUsageInfo(update)
+    );

    this.notebookContentClient = new NotebookContentClient(
      this.params.container.notebookServerInfo,
--- a/src/Explorer/Tabs/QueryTabV2.html
+++ b/src/Explorer/Tabs/QueryTabV2.html
@@ -0,0 +1 @@
+<div style="height: 100%" data-bind="react:queryComponentAdapter"></div>
--- a/src/Explorer/Tabs/QueryTabV2.tsx
+++ b/src/Explorer/Tabs/QueryTabV2.tsx
@@ -0,0 +1,17 @@
+import * as ViewModels from "../../Contracts/ViewModels";
+import TabsBase from "./TabsBase";
+import { QueryComponentAdapter } from "../Controls/Query/QueryComponentAdapter"
+import { QueryComponentProps } from "../Controls/Query/QueryComponent";
+
+export default class QueryTabV2 extends TabsBase {
+  public queryComponentAdapter: QueryComponentAdapter;
+
+  constructor(options: ViewModels.QueryTabOptions) {
+    super(options);
+    
+    const props: QueryComponentProps = {
+      queryTab: this
+    };
+    this.queryComponentAdapter = new QueryComponentAdapter(props);
+  }
+}
--- a/src/Explorer/Tabs/TabComponents.ts
+++ b/src/Explorer/Tabs/TabComponents.ts
@@ -17,6 +17,7 @@ import UserDefinedFunctionTabTemplate from "./UserDefinedFunctionTab.html";
 import GalleryTabTemplate from "./GalleryTab.html";
 import NotebookViewerTabTemplate from "./NotebookViewerTab.html";
 import TabsManagerTemplate from "./TabsManager.html";
+import QueryTabV2Template from "./QueryTabV2.html";

 export class TabComponent {
  constructor(data: any) {
@@ -123,6 +124,15 @@ export class QueryTab {
  }
 }

+export class QueryTabV2 {
+  constructor() {
+    return {
+      viewModel: TabComponent,
+      template: QueryTabV2Template
+    };
+  }
+}
+
 export class QueryTablesTab {
  constructor() {
    return {
--- a/src/Explorer/Tabs/TabsManager.html
+++ b/src/Explorer/Tabs/TabsManager.html
@@ -141,6 +141,11 @@
      <!-- ko if: $data.tabKind === 18 -->
      <notebook-viewer-tab params="{data: $data}"></notebook-viewer-tab>
      <!-- /ko -->
+
+      <!-- ko if: $data.tabKind === 19 -->
+      <query-tab-v2 params="{data: $data}"></query-tab-v2>
+      <!-- /ko -->
+      
    </div>
    <!-- /ko -->
  </div>
--- a/src/Explorer/Tree/Collection.ts
+++ b/src/Explorer/Tree/Collection.ts
@@ -42,6 +42,8 @@ import {
  readOffers
 } from "../../Common/DocumentClientUtilityBase";
 import { userContext } from "../../UserContext";
+import TabsBase from "../Tabs/TabsBase";
+import QueryTabV2 from "../Tabs/QueryTabV2";

 export default class Collection implements ViewModels.Collection {
  public nodeKind: string;
@@ -729,8 +731,9 @@ export default class Collection implements ViewModels.Collection {
  }

  public onNewQueryClick(source: any, event: MouseEvent, queryText?: string) {
+    const queryTabType = this.container.isQueryTabV2Enabled ? ViewModels.CollectionTabKind.QueryV2 : ViewModels.CollectionTabKind.Query 
    const collection: ViewModels.Collection = source.collection || source;
-    const id = this.container.tabsManager.getTabs(ViewModels.CollectionTabKind.Query).length + 1;
+    const id = this.container.tabsManager.getTabs(queryTabType).length + 1;
    const title = "Query " + id;
    const startKey: number = TelemetryProcessor.traceStart(Action.Tab, {
      databaseAccountName: this.container.databaseAccount().name,
@@ -741,8 +744,8 @@ export default class Collection implements ViewModels.Collection {
      tabTitle: title
    });

-    const queryTab: QueryTab = new QueryTab({
-      tabKind: ViewModels.CollectionTabKind.Query,
+    const queryTabProps : ViewModels.QueryTabOptions = {
+      tabKind: queryTabType,
      title: title,
      tabPath: "",
      collection: this,
@@ -754,7 +757,9 @@ export default class Collection implements ViewModels.Collection {
      partitionKey: collection.partitionKey,
      onLoadStartKey: startKey,
      onUpdateTabsButtons: this.container.onUpdateTabsButtons
-    });
+    }
+
+    const queryTab = this.container.isQueryTabV2Enabled ? new QueryTab(queryTabProps) : new QueryTabV2(queryTabProps)

    this.container.tabsManager.activateNewTab(queryTab);
  }
--- a/src/Utils/arm/generatedClients/2020-04-01-notebook/notebookWorkspaces.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-notebook/notebookWorkspaces.ts
@@ -1,87 +0,0 @@
-/* 
-  AUTOGENERATED FILE
-  Do not manually edit
-  Run "npm run generateARMClients" to regenerate
-*/
-
-import { armRequest } from "../../request";
-import * as Types from "./types";
-import { configContext } from "../../../../ConfigContext";
-const apiVersion = "2020-04-01";
-
-/* Gets the notebook workspace resources of an existing Cosmos DB account. */
-export async function listByDatabaseAccount(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string
-): Promise<Types.NotebookWorkspaceListResult> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "GET", apiVersion });
-}
-
-/* Gets the notebook workspace for a Cosmos DB account. */
-export async function get(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string
-): Promise<Types.NotebookWorkspace> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "GET", apiVersion });
-}
-
-/* Creates the notebook workspace for a Cosmos DB account. */
-export async function createOrUpdate(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string,
-  body: Types.NotebookWorkspaceCreateUpdateParameters
-): Promise<Types.NotebookWorkspace> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "PUT", apiVersion, body });
-}
-
-/* Deletes the notebook workspace for a Cosmos DB account. */
-export async function destroy(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string
-): Promise<void> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "DELETE", apiVersion });
-}
-
-/* Retrieves the connection info for the notebook workspace */
-export async function listConnectionInfo(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string
-): Promise<Types.NotebookWorkspaceConnectionInfoResult> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}/listConnectionInfo`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "POST", apiVersion });
-}
-
-/* Regenerates the auth token for the notebook workspace */
-export async function regenerateAuthToken(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string
-): Promise<void> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}/regenerateAuthToken`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "POST", apiVersion });
-}
-
-/* Starts the notebook workspace */
-export async function start(
-  subscriptionId: string,
-  resourceGroupName: string,
-  accountName: string,
-  notebookWorkspaceName: string
-): Promise<void> {
-  const path = `/subscriptions/${subscriptionId}/resourceGroups/${resourceGroupName}/providers/Microsoft.DocumentDB/databaseAccounts/${accountName}/notebookWorkspaces/${notebookWorkspaceName}/start`;
-  return armRequest({ host: configContext.ARM_ENDPOINT, path, method: "POST", apiVersion });
-}
--- a/src/Utils/arm/generatedClients/2020-04-01-notebook/types.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-notebook/types.ts
@@ -1,36 +0,0 @@
-/* 
-  AUTOGENERATED FILE
-  Do not manually edit
-  Run "npm run generateARMClients" to regenerate
-*/
-
-/* Parameters to create a notebook workspace resource */
-export type NotebookWorkspaceCreateUpdateParameters = unknown;
-
-/* A list of notebook workspace resources */
-export interface NotebookWorkspaceListResult {
-  /* Array of notebook workspace resources */
-  value?: NotebookWorkspace[];
-}
-
-/* A notebook workspace resource */
-export type NotebookWorkspace = unknown & {
-  /* Resource properties. */
-  properties?: NotebookWorkspaceProperties;
-};
-
-/* Properties of a notebook workspace resource. */
-export interface NotebookWorkspaceProperties {
-  /* Specifies the endpoint of Notebook server. */
-  readonly notebookServerEndpoint?: string;
-  /* Status of the notebook workspace. Possible values are: Creating, Online, Deleting, Failed, Updating. */
-  readonly status?: string;
-}
-
-/* The connection info for the given notebook workspace */
-export interface NotebookWorkspaceConnectionInfoResult {
-  /* Specifies auth token used for connecting to Notebook server (uses token-based auth). */
-  readonly authToken?: string;
-  /* Specifies the endpoint of Notebook server. */
-  readonly notebookServerEndpoint?: string;
-}
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/cassandraResources.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collection.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collection.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionPartition.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionPartition.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionPartitionRegion.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionPartitionRegion.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionRegion.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/collectionRegion.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/database.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/database.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/databaseAccountRegion.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/databaseAccountRegion.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/databaseAccounts.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/databaseAccounts.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/gremlinResources.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/mongoDBResources.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/operations.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/operations.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/partitionKeyRangeId.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/partitionKeyRangeId.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/partitionKeyRangeIdRegion.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/partitionKeyRangeIdRegion.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentile.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentile.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentileSourceTarget.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentileSourceTarget.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentileTarget.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/percentileTarget.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/sqlResources.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/tableResources.ts
--- a/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/types.ts
+++ b/src/Utils/arm/generatedClients/2020-04-01-cosmos-db/types.ts
--- a/src/Utils/arm/request.ts
+++ b/src/Utils/arm/request.ts
@@ -6,7 +6,7 @@ Instead, generate ARM clients that consume this function with stricter typing.
 */

 import promiseRetry, { AbortError } from "p-retry";
-import { ErrorResponse } from "./generatedClients/2020-04-01-cosmos-db/types";
+import { ErrorResponse } from "./generatedClients/2020-04-01/types";
 import { userContext } from "../../UserContext";

 interface ARMError extends Error {
--- a/test/container.spec.ts
+++ b/test/container.spec.ts
@@ -0,0 +1,106 @@
+import "expect-puppeteer";
+import crypto from 'crypto'
+
+jest.setTimeout(300000);
+
+describe('Collection Add and Delete SQL spec', () => {
+  it('creates a collection', async () => {
+    try {
+      const dbId = `TestDatabase${crypto.randomBytes(8).toString("hex")}`;
+      const collectionId = `TestCollection${crypto.randomBytes(8).toString("hex")}`;
+      const sharedKey = `SharedKey${crypto.randomBytes(8).toString("hex")}`;
+      const prodUrl = "https://localhost:1234/hostedExplorer.html";
+      page.goto(prodUrl);
+
+      // log in with connection string
+      const handle = await page.waitForSelector('iframe');
+      const frame = await handle.contentFrame();
+      await frame.waitFor('div > p.switchConnectTypeText', { visible: true });
+      await frame.click('div > p.switchConnectTypeText');
+      const connStr = process.env.PORTAL_RUNNER_CONNECTION_STRING;
+      await frame.type("input[class='inputToken']", connStr);
+      await frame.click("input[value='Connect']");
+
+      // create new collection
+      await frame.waitFor('button[data-test="New Container"]', { visible: true });
+      await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true });
+      await frame.click('button[data-test="New Container"]');
+      
+      // check new database
+      await frame.waitFor('input[data-test="addCollection-createNewDatabase"]');
+      await frame.click('input[data-test="addCollection-createNewDatabase"]');
+
+      // check shared throughput
+      await frame.waitFor('input[data-test="addCollectionPane-databaseSharedThroughput"]');
+      await frame.click('input[data-test="addCollectionPane-databaseSharedThroughput"]')   ;   
+
+      // type database id
+      await frame.waitFor('input[data-test="addCollection-newDatabaseId"]');
+      await frame.type('input[data-test="addCollection-newDatabaseId"]', dbId);      
+
+      // type collection id
+      await frame.waitFor('input[data-test="addCollection-collectionId"]');
+      await frame.type('input[data-test="addCollection-collectionId"]', collectionId); 
+
+      // type partition key value
+      await frame.waitFor('input[data-test="addCollection-partitionKeyValue"]');
+      await frame.type('input[data-test="addCollection-partitionKeyValue"]', sharedKey);
+
+      // click submit
+      await frame.waitFor('#submitBtnAddCollection');
+      await frame.click('#submitBtnAddCollection');
+
+      // validate created
+      // open database menu
+      await frame.waitFor(`span[title="${dbId}"]`);
+      await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true });
+
+      await frame.click(`div[data-test="${dbId}"]`);
+      await frame.waitFor(`span[title="${collectionId}"]`);
+      
+      // delete container
+
+      // click context menu for container
+      await frame.waitFor(`div[data-test="${collectionId}"] > div > button`);
+      await frame.click(`div[data-test="${collectionId}"] > div > button`);
+
+      // click delete container
+      await frame.waitForSelector('body > div.ms-Layer.ms-Layer--fixed');
+      await frame.waitFor(1000);
+      const elements = await frame.$$('span[class="treeComponentMenuItemLabel"]')
+      await elements[4].click();
+
+      // confirm delete container
+      await frame.type('input[data-test="confirmCollectionId"]', collectionId.trim());
+
+      // click delete
+      await frame.click('input[data-test="deleteCollection"]');
+      await frame.waitFor(5000);
+      await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true });
+
+      await expect(page).not.toMatchElement(`div[data-test="${collectionId}"]`);
+
+      // click context menu for database
+      await frame.waitFor(`div[data-test="${dbId}"] > div > button`);
+      const button = await frame.$(`div[data-test="${dbId}"] > div > button`);
+      await button.focus();
+      await button.asElement().click();
+
+      // click delete database
+      await frame.waitFor(1000);
+      const dbElements = await frame.$$('span[class="treeComponentMenuItemLabel"]')
+      await dbElements[1].click();
+
+      // confirm delete database
+      await frame.type('input[data-test="confirmDatabaseId"]', dbId.trim());
+
+      // click delete
+      await frame.click('input[data-test="deleteDatabase"]');
+      await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true });
+      await expect(page).not.toMatchElement(`div[data-test="${dbId}"]`);
+    } catch (error) {
+      await page.screenshot({path: 'failure.png'});
+      throw error;
+    } 
+  }) 
+})
--- a/test/index.spec.ts
+++ b/test/index.spec.ts
@@ -3,7 +3,7 @@ import { trackEvent, trackException } from "./utils";

 jest.setTimeout(300000);

-describe("Collection CRUD", () => {
+describe.skip("Collection CRUD", () => {
  it("should complete collection crud", async () => {
    try {
      // Login to Azure Portal
--- a/tsconfig.strict.json
+++ b/tsconfig.strict.json
@@ -68,7 +68,7 @@
    "./src/Utils/MessageValidation.ts",
    "./src/Utils/OfferUtils.ts",
    "./src/Utils/StringUtils.ts",
-    "./src/Utils/arm/generatedClients/2020-04-01-cosmos-db/types.ts",
+    "./src/Utils/arm/generatedClients/2020-04-01/types.ts",
    "./src/quickstart.ts",
    "./src/setupTests.ts",
    "./src/workers/upload/definitions.ts"
--- a/utils/armClientGenerator/generator.ts
+++ b/utils/armClientGenerator/generator.ts
@@ -14,14 +14,12 @@ But it does work well enough to generate a fully typed tree-shakeable client for
 Results of this file should be checked into the repo.
 */

-const rpname = "notebook"; // Can also use "notebooks"
-
 // Array of strings to use for eventual output
 const outputTypes: string[] = [""];
 const version = "2020-04-01";
-const schemaURL = `https://raw.githubusercontent.com/Azure/azure-rest-api-specs/master/specification/cosmos-db/resource-manager/Microsoft.DocumentDB/stable/${version}/${rpname}.json`;
+const schemaURL = `https://raw.githubusercontent.com/Azure/azure-rest-api-specs/master/specification/cosmos-db/resource-manager/Microsoft.DocumentDB/stable/${version}/cosmos-db.json`;

-const outputDir = path.join(__dirname, `../../src/Utils/arm/generatedClients/${version}-${rpname}`);
+const outputDir = path.join(__dirname, `../../src/Utils/arm/generatedClients/${version}`);
 mkdirp.sync(outputDir);

 // Buckets for grouping operations based on their name
@@ -79,16 +77,12 @@ function responseType(operation: Operation, namespace: string) {
  if (operation.responses) {
    return Object.keys(operation.responses)
      .map((responseCode: string) => {
-        // "default" always seems to be an ErrorResponse which we do not want to include in the possible return type
-        if (responseCode === "default") {
-          return undefined;
-        }
        if (!operation.responses[responseCode].schema) {
          return "void";
        }
        return refToType(operation.responses[responseCode].schema.$ref, namespace);
      })
-      .filter((value, index, array) => value && array.indexOf(value) === index) // Ensure all values are truthy and unique
+      .filter((value, index, array) => array.indexOf(value) === index)
      .join(" | ");
  }
  return "unknown";
				`@@ -0,0 +1 @@`
				`<div style="height: 100%" data-bind="react:queryComponentAdapter"></div>`