Repository: auth0/auth0.js (js)

Issue:
winchanOptions missing parameters
I am using the auth0-lock library in an Angular 2 application.

I am using popup mode, but when logging in, the popup is blank and has the error "Uncaught Error: clientID is required." in the console for the popup. 

Digging into with the debugger it looks like the issue is in https://github.com/auth0/auth0.js/blob/c5550d042220cf0bc43087ae0aa09b7200c5b03a/src/helper/popup-handler.js#L69 where the winchanoptions does contain the clientID, put not inside a params member like the winchan docs days it should. 

Can you confirm if this is a general issue or something wrong with the combination of versions I use? 

package.json:
```
    "dependencies": {
    "@angular/common": "^2.3.1",
    "@angular/compiler": "^2.3.1",
    "@angular/core": "^2.3.1",
    "@angular/forms": "^2.3.1",
    "@angular/http": "^2.3.1",
    "@angular/platform-browser": "^2.3.1",
    "@angular/platform-browser-dynamic": "^2.3.1",
    "@angular/router": "^3.3.1",
    "@types/auth0-lock": "^10.9.2",
    "@types/highcharts": "^4.2.46",
    "ag-grid": "7.1.0",
    "ag-grid-ng2": "7.1.2",
    "angular2-color-picker": "git://github.com/zefoy/angular2-color-picker.git#npm-package",
    "angular2-datatable": "0.5.2",
    "angular2-google-maps": "0.17.0",
    "angular2-infinite-scroll": "0.2.8",
    "angular2-jwt": "^0.1.28",
    "angular2-text-mask": "2.1.0",
    "angular2-toaster": "2.0.0",
    "angular2-tree-component": "2.0.0",
    "auth0-js": "^8.3.0",
    "auth0-lock": "^10.12.2",
    "bootstrap": "3.3.7",
    "codemirror": "5.22.0",
    "core-js": "^2.4.1",
    "easy-pie-chart": "2.1.7",
    "font-awesome": "4.7.0",
    "fullcalendar": "3.1.0",
    "highcharts": "^5.0.7",
    "jqcloud2": "2.0.2",
    "jquery": "3.1.1",
    "jquery-slimscroll": "1.3.8",
    "jquery-sparkline": "2.4.0",
    "jquery.browser": "0.1.0",
    "jquery.flot.tooltip": "github:krzysu/flot.tooltip",
    "lodash": "4.17.4",
    "modernizr": "3.3.1",
    "moment": "2.17.1",
    "ng2-bootstrap": "1.1.16-11",
    "ng2-charts": "1.4.4",
    "ng2-dnd": "2.1.1",
    "ng2-file-upload": "1.1.4-2",
    "ng2-img-cropper": "0.7.7",
    "ng2-select": "1.1.2",
    "ng2-table": "1.3.2",
    "ng2-tag-input": "0.7.0",
    "ng2-translate": "5.0.0",
    "ng2-validation": "3.1.3",
    "node-sass": "3.13.0",
    "rxjs": "^5.0.1",
    "screenfull": "3.0.2",
    "simple-line-icons": "2.4.1",
    "spinkit": "1.2.5",
    "summernote": "0.8.2",
    "ts-helpers": "^1.1.1",
    "weather-icons": "github:erikflowers/weather-icons",
    "whirl": "github:jh3y/whirl",
    "winchan": "^0.2.0",
    "zone.js": "^0.7.2"
  },
  "devDependencies": {
    "@angular/cli": "1.0.0-beta.30",
    "@angular/compiler-cli": "^2.3.1",
    "@types/codemirror": "0.0.37",
    "@types/jasmine": "2.5.38",
    "@types/lodash": "4.14.48",
    "@types/moment": "2.13.0",
    "@types/node": "^6.0.42",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-read-json": "1.1.0",
    "karma-remap-istanbul": "^0.2.1",
    "loaders.css": "0.1.2",
    "napa": "2.3.0",
    "protractor": "~4.0.13",
    "ts-node": "1.2.1",
    "tslint": "^4.3.0",
    "typescript": "~2.0.3",
    "webdriver-manager": "10.2.5"
  }
```


Pull request:
Pass to popup the needed params for auth
Closes #378 

Patch:
diff --git a/src/web-auth/popup.js b/src/web-auth/popup.js
index 93e875a..f25345b 100644
--- a/src/web-auth/popup.js
+++ b/src/web-auth/popup.js
@@ -188,13 +188,14 @@ Popup.prototype.loginWithCredentials = function (options, cb) {
 
   params = objectHelper.pick(options, ['clientID', 'domain']);
   params.options = objectHelper.toSnakeCase(
-    objectHelper.blacklist(options, ['clientID', 'domain'])
+    objectHelper.pick(options, ['password', 'connection', 'state', 'scope', '_csrf', 'device'])
   );
+  params.options.username = options.username || options.email;
 
   url = urljoin(this.baseOptions.rootUrl, 'sso_dbconnection_popup', options.clientID);
   relayUrl = urljoin(this.baseOptions.rootUrl, 'relay.html');
 
-  return popup.load(url, relayUrl, params, responseHandler(cb));
+  return popup.load(url, relayUrl, { params: params }, responseHandler(cb));
 };
 
 /**


Test patch:
diff --git a/test/web-auth/popup.test.js b/test/web-auth/popup.test.js
index d887a80..7f43e47 100644
--- a/test/web-auth/popup.test.js
+++ b/test/web-auth/popup.test.js
@@ -136,15 +136,17 @@ describe('auth0.WebAuth.popup', function () {
       stub(PopupHandler.prototype, 'load', function(url, relayUrl, options, cb) {
         expect(url).to.be('https://me.auth0.com/sso_dbconnection_popup/...');
         expect(relayUrl).to.be('https://me.auth0.com/relay.html');
-        expect(options).to.eql({ clientID: '...',
-          domain: 'me.auth0.com',
-          options:{
-            connection: 'the_connection',
-            nonce: '123',
-            state: '456',
-            username: 'theUsername',
-            password: 'thepassword',
-            scope: 'openid'
+        expect(options).to.eql({
+          params: {
+            clientID: '...',
+            domain: 'me.auth0.com',
+            options:{
+              connection: 'the_connection',
+              state: '456',
+              username: 'theUsername',
+              password: 'thepassword',
+              scope: 'openid'
+            }
           }
         });
 
@@ -156,7 +158,6 @@ describe('auth0.WebAuth.popup', function () {
 
       this.auth0.popup.loginWithCredentials({
         connection: 'the_connection',
-        nonce: '123',
         state: '456',
         username: 'theUsername',
         password: 'thepassword',
@@ -385,13 +386,16 @@ describe('auth0.WebAuth.popup', function () {
       stub(PopupHandler.prototype, 'load', function(url, relayUrl, options, cb) {
         expect(url).to.be('https://me.auth0.com/sso_dbconnection_popup/...');
         expect(relayUrl).to.be('https://me.auth0.com/relay.html');
-        expect(options).to.eql({ clientID: '...',
-          domain: 'me.auth0.com',
-          options:{
-            connection: 'the_connection',
-            email: 'me@example.com',
-            password: '123456',
-            scope: 'openid'
+        expect(options).to.eql({
+          params: {
+            clientID: '...',
+            domain: 'me.auth0.com',
+            options:{
+              connection: 'the_connection',
+              username: 'me@example.com',
+              password: '123456',
+              scope: 'openid'
+            }
           }
         });