fix(DropdownToggle): ensures color attribute is not leaked

* fix(DropdownToggle): Fixes #461 (reverting bad PR#402) which ensures
color attribute is NOT leaked

* fix(DropdownToggle): Adding tests for color attribute and fixing logic
to ensure that the color attribute is used for Buttons only.

Author: virgofx

src/DropdownToggle.js

@@ -55,7 +55,7 @@ class DropdownToggle extends React.Component {
   }
 
   render() {
-    const { className, cssModule, caret, split, nav, tag, ...props } = this.props;
+    const { className, color, cssModule, caret, split, nav, tag, ...props } = this.props;
     const ariaLabel = props['aria-label'] || 'Toggle Dropdown';
     const classes = mapToCssModules(classNames(
       className,
@@ -75,6 +75,7 @@ class DropdownToggle extends React.Component {
       props.href = '#';
     } else if (!tag) {
       Tag = Button;
+      props.color = color;
     } else {
       Tag = tag;
     }

src/__tests__/DropdownToggle.spec.js

@@ -85,6 +85,68 @@ describe('DropdownToggle', () => {
     expect(wrapper.find('[data-toggle="dropdown"]').hasClass('dropdown-toggle')).toBe(true);
   });
 
+  describe('color', () => {
+    it('should render the dropdown as a BUTTON element with default color secondary', () => {
+      const wrapper = mount(
+        <DropdownToggle />,
+        {
+          context: {
+            isOpen: isOpen,
+            toggle: toggle
+          }
+        }
+      );
+
+      expect(wrapper.find('button').length).toBe(1);
+      expect(wrapper.find('button').hasClass('btn-secondary')).toBe(true);
+    });
+
+    it('should render the dropdown as a BUTTON element with explicit color success', () => {
+      const wrapper = mount(
+        <DropdownToggle color="success" />,
+        {
+          context: {
+            isOpen: isOpen,
+            toggle: toggle
+          }
+        }
+      );
+
+      expect(wrapper.find('button').length).toBe(1);
+      expect(wrapper.find('button').hasClass('btn-success')).toBe(true);
+    });
+
+    it('should render the dropdown as an A element with no color attribute', () => {
+      const wrapper = mount(
+        <DropdownToggle tag="a" />,
+        {
+          context: {
+            isOpen: isOpen,
+            toggle: toggle
+          }
+        }
+      );
+
+      expect(wrapper.find('a').length).toBe(1);
+      expect(wrapper.find('a[color]').length).toBe(0);
+    });
+
+    it('should render the dropdown as a DIV element with no color attribute', () => {
+      const wrapper = mount(
+        <DropdownToggle tag="div" color="success" />,
+        {
+          context: {
+            isOpen: isOpen,
+            toggle: toggle
+          }
+        }
+      );
+
+      expect(wrapper.find('div').length).toBe(1);
+      expect(wrapper.find('div[color]').length).toBe(0);
+    });
+  });
+
   it('should render a split', () => {
     const wrapper = mount(
       <DropdownToggle split>Ello world</DropdownToggle>,