From 06c4dc3e1e92d739012137c1c7a3624fc6a49fcd Mon Sep 17 00:00:00 2001
From: Robert Anderson <robert@noisysocks.com>
Date: Mon, 10 Dec 2018 03:17:48 +1100
Subject: [PATCH] Meta Boxes: Don't hide disabled meta boxes by modifying DOM
 (#12628)

Hiding disabled meta boxes by setting `element.style.display = 'none'`
interferes with plugins like ACF which rely on being able to show and
hide meta boxes using `$.hide()` and `$.show()`.

Hiding the meta box using a new `.edit-post-meta-boxes-area .is-hidden`
class ensures that we don't interfere with third party code.
---
 .../src/components/meta-boxes/meta-box-visibility.js  | 11 +++++++++--
 .../components/meta-boxes/meta-boxes-area/style.scss  |  6 ++++++
 2 files changed, 15 insertions(+), 2 deletions(-)

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 31bc0becf225f..970cf26355e6c 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 f336804fa38de..b86d15952683b 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 {