pat-forward: understand the trigger auto option

CHANGES.md

@@ -14,6 +14,7 @@ Features
 - Added support for a push subsystem using reethinkdb and horizon.
   That allows us to trigger an injection by sending a push_marker to all connected browsers.
   (This is still in an evaluation state)
+- pat-forward: understand the trigger auto option
 
 Fixes
 ~~~~~

src/pat/forward/documentation.md

@@ -10,8 +10,17 @@ This pattern can be used to redirect a click on an element to one or more other
       <submit id="submit">Submit</submit>
     </form>
 
+If the trigger parameter is set to `auto`, the click event will be triggered
+immediately after the page is loaded.
+
+    <a href="#" class="pat-forward" data-pat-forward="selector: #submit; trigger: auto">Autosubmit form</a>
+    <form>
+      <submit id="submit">Submit</submit>
+    </form>
+
 ### Option reference
 
 | Property | Description | Default | Allowed Values | Type |
 |------|------|-----|------|
-| selector | The element to which the click event should be forwarded. | | | CSS Selector |
+| `selector` | The element to which the click event should be forwarded. | | | CSS Selector |
+| `trigger` | When the forward action should be fired | `click` | `click|auto` | One of the mutually exclusive string values |

src/pat/forward/forward.js

@@ -11,20 +11,24 @@ define([
     var parser = new Parser("forward");
 
     parser.addArgument("selector");
+    parser.addArgument("trigger", "click", ["click", "auto"]);
 
     var _ = {
         name: "forward",
         trigger: ".pat-forward",
 
         init: function($el, opts) {
-            return $el.each(function() {
+            return $el.each(function () {
                 var $el = $(this),
-                    options = parser.parse($el, opts);
+                options = parser.parse($el, opts);
 
                 if (!options.selector)
-                    return;
+                return;
 
                 $el.on("click", null, options.selector, _._onClick);
+                if (options.trigger === "auto") {
+                    $el.trigger("click");
+                }
             });
         },
 
@@ -39,4 +43,3 @@ define([
 });
 
 // vim: sw=4 expandtab
-

src/pat/forward/index.html

@@ -13,10 +13,16 @@
                     <label>
                         <input id="checkbox" type="checkbox"/> I may be ticked through the button too!
                     </label>
-                </fieldset>
+                  </fieldset>
+                  <fieldset class="pat-checklist">
+                      <label>
+                          <input id="autocheckbox" type="checkbox"/> I am automatically ticked on page load!
+                      </label>
+                  </fieldset>
                 <fieldset class="pat-button-bar">
                     <button type="button" class="pat-button pat-forward" data-pat-forward="#checkbox">Click me…</button>
                 </fieldset>
+                <a class="pat-forward" data-pat-forward="#autocheckbox; trigger: auto;"></a>
             </fieldset>
         </form>
 	</body>

src/pat/forward/tests.js

@@ -0,0 +1,49 @@
+define(["pat-forward"], function(pattern) {
+
+    describe("pat-forward", function() {
+
+        beforeEach(function() {
+            $("<div/>", {id: "lab"}).appendTo(document.body);
+        });
+
+        afterEach(function() {
+            $("#lab").remove();
+        });
+
+        describe("Clicking on a button sends the click to another element", function() {
+            it("allows you to forward the click from an element to another one", function () {
+                var $lab = $("#lab");
+                $lab.append($(
+                    "<form>" +
+                    '    <input id="checkbox" type="checkbox" />' +
+                    '    <button class="pat-forward" data-pat-forward="#checkbox">Button</button>' +
+                    "</form>"
+                ));
+
+                pattern.init($(pattern.trigger));
+                expect($lab.find("#checkbox").is(":checked")).toBeFalsy();
+                $lab.find(".pat-forward").click();
+                expect($lab.find("#checkbox").is(":checked")).toBeTruthy();
+            });
+        });
+
+        describe("Setting the trigger auto option triggers the click on init", function() {
+            it("allows you to forward the click authomatically when the pattern is initialized", function () {
+                var $lab = $("#lab");
+                $lab.append($(
+                    "<form>" +
+                    '    <input id="checkbox" type="checkbox" />' +
+                    '    <button class="pat-forward" data-pat-forward="#checkbox; trigger: auto">Button</button>' +
+                    "</form>"
+                ));
+
+                pattern.init($(pattern.trigger));
+                expect($lab.find("#checkbox").is(":checked")).toBeTruthy();
+                $lab.find(".pat-forward").click();
+                expect($lab.find("#checkbox").is(":checked")).toBeFalsy();
+            });
+        });
+
+    });
+
+});