Fixed autofill for HTTPS.

Added dummy API endpoint for autofill POST requests.

Autofill also reads the CSRF token from cookies and doesn't require an 'about:blank' anymore on the forms.

bower.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "dependencies": {
     "angular": "1.3.9-build.3748",
+    "angular-cookies": "1.3.9-build.3748",
     "angular-route": "1.3.9-build.3748",
     "angular-sanitize": "1.3.9-build.3748",
     "angular-animate": "1.3.9-build.3748",

lib/units/app/index.js

@@ -87,6 +87,15 @@ module.exports = function(options) {
   app.use(csrf())
   app.use(validator())
 
+  app.use(function(req, res, next) {
+    res.cookie('XSRF-TOKEN', req.csrfToken())
+    next()
+  })
+
+  app.all('/app/api/v1/dummy', function(req, res) {
+    res.send('')
+  })
+
   app.get('/', function(req, res) {
     res.render('index')
   })

res/app/components/stf/common-ui/enable-autofill/enable-autofill-directive.js

@@ -1,4 +1,4 @@
-module.exports = function enableAutofillDirective($rootElement) {
+module.exports = function enableAutofillDirective($rootElement, $cookies) {
   return {
     restrict: 'A',
     compile: function compile(tElement, tAttrs) {
@@ -24,11 +24,31 @@ module.exports = function enableAutofillDirective($rootElement) {
         tElement.attr('target', '_autofill')
       }
 
-      // Add attribute action to the current form
-      // NOTE: This doesn't work so it has to be added manually
-      // if (!tAttrs.action) {
-      //   tElement.attr('action', 'about:blank')
-      // }
+      // Add action attribute if not present
+      if (!tAttrs.action) {
+
+        // Use a dummy url because 'about:blank' trick doesn't work with HTTPS
+        // Also 'javascript: void(0)' doesn't work neither
+        var dummyUrl = '/app/api/v1/dummy'
+
+        // Adds the CSRF token to the url from cookies if present
+        var xsrfToken = $cookies['XSRF-TOKEN']
+        if (xsrfToken) {
+          // Note: At least for Express CSURF, it only works with url-set tokens
+          // it doesn't happen to work with hidden form input elements
+          dummyUrl += '?_csrf=' + xsrfToken
+        }
+
+        tElement.attr('action', dummyUrl)
+      }
+
+      return {
+        pre: function (scope, element, attrs) {
+          // Angular needs this so the form action doesn't get removed
+          // Also, trying to set a url at this time doesn't work neither
+          attrs.action = ''
+        }
+      }
     }
   }
 }

res/app/components/stf/common-ui/enable-autofill/index.js

@@ -1,4 +1,6 @@
-module.exports = angular.module('stf.enable-autofill', [
+require('angular-cookies')
 
+module.exports = angular.module('stf.enable-autofill', [
+  'ngCookies'
 ])
   .directive('enableAutofill', require('./enable-autofill-directive'))

res/app/control-panes/automation/store-account/store-account.jade

@@ -14,7 +14,7 @@
 
 
 
-      form(name='storeLogin', novalidate, enable-autofill, action='about:blank')
+      form(name='storeLogin', novalidate, enable-autofill)
         .form-group
           .input-group
             span.input-group-addon

res/app/control-panes/dashboard/navigation/navigation.jade

@@ -12,8 +12,7 @@
       //i.fa.fa-step-forward.pull-right(ng-click='forward()', title='{{"Go Forward"|translate}}')
       //i.fa.fa-step-backward.pull-right(ng-click='back()', title='{{"Go Back"|translate}}')
   .widget-content.padded
-    form(enable-autofill, action='about:blank', ng-submit='openUrl($event)')
-      //form(name='navigationForm', method='post', action='about:blank', target='_autofill')
+    form(enable-autofill, ng-submit='openUrl()')
       .input-group.url-input-container
         input.form-control(type='text', name='textURL', placeholder='http://...',
         autocomplete='url', ng-model='textURL', text-focus-select,

res/app/control-panes/dashboard/shell/shell.jade

@@ -8,11 +8,11 @@
       i.fa.fa-book
   .widget-content.padded
 
-    iframe(src="about:blank", name="_autofill2", style="display:none")
-    form(method="post", action="about:blank", target="_autofill2")
+    // TODO: find why autofill doesn't work here
+    form(method='post', enable-autofill, ng-submit='run(command)')
       .input-group.form-inline
-        input(type=text, ng-model='command', ng-enter='run(command)', text-focus-select,
-          //autocapitalize='off', spellcheck='false',
+        input(type=text, ng-model='command', Xtext-focus-select,
+          autocapitalize='off', spellcheck='false',
           tabindex='30', accesskey='S', autocomplete='on').form-control.shell-input
         span.input-group-btn
           // , tooltip='{{"Run Command"|translate}}'

webpack.config.js

@@ -57,6 +57,7 @@ module.exports = {
         { test: /\.jade$/, loader: 'template-html-loader' },
         { test: /\.html$/, loader: 'html-loader' },
         { test: /angular\.js$/, loader: 'exports?angular'},
+        { test: /angular-cookies\.js$/, loader: 'imports?angular=angular'},
         { test: /angular-route\.js$/, loader: 'imports?angular=angular'},
         { test: /angular-touch\.js$/, loader: 'imports?angular=angular'},
         { test: /angular-animate\.js$/, loader: 'imports?angular=angular'},