fix(Modal): add back attribute passthrough (#444)

TheSharpieOne · eddywashere · commit b598a4075e08 · 2017-06-27T08:48:54.000-07:00
fixes #443
diff --git a/src/Modal.js b/src/Modal.js
@@ -9,6 +9,7 @@ import {
   conditionallyUpdateScrollbar,
   setScrollbarWidth,
   mapToCssModules,
+  omit
 } from './utils';
 
 const propTypes = {
@@ -45,6 +46,8 @@ const propTypes = {
   modalTransitionLeaveTimeout: PropTypes.number,
 };
 
+const propsToOmit = Object.keys(propTypes);
+
 const defaultProps = {
   isOpen: false,
   autoFocus: true,
@@ -182,13 +185,16 @@ class Modal extends React.Component {
   }
 
   renderModalDialog() {
+    const attributes = omit(this.props, propsToOmit);
+
     return (
       <div
         className={mapToCssModules(classNames('modal-dialog', this.props.className, {
           [`modal-${this.props.size}`]: this.props.size
         }), this.props.cssModule)}
         role="document"
         ref={(c) => (this._dialog = c)}
+        {...attributes}
       >
         <div
           className={mapToCssModules(
diff --git a/src/__tests__/Modal.spec.js b/src/__tests__/Modal.spec.js
@@ -97,6 +97,21 @@ describe('Modal', () => {
     wrapper.unmount();
   });
 
+  it('should render with additional props if provided', () => {
+    isOpen = true;
+    const wrapper = mount(
+      <Modal isOpen={isOpen} toggle={toggle} style={{ maxWidth: '95%' }}>
+        Yo!
+      </Modal>
+    );
+
+    jasmine.clock().tick(300);
+    expect(wrapper.children().length).toBe(0);
+    expect(document.getElementsByClassName('modal-dialog').length).toBe(1);
+    expect(document.getElementsByClassName('modal-dialog')[0].style.maxWidth).toBe('95%');
+    wrapper.unmount();
+  });
+
   it('should render without fade transition if provided with fade={false}', () => {
     isOpen = true;
     const wrapper = mount(
