fix(Modal): update zindex when prop is changed (#937)

reactstrap · Apr 3, 2018 · 01667c1 · 01667c1
1 parent 4dea4a6
commit 01667c1
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 1 deletion.
diff --git a/src/Modal.js b/src/Modal.js
@@ -120,6 +120,10 @@ class Modal extends React.Component {
     if (this.props.autoFocus && this.state.isOpen && !prevState.isOpen) {
       this.setFocus();
     }
+
+    if (this._element && prevProps.zIndex !== this.props.zIndex) {
+      this._element.style.zIndex = this.props.zIndex;
+    }
   }
 
   componentWillUnmount() {

diff --git a/src/__tests__/Modal.spec.js b/src/__tests__/Modal.spec.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import { Modal, ModalBody } from '../';
 
 describe('Modal', () => {
@@ -737,4 +737,15 @@ describe('Modal', () => {
     expect(onEnter).not.toHaveBeenCalled();
     expect(onExit).toHaveBeenCalled();
   });
+
+  it('should update element z index when prop changes', () => {
+    const wrapper = shallow(
+      <Modal isOpen zIndex={0}>
+        Yo!
+      </Modal>
+    );
+    expect(wrapper.instance()._element.style.zIndex).toBe('0');
+    wrapper.setProps({ zIndex: 1 });
+    expect(wrapper.instance()._element.style.zIndex).toBe('1');
+  });
 });