Merge pull request #256 from Automattic/master

Oct. 20 – Release

includes/class-newspack-popups-inserter.php

@@ -25,7 +25,7 @@ final class Newspack_Popups_Inserter {
 	 *
 	 * @var boolean
 	 */
-	protected static $the_content_has_rendered = false;
+	public static $the_content_has_rendered = false;
 
 	/**
 	 * Retrieve the appropriate popups for the current post.
@@ -269,6 +269,9 @@ public static function insert_popups_after_header() {
 	 * Enqueue the assets needed to display the popups.
 	 */
 	public static function enqueue_popup_assets() {
+		if ( defined( 'IS_TEST_ENV' ) && IS_TEST_ENV ) {
+			return;
+		}
 		$is_amp = function_exists( 'is_amp_endpoint' ) && is_amp_endpoint();
 		if ( ! $is_amp ) {
 			wp_register_script(
@@ -304,7 +307,9 @@ public static function popup_shortcode( $atts = array() ) {
 		} elseif ( isset( $atts['id'] ) ) {
 			$found_popup = Newspack_Popups_Model::retrieve_popup_by_id( $atts['id'] );
 		}
-		return Newspack_Popups_Model::generate_popup( $found_popup );
+		// Wrapping the inline popup in an aside element prevents the markup from being mangled
+		// if the shortcode is the first block.
+		return '<aside>' . Newspack_Popups_Model::generate_popup( $found_popup ) . '</aside>';
 	}
 
 	/**
@@ -398,9 +403,6 @@ public static function assess_has_disabled_popups() {
 	 * Register and enqueue all required AMP scripts, if needed.
 	 */
 	public static function register_amp_scripts() {
-		if ( ! Newspack_Popups_Segmentation::is_tracking() ) {
-			return;
-		}
 		if ( ! is_admin() && ! wp_script_is( 'amp-runtime', 'registered' ) ) {
 		// phpcs:ignore WordPress.WP.EnqueuedResourceParameters.MissingVersion
 			wp_register_script(
@@ -486,6 +488,10 @@ public static function should_display( $popup ) {
 		if ( is_user_logged_in() && 'test' !== $popup['options']['frequency'] ) {
 			return false;
 		}
+		// Hide overlay campaigns in non-interactive mode, for non-logged-in users.
+		if ( ! is_user_logged_in() && Newspack_Popups_Settings::is_non_interactive() && ! Newspack_Popups_Model::is_inline( $popup ) ) {
+			return false;
+		}
 		return self::assess_is_post( $popup ) &&
 			self::assess_test_mode( $popup ) &&
 			self::assess_categories_filter( $popup );

includes/class-newspack-popups-model.php

@@ -396,7 +396,7 @@ protected static function get_delay( $popup ) {
 	 * @param object $popup The popup object.
 	 * @return boolean True if it is an inline popup.
 	 */
-	protected static function is_inline( $popup ) {
+	public static function is_inline( $popup ) {
 		return 'inline' === $popup['options']['placement'];
 	}
 
@@ -419,7 +419,11 @@ public static function has_newsletter_prompt( $popup ) {
 	 * @return string Prints the generated amp-analytics element.
 	 */
 	protected static function insert_event_tracking( $popup, $body, $element_id ) {
-		if ( Newspack_Popups::previewed_popup_id() || 'test' === $popup['options']['frequency'] ) {
+		if (
+			Newspack_Popups::previewed_popup_id() ||
+			'test' === $popup['options']['frequency'] ||
+			Newspack_Popups_Settings::is_non_interactive()
+		) {
 			return '';
 		}
 		global $wp;
@@ -633,6 +637,9 @@ public static function canonize_popup_id( $popup_id ) {
 	 * @param object $popup Popup.
 	 */
 	public static function get_access_attrs( $popup ) {
+		if ( Newspack_Popups_Settings::is_non_interactive() ) {
+			return '';
+		}
 		if (
 			( 'test' === $popup['options']['frequency'] || Newspack_Popups::previewed_popup_id() ) &&
 			is_user_logged_in() &&
@@ -688,7 +695,7 @@ function ( $evts ) use ( $analytics_events ) {
 					<h1 class="newspack-popup-title"><?php echo esc_html( $popup['title'] ); ?></h1>
 				<?php endif; ?>
 						<?php echo ( $body ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
-						<?php if ( $dismiss_text ) : ?>
+						<?php if ( $dismiss_text && ! Newspack_Popups_Settings::is_non_interactive() ) : ?>
 					<form class="popup-not-interested-form popup-action-form"
 						method="POST"
 						action-xhr="<?php echo esc_url( $endpoint ); ?>"
@@ -738,6 +745,7 @@ public static function generate_popup( $popup ) {
 		$classes              = array( 'newspack-lightbox', 'newspack-lightbox-placement-' . $popup['options']['placement'] );
 		$classes[]            = ( ! empty( $popup['title'] ) && $display_title ) ? 'newspack-lightbox-has-title' : null;
 		$classes[]            = $is_newsletter_prompt ? 'newspack-newsletter-prompt-overlay' : null;
+		$is_scroll_triggered  = 'scroll' === $popup['options']['trigger_type'];
 
 		add_filter(
 			'newspack_analytics_events',
@@ -788,9 +796,11 @@ function ( $evts ) use ( $popup, $body, $element_id ) {
 				<button style="opacity: <?php echo floatval( $overlay_opacity ); ?>;background-color:<?php echo esc_attr( $overlay_color ); ?>;" class="newspack-lightbox-shim" on="tap:<?php echo esc_attr( $element_id ); ?>.hide"></button>
 			</form>
 		</amp-layout>
-		<div id="page-position-marker" style="position: absolute; top: <?php echo esc_attr( $popup['options']['trigger_scroll_progress'] ); ?>%"></div>
-		<amp-position-observer target="page-position-marker" on="enter:showAnim.start;" once layout="nodisplay"></amp-position-observer>
-		<amp-animation id="showAnim" layout="nodisplay">
+		<?php if ( $is_scroll_triggered ) : ?>
+			<div id="page-position-marker" style="position: absolute; top: <?php echo esc_attr( $popup['options']['trigger_scroll_progress'] ); ?>%"></div>
+			<amp-position-observer target="page-position-marker" on="enter:showAnim.start;" once layout="nodisplay"></amp-position-observer>
+		<?php endif; ?>
+		<amp-animation id="showAnim" layout="nodisplay" <?php echo $is_scroll_triggered ? '' : 'trigger="visibility"'; ?>>
 			<script type="application/json">
 				{
 					"duration": "125ms",

includes/class-newspack-popups-segmentation.php

@@ -63,7 +63,7 @@ public static function is_admin_user() {
 	 * Should tracking code be inserted?
 	 */
 	public static function is_tracking() {
-		if ( is_admin() || self::is_admin_user() ) {
+		if ( is_admin() || self::is_admin_user() || Newspack_Popups_Settings::is_non_interactive() ) {
 			return false;
 		}
 		return true;
@@ -73,10 +73,6 @@ public static function is_tracking() {
 	 * Insert amp-analytics scripts.
 	 */
 	public static function wp_enqueue_scripts() {
-		if ( ! self::is_tracking() ) {
-			return;
-		}
-
 		// Register AMP scripts explicitly for non-AMP pages.
 		if ( ! wp_script_is( 'amp-runtime', 'registered' ) ) {
 			// phpcs:ignore WordPress.WP.EnqueuedResourceParameters.MissingVersion

includes/class-newspack-popups-settings.php

@@ -49,11 +49,19 @@ public static function create_admin_page() {
 	 */
 	public static function get_settings() {
 		return [
-			'suppress_newsletter_campaigns' => get_option( 'suppress_newsletter_campaigns', true ),
+			'suppress_newsletter_campaigns'            => get_option( 'suppress_newsletter_campaigns', true ),
 			'suppress_all_newsletter_campaigns_if_one_dismissed' => get_option( 'suppress_all_newsletter_campaigns_if_one_dismissed', true ),
+			'newspack_newsletters_non_interative_mode' => self::is_non_interactive(),
 		];
 	}
 
+	/**
+	 * Is the non-interactive setting on?
+	 */
+	public static function is_non_interactive() {
+		return get_option( 'newspack_newsletters_non_interative_mode', false );
+	}
+
 	/**
 	 * Load up common JS/CSS for settings.
 	 */

src/settings/index.js

@@ -59,6 +59,16 @@ const App = () => {
 					checked={ settings.suppress_all_newsletter_campaigns_if_one_dismissed === '1' }
 					onChange={ handleSettingChange( 'suppress_all_newsletter_campaigns_if_one_dismissed' ) }
 				/>
+				<CheckboxControl
+					label={ __( 'Enable non-interactive mode.', 'newspack-popups' ) }
+					help={ __(
+						'Use this setting in high traffic scenarios. No API requests will be made, reducing server load. Inline campaigns will be shown to all users without dismissal buttons, and overlay campaigns will be suppressed.',
+						'newspack-popups'
+					) }
+					disabled={ inFlight }
+					checked={ settings.newspack_newsletters_non_interative_mode === '1' }
+					onChange={ handleSettingChange( 'newspack_newsletters_non_interative_mode' ) }
+				/>
 			</Card>
 		</Grid>
 	);

src/view/style.scss

@@ -197,6 +197,7 @@ $color__secondary-variation: darken( $color__secondary, 10% );
 }
 
 .newspack-inline-popup {
+	display: block;
 	border: 1px solid rgba( black, 0.2 );
 	clear: both;
 	padding: 0.75em;

tests/bootstrap.php

@@ -31,5 +31,7 @@ function _manually_load_plugin() {
 }
 tests_add_filter( 'muplugins_loaded', '_manually_load_plugin' );
 
+define( 'IS_TEST_ENV', 1 );
+
 // Start up the WP testing environment.
 require $_tests_dir . '/includes/bootstrap.php';

tests/test-insertion.php

@@ -13,7 +13,7 @@ class InsertionTest extends WP_UnitTestCase {
 	private static $popup_content = 'Faucibus placerat senectus metus molestie varius tincidunt.'; // phpcs:ignore Squiz.Commenting.VariableComment.Missing
 	private static $popup_id      = false; // phpcs:ignore Squiz.Commenting.VariableComment.Missing
 
-	public static function wpSetUpBeforeClass() { // phpcs:ignore Squiz.Commenting.FunctionComment.Missing
+	public function setUp() { // phpcs:ignore Squiz.Commenting.FunctionComment.Missing
 		self::$post_id  = self::factory()->post->create(
 			[
 				'post_content' => 'Elit platea a convallis dolor id mollis ultricies sociosqu dapibus.',
@@ -30,6 +30,8 @@ public static function wpSetUpBeforeClass() { // phpcs:ignore Squiz.Commenting.F
 		Newspack_Popups_Model::set_sitewide_popup( self::$popup_id );
 		// Set popup frequency from default 'test'.
 		Newspack_Popups_Model::set_popup_options( self::$popup_id, [ 'frequency' => 'once' ] );
+		// Reset internal duplicate-prevention.
+		Newspack_Popups_Inserter::$the_content_has_rendered = false;
 	}
 
 	/**
@@ -41,11 +43,10 @@ public function test_insertion() {
 		$wp_query->in_the_loop = true;
 		setup_postdata( $post );
 
-		$post_content       = get_post( self::$post_id )->post_content;
-		$content_with_popup = Newspack_Popups_Inserter::insert_popups_in_content( $post_content, false );
+		$post_content = apply_filters( 'the_content', get_post( self::$post_id )->post_content );
 
 		$dom = new DomDocument();
-		@$dom->loadHTML( $content_with_popup ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
+		@$dom->loadHTML( $post_content ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
 		$xpath               = new DOMXpath( $dom );
 		$amp_layout_elements = $xpath->query( '//amp-layout' );
 		$popup_text_content  = $amp_layout_elements->item( 0 )->textContent;
@@ -62,8 +63,55 @@ public function test_insertion() {
 		);
 		self::assertContains(
 			$post_content,
-			$content_with_popup,
+			$post_content,
 			'Includes the original post content.'
 		);
 	}
+
+	/**
+	 * Test non-interactive setting for overlay campaigns.
+	 */
+	public function test_non_interactive_overlay() {
+		update_option( 'newspack_newsletters_non_interative_mode', true );
+
+		self::go_to( get_permalink( self::$post_id ) );
+		global $wp_query, $post;
+		$wp_query->in_the_loop = true;
+		setup_postdata( $post );
+
+		$post_content = apply_filters( 'the_content', get_post( self::$post_id )->post_content );
+
+		self::assertNotContains(
+			self::$popup_content,
+			$post_content,
+			'Does not include the popup content, since it is an overlay campaign.'
+		);
+	}
+
+	/**
+	 * Test non-interactive setting for inline campaigns.
+	 */
+	public function test_non_interactive_inline() {
+		update_option( 'newspack_newsletters_non_interative_mode', true );
+
+		Newspack_Popups_Model::set_popup_options( self::$popup_id, [ 'placement' => 'inline' ] );
+
+		self::go_to( get_permalink( self::$post_id ) );
+		global $wp_query, $post;
+		$wp_query->in_the_loop = true;
+		setup_postdata( $post );
+
+		$post_content = apply_filters( 'the_content', get_post( self::$post_id )->post_content );
+
+		self::assertContains(
+			self::$popup_content,
+			$post_content,
+			'Does include the popup content.'
+		);
+		self::assertNotContains(
+			Newspack_Popups::get_default_dismiss_text(),
+			$post_content,
+			'Does not include the dismissal text.'
+		);
+	}
 }

tests/test-model.php

@@ -69,13 +69,37 @@ public function test_markup_generation() {
 		@$dom->loadHTML( Newspack_Popups_Model::generate_popup( $popup_object_default ) ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
 		$xpath = new DOMXpath( $dom );
 
+		self::assertEquals(
+			0,
+			$xpath->query( '//*[@id="page-position-marker"]' )->length,
+			'The page position marker is not output for a default (time-triggered) popup.'
+		);
+
+		self::assertEquals(
+			'visibility',
+			$xpath->query( '//amp-animation' )->item( 0 )->getAttribute( 'trigger' ),
+			'The amp-animation trigger is set to "visibility" for default (time-triggered) popup.'
+		);
+
+		$popup_object_with_just_scroll = Newspack_Popups_Model::create_popup_object(
+			get_post( self::$popup_id ),
+			false,
+			[
+				'trigger_type' => 'scroll',
+			]
+		);
+
+		$dom = new DomDocument();
+		@$dom->loadHTML( Newspack_Popups_Model::generate_popup( $popup_object_with_just_scroll ) ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
+		$xpath = new DOMXpath( $dom );
+
 		self::assertContains(
 			'top: 0%',
 			$xpath->query( '//*[@id="page-position-marker"]' )->item( 0 )->getAttribute( 'style' ),
 			'The position marker is set at 0% by default.'
 		);
 
-		$popup_object = Newspack_Popups_Model::create_popup_object(
+		$popup_object_with_set_scroll_progress = Newspack_Popups_Model::create_popup_object(
 			get_post( self::$popup_id ),
 			false,
 			[
@@ -85,7 +109,7 @@ public function test_markup_generation() {
 		);
 
 		$dom = new DomDocument();
-		@$dom->loadHTML( Newspack_Popups_Model::generate_popup( $popup_object ) ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
+		@$dom->loadHTML( Newspack_Popups_Model::generate_popup( $popup_object_with_set_scroll_progress ) ); // phpcs:ignore WordPress.PHP.NoSilencedErrors.Discouraged
 		$xpath = new DOMXpath( $dom );
 
 		self::assertContains(