feat(Button): render anchor tag if href prop exists

eddywashere · eddywashere · commit 61f4a11a08a6 · 2016-03-26T16:25:53.000-07:00
diff --git a/lib/Button.jsx b/lib/Button.jsx
@@ -43,6 +43,7 @@ class Button extends React.Component {
       size,
       ...attributes
     } = this.props;
+    let Tag = 'button';
 
     const classes = classNames(
       className,
@@ -54,21 +55,17 @@ class Button extends React.Component {
     );
 
     if (El) {
-      return (
-        <El {...attributes}
-          className={classes}
-          onClick={this.onClick}>
-          {children}
-        </El>
-      );
+      Tag = El;
+    } else if (attributes.href) {
+      Tag = 'a';
     }
 
     return (
-      <button {...attributes}
+      <Tag {...attributes}
         className={classes}
         onClick={this.onClick}>
         {children}
-      </button>
+      </Tag>
     );
   }
 }
diff --git a/test/Button.spec.js b/test/Button.spec.js
@@ -18,6 +18,13 @@ describe('Button', () => {
     expect(wrapper.text()).toBe('Home');
   });
 
+  it('should render an anchor element if href exists', () => {
+    const wrapper = mount(<Button href="/home">Home</Button>);
+
+    expect(wrapper.find('a').length).toBe(1);
+    expect(wrapper.text()).toBe('Home');
+  });
+
   it('should render buttons with default color', () => {
     const wrapper = shallow(<Button>Default Button</Button>);
 
