fix(DropdownToggle): support non Button styles (#221)

* fix(DropdownToggle): always use Button; passing tag if provided * fix(DropdownToggle): support non Button styles
reactstrap · Nov 13, 2016 · cd3c1ce · cd3c1ce
1 parent ca9e28e
commit cd3c1ce
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 5 deletions.
diff --git a/src/DropdownToggle.js b/src/DropdownToggle.js
@@ -21,7 +21,6 @@ const defaultProps = {
   'data-toggle': 'dropdown',
   'aria-haspopup': true,
   color: 'secondary',
-  tag: Button
 };
 
 const contextTypes = {
@@ -42,7 +41,7 @@ class DropdownToggle extends React.Component {
       return;
     }
 
-    if (this.props.nav) {
+    if (this.props.nav && !this.props.tag) {
       e.preventDefault();
     }
 
@@ -54,7 +53,7 @@ class DropdownToggle extends React.Component {
   }
 
   render() {
-    const { className, cssModule, caret, split, nav, tag: Tag, ...props } = this.props;
+    const { className, cssModule, caret, split, nav, tag, ...props } = this.props;
     const ariaLabel = props['aria-label'] || 'Toggle Dropdown';
     const classes = mapToCssModules(classNames(
       className,
@@ -67,9 +66,15 @@ class DropdownToggle extends React.Component {
     ), cssModule);
     const children = props.children || <span className="sr-only">{ariaLabel}</span>;
 
-    if (nav) {
-      props.tag = 'a';
+    let Tag;
+
+    if (nav && !tag) {
+      Tag = 'a';
       props.href = '#';
+    } else if (!tag) {
+      Tag = Button;
+    } else {
+      Tag = tag;
     }
 
     return (

diff --git a/src/__tests__/DropdownToggle.spec.js b/src/__tests__/DropdownToggle.spec.js
@@ -170,6 +170,20 @@ describe('DropdownToggle', () => {
       expect(wrapper.find('.nav-link').length).toBe(1);
     });
 
+    it('should not set the tag prop when the tag is defined', () => {
+      const wrapper = mount(
+        <DropdownToggle nav tag="span">Ello world</DropdownToggle>,
+        {
+          context: {
+            isOpen: isOpen,
+            toggle: toggle
+          }
+        }
+      );
+
+      expect(wrapper.find('[aria-haspopup="true"]').prop('tag')).toBe(undefined);
+    });
+
     it('should preventDefault', () => {
       const e = { preventDefault: jasmine.createSpy('preventDefault') };
       const wrapper = mount(