From 89fc9bb2b9584db11377dcc20d9c927cfbeca313 Mon Sep 17 00:00:00 2001
From: ClementParis016 <clementparis016@gmail.com>
Date: Tue, 10 May 2016 18:56:50 +0200
Subject: [PATCH] Add optional 'target' attribute for <button>

---
 lib/componentFactory.js |  8 +++++++-
 test/components.js      | 23 +++++++++++++++++++++--
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/lib/componentFactory.js b/lib/componentFactory.js
index 2f5c832..c7acf33 100644
--- a/lib/componentFactory.js
+++ b/lib/componentFactory.js
@@ -27,9 +27,15 @@ module.exports = function(element) {
     case this.components.button:
       var expander = '';
 
+      // Prepare optional target attribute for the <a> element
+      var target = '';
+      if (element.attr('target')) {
+        target = ' target=' + element.attr('target');
+      }
+
       // If we have the href attribute we can create an anchor for the inner of the button;
       if (element.attr('href')) {
-        inner = format('<a href="%s">%s</a>', element.attr('href'), inner);
+        inner = format('<a href="%s"%s>%s</a>', element.attr('href'), target, inner);
       }
 
       // If the button is expanded, it needs a <center> tag around the content
diff --git a/test/components.js b/test/components.js
index 1e3af90..fd55afb 100644
--- a/test/components.js
+++ b/test/components.js
@@ -85,6 +85,25 @@ describe('Button', () => {
     compare(input, expected);
   });
 
+  it('creates a button with target="_blank"', () => {
+    var input = '<button href="http://zurb.com" target="_blank">Button</button>';
+    var expected = `
+      <table class="button">
+        <tr>
+          <td>
+            <table>
+              <tr>
+                <td><a href="http://zurb.com" target="_blank">Button</a></td>
+              </tr>
+            </table>
+          </td>
+        </tr>
+      </table>
+    `;
+
+    compare(input, expected);
+  });
+
   it('creates a button with classes', () => {
     var input = `
       <button class="small alert" href="http://zurb.com">Button</button>
@@ -229,7 +248,7 @@ describe('Callout', () => {
     compare(input, expected);
   });
 });
-  
+
 describe('Spacer', () => {
   it('creates a spacer element with correct size', () => {
     var input = '<spacer size="10"></spacer>';
@@ -245,7 +264,7 @@ describe('Spacer', () => {
 
     compare(input, expected);
   });
-  
+
   it('copies classes to the final spacer HTML', () => {
     var input = '<spacer size="10" class="bgcolor"></spacer>';
     var expected = `