diff --git a/packages/edit-post/src/components/meta-boxes/meta-box-visibility.js b/packages/edit-post/src/components/meta-boxes/meta-box-visibility.js index 31bc0becf225f2..970cf26355e6ca 100644 --- a/packages/edit-post/src/components/meta-boxes/meta-box-visibility.js +++ b/packages/edit-post/src/components/meta-boxes/meta-box-visibility.js @@ -17,9 +17,16 @@ class MetaBoxVisibility extends Component { updateDOM() { const { id, isVisible } = this.props; + const element = document.getElementById( id ); - if ( element ) { - element.style.display = isVisible ? '' : 'none'; + if ( ! element ) { + return; + } + + if ( isVisible ) { + element.classList.remove( 'is-hidden' ); + } else { + element.classList.add( 'is-hidden' ); } } diff --git a/packages/edit-post/src/components/meta-boxes/meta-boxes-area/style.scss b/packages/edit-post/src/components/meta-boxes/meta-boxes-area/style.scss index f336804fa38de1..b86d15952683b0 100644 --- a/packages/edit-post/src/components/meta-boxes/meta-boxes-area/style.scss +++ b/packages/edit-post/src/components/meta-boxes/meta-boxes-area/style.scss @@ -75,6 +75,12 @@ right: 20px; z-index: z-index(".edit-post-meta-boxes-area .spinner"); } + + // Hide disabled meta boxes using CSS so that we don't interfere with plugins + // that modify `element.style.display` on the meta box. + .is-hidden { + display: none; + } } .edit-post-meta-boxes-area__clear {