Added native auto-fill support for URL input in Chrome.

res/app/components/stf/common-ui/enable-autofill/README.md

@@ -0,0 +1,28 @@
+# enable-autofill
+
+This directive enables autofill (HTML5 autocomplete) on the selected form.
+
+Currently this is only needed in `Chrome` because `autofill` only works on form `POST` method.
+
+Based on [this](http://stackoverflow.com/questions/16445463/how-to-get-chrome-to-autofill-with-asynchronous-post/22191041#22191041).
+
+## Usage
+
+```html
+<form enable-autofill action="about:blank">
+	<input type="text" autocomplete="on">
+</form>  
+```
+
+This will create the following DOM:
+
+```html
+<iframe src="about:blank" name="_autofill" style="display:none">
+<form method="post" action="about:blank" target="_autofill">
+	<input type="text" autocomplete="on">
+</form>  
+```
+
+Yes, it is a bit ugly but it is currently the only way. 
+
+It will create only one `iframe` which will be reused.

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

@@ -0,0 +1,34 @@
+module.exports = function enableAutofillDirective($rootElement) {
+  return {
+    restrict: 'A',
+    compile: function compile(tElement, tAttrs) {
+
+      // Creates hidden iFrame for auto-fill forms if there isn't one already
+      if ($rootElement.find('iframe').attr('name') !== '_autofill') {
+        $rootElement.append(angular.element(
+          '<iframe src="about:blank" name="_autofill" style="display:none">'
+        ))
+      }
+
+      // Add attribute method POST to the current form
+      if (!tAttrs.method) {
+        tElement.attr('method', 'post')
+      } else {
+        if (!tAttrs.method.match(/post/i)) {
+          console.error('Auto-fill only works with form POST method')
+        }
+      }
+
+      // Add attribute target to the current form
+      if (!tAttrs.target) {
+        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')
+      // }
+    }
+  }
+}

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

@@ -0,0 +1,23 @@
+describe('enableAutofill', function () {
+
+  beforeEach(module('stf.enable-autofill'));
+
+  var scope, compile;
+
+  beforeEach(inject(function ($rootScope, $compile) {
+    scope = $rootScope.$new();
+    compile = $compile;
+  }));
+
+  it('should ...', function () {
+
+    /* 
+     To test your directive, you need to create some html that would use your directive,
+     send that through compile() then compare the results.
+
+     var element = compile('<div enable-autofill name="name">hi</div>')(scope);
+     expect(element.text()).toBe('hello, world');
+     */
+
+  });
+});

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

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

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

@@ -12,5 +12,6 @@ module.exports = angular.module('stf/common-ui', [
   require('./include-cached').name,
   require('./text-focus-select').name,
   require('./counter').name,
-  require('./badge-icon').name
+  require('./badge-icon').name,
+  require('./enable-autofill').name
 ])