diff --git a/lib/components/ModalPortal.js b/lib/components/ModalPortal.js index 52687115..78d846b4 100644 --- a/lib/components/ModalPortal.js +++ b/lib/components/ModalPortal.js @@ -142,7 +142,8 @@ var ModalPortal = module.exports = React.createClass({ render: function() { return this.shouldBeClosed() ? div() : ( div({ - className: this.buildClassName('overlay'), + ref: "overlay", + className: cx(this.buildClassName('overlay'), this.props.overlayClassName), style: this.overlayStyles, onClick: this.handleOverlayClick }, diff --git a/specs/Modal.spec.js b/specs/Modal.spec.js index 7ceb1a90..01a4d1a3 100644 --- a/specs/Modal.spec.js +++ b/specs/Modal.spec.js @@ -104,6 +104,12 @@ describe('Modal', function () { unmountModal(); }); + it('supports overlayClassName', function () { + var modal = renderModal({isOpen: true, overlayClassName: 'myOverlayClass'}); + equal(modal.portal.refs.overlay.getDOMNode().className.contains('myOverlayClass'), true); + unmountModal(); + }); + it('adds --after-open for animations', function() { var modal = renderModal({isOpen: true}); var overlay = document.querySelector('.ReactModal__Overlay');