Restrict screen-reader-text to Customizer preview styles

Also use AMP_QUERY_VAR instaed of hard-coded 'amp' in amp_admin_get_preview_permalink()

includes/admin/class-amp-customizer.php

@@ -72,6 +72,7 @@ public function init_preview() {
 		// Output scripts and styles which will break AMP validation only when preview is opened with controls for manipulation.
 		if ( $this->wp_customize->get_messenger_channel() ) {
 			add_action( 'amp_post_template_head', array( $this->wp_customize, 'customize_preview_loading_style' ) );
+			add_action( 'amp_post_template_css', array( $this, 'add_customize_preview_styles' ) );
 			add_action( 'amp_post_template_head', array( $this->wp_customize, 'remove_frameless_preview_messenger_channel' ) );
 			add_action( 'amp_post_template_footer', array( $this, 'add_preview_scripts' ) );
 		}
@@ -182,6 +183,28 @@ public function enqueue_preview_scripts() {
 		) );
 	}
 
+	/**
+	 * Add AMP Customizer preview styles.
+	 */
+	public function add_customize_preview_styles() {
+		?>
+		/* Text meant only for screen readers; this is needed for wp.a11y.speak() */
+		.screen-reader-text {
+			border: 0;
+			clip: rect(1px, 1px, 1px, 1px);
+			-webkit-clip-path: inset(50%);
+			clip-path: inset(50%);
+			height: 1px;
+			margin: -1px;
+			overflow: hidden;
+			padding: 0;
+			position: absolute;
+			width: 1px;
+			word-wrap: normal !important;
+		}
+		<?php
+	}
+
 	/**
 	 * Enqueues scripts and does wp_print_footer_scripts() so we can output customizer scripts.
 	 *

includes/admin/functions.php

@@ -36,7 +36,7 @@ function amp_admin_get_preview_permalink() {
 	 */
 	$post_type = (string) apply_filters( 'amp_customizer_post_type', 'post' );
 
-	if ( ! post_type_supports( $post_type, 'amp' ) ) {
+	if ( ! post_type_supports( $post_type, AMP_QUERY_VAR ) ) {
 		return;
 	}
 

templates/style.php

@@ -36,21 +36,6 @@
 	margin-right: auto;
 }
 
-/* Text meant only for screen readers */
-.screen-reader-text {
-	border: 0;
-	clip: rect(1px, 1px, 1px, 1px);
-	-webkit-clip-path: inset(50%);
-	clip-path: inset(50%);
-	height: 1px;
-	margin: -1px;
-	overflow: hidden;
-	padding: 0;
-	position: absolute;
-	width: 1px;
-	word-wrap: normal !important;
-}
-
 .amp-wp-enforced-sizes {
 	/** Our sizes fallback is 100vw, and we have a padding on the container; the max-width here prevents the element from overflowing. **/
 	max-width: 100%;