Feature/5987 lazyload css

assets/js/lazyload-css.js

@@ -14,6 +14,11 @@ function rocket_css_lazyload_launch() {
 				pairs.map(pair => {
 					if (pair) {
 						styleElement.innerHTML += pair.style;
+
+						if(pair.elements === undefined) {
+							return;
+						}
+
 						pair.elements.forEach(el => {
 							el.setAttribute('data-rocket-lazy-bg', 'loaded');
 							// Stop observing the target element

inc/Engine/Media/Lazyload/CSS/Front/ContentFetcher.php

@@ -59,6 +59,13 @@ protected function fetch_content( string $path ) {
 		if ( ! wp_http_validate_url( $path ) ) {
 			return $this->filesystem->get_contents( $path );
 		}
-		return wp_remote_retrieve_body( wp_remote_get( $path ) );
+
+		$response = wp_remote_get( $path );
+
+		if ( wp_remote_retrieve_response_code( $response ) === 404 ) {
+			return false;
+		}
+
+		return wp_remote_retrieve_body( $response );
 	}
 }

inc/Engine/Media/Lazyload/CSS/Front/MappingFormatter.php

@@ -38,10 +38,35 @@ public function format( array $data ): array {
 	 * @return string
 	 */
 	protected function remove_pseudo_classes( string $selector ): string {
+
+		$original_pseudo_elements = [
+			':before',
+			':after',
+			':first-line',
+			':first-letter',
+		];
+
+		/**
+		 * Pseudo elements to remove from lazyload CSS selector.
+		 *
+		 * @param string[] Pseudo elements to remove.
+		 */
+		$pseudo_elements_to_remove = apply_filters( 'rocket_lazyload_css_ignored_pseudo_elements', $original_pseudo_elements );
+
+		if ( ! is_array( $original_pseudo_elements ) ) {
+			$pseudo_elements_to_remove = $original_pseudo_elements;
+		}
+
 		$result = preg_replace( '/::[\w\-]+/', '', $selector );
+
+		foreach ( $pseudo_elements_to_remove as $element ) {
+			$result = str_replace( $element, '', $result );
+		}
+
 		if ( ! $result ) {
 			return 'body';
 		}
+
 		return (string) $result;
 	}
 }

inc/Engine/Media/Lazyload/CSS/Subscriber.php

@@ -458,7 +458,10 @@ protected function generate_content( string $content ): LazyloadedContent {
 	 */
 	protected function load_existing_mapping( string $url ) {
 		$content = $this->cache->get( $this->get_mapping_file_url( $url ) );
-		$urls    = json_decode( $content, true );
+		if ( ! $content ) {
+			return [];
+		}
+		$urls = json_decode( $content, true );
 		if ( ! $urls ) {
 			return [];
 		}

inc/Engine/Media/Lazyload/CanLazyloadTrait.php

@@ -17,6 +17,8 @@ protected function should_lazyload() {
 			rocket_get_constant( 'DONOTLAZYLOAD', false )
 			||
 			rocket_get_constant( 'DONOTROCKETOPTIMIZE', false )
+			||
+			rocket_get_constant( 'DONOTCACHEPAGE', false )
 		) {
 			return false;
 		}

src/js/global/lazyload-css.js

@@ -3,6 +3,7 @@ function rocket_css_lazyload_launch() {
 	const usable_pairs = typeof rocket_pairs === 'undefined' ? [] : rocket_pairs;
 
 
+
 	const styleElement = document.querySelector('#wpr-lazyload-bg');
 
 	const threshold = rocket_lazyload_css_data.threshold || 300;
@@ -14,6 +15,11 @@ function rocket_css_lazyload_launch() {
 				pairs.map(pair => {
 					if (pair) {
 						styleElement.innerHTML += pair.style;
+
+						if(pair.elements === undefined) {
+							return;
+						}
+
 						pair.elements.forEach(el => {
 							el.setAttribute('data-rocket-lazy-bg', 'loaded');
 							// Stop observing the target element

tests/Fixtures/inc/Engine/Media/Lazyload/CSS/Front/ContentFetcher/fetch.php

@@ -5,7 +5,8 @@
               'path' => '/my/file',
 			  'is_url' => false,
 			  'content' => 'content',
-			  'destination' => '/path/new'
+			  'destination' => '/path/new',
+			  'code' => 200
         ],
         'expected' => 'content'
     ],
@@ -16,7 +17,8 @@
 			'content' => 'content',
 			'response' => 'response',
 			'body' => 'body',
-			'destination' => '/path/new'
+			'destination' => '/path/new',
+			'code' => 200
 		],
 		'expected' => 'body'
 	],
@@ -27,7 +29,8 @@
 			'content' => 'content',
 			'response' => 'response',
 			'body' => null,
-			'destination' => '/path/new'
+			'destination' => '/path/new',
+			'code' => 200
 		],
 		'expected' => false
 	],

tests/Fixtures/inc/Engine/Media/Lazyload/CSS/Front/MappingFormatter/format.php

@@ -43,6 +43,16 @@
 					'hash' => 'a122ad12df3',
 					'selector' => '::after',
 					'url' => 'http://example.org/test',
+				],
+				[
+					'hash' => 'a122ad12df3',
+					'selector' => ':after',
+					'url' => 'http://example.org/test',
+				],
+				[
+					'hash' => 'a122ad12df3',
+					'selector' => ':last',
+					'url' => 'http://example.org/test',
 				]
 			],
 		],
@@ -58,6 +68,14 @@
 			[
 				'selector' => 'body',
 				'style' => ':root{--wpr-bg-a122ad12df3: http://example.org/test;}'
+			],
+			[
+				'selector' => 'body',
+				'style' => ':root{--wpr-bg-a122ad12df3: http://example.org/test;}'
+			],
+			[
+				'selector' => ':last',
+				'style' => ':root{--wpr-bg-a122ad12df3: http://example.org/test;}'
 			]
 		]
 	],

tests/Fixtures/inc/Engine/Media/Lazyload/Subscriber/insertLazyloadScript.php

@@ -89,6 +89,23 @@
 			'integration' => '',
 		],
 	],
+	'testShouldReturnNothingWhenPageNotCached' => [
+		'config' => [
+			'is_not_cached_page' => false,
+			'options'  => [
+				'lazyload'         => 1,
+				'lazyload_iframes' => 0,
+			],
+		],
+		'expected' => [
+			'unit' => [
+				'inline_script' => '',
+				'script'        => '',
+				'result'        => '',
+			],
+			'integration' => '',
+		],
+	],
 	'testShouldReturnNothingWhenIsNotRocketOptimize' => [
 		'config' => [
 			'is_rocket_optimize' => false,

tests/Integration/inc/Engine/Media/Lazyload/Subscriber/insertLazyloadScript.php

@@ -75,6 +75,7 @@ public function testShouldInsertLazyloadScript( $config, $expected ) {
 		$is_rest_request    = isset( $config['is_rest_request'] )    ? $config['is_rest_request']    : false;
 		$is_lazy_load       = isset( $config['is_lazy_load'] )       ? $config['is_lazy_load']       : true;
 		$is_rocket_optimize = isset( $config['is_rocket_optimize'] ) ? $config['is_rocket_optimize'] : true;
+		$is_not_cached_page = isset( $config['is_not_cached_page'] ) ? $config['is_not_cached_page'] : true;
 
 		set_current_screen( $is_admin ? 'settings_page_wprocket' : 'front' );
 
@@ -87,6 +88,7 @@ public function testShouldInsertLazyloadScript( $config, $expected ) {
 		$this->constants['REST_REQUEST']  = $is_rest_request;
 		$this->constants['DONOTLAZYLOAD'] = ! $is_lazy_load;
 		$this->donotrocketoptimize        = ! $is_rocket_optimize;
+		$this->is_not_cached_page         = ! $is_not_cached_page;
 		$this->constants['WP_ROCKET_ASSETS_JS_URL'] = 'http://example.org/wp-content/plugins/wp-rocket/assets/';
 
 		// wp-media/rocket-lazyload-common uses the constant for determining whether to set as .min.js.

tests/StubTrait.php

@@ -17,6 +17,7 @@ trait StubTrait {
 	protected $wp_rocket_advanced_cache = true;
 	protected $disable_wp_cron = false;
 	protected $donotrocketoptimize = null;
+	protected $is_not_cached_page = null;
 	protected $white_label = false;
 	protected $white_label_footprint = null;
 	protected $plugin_name = 'WP Rocket';
@@ -70,6 +71,9 @@ protected function getConstant( $constant_name, $default = null ) {
 			case 'DONOTROCKETOPTIMIZE' :
 				return $this->donotrocketoptimize;
 
+			case 'DONOTCACHEPAGE' :
+				return $this->is_not_cached_page;
+
 			case 'FS_CHMOD_DIR':
 				return 0777;
 

tests/Unit/inc/Engine/Media/Lazyload/CSS/Front/ContentFetcher/fetch.php

@@ -56,6 +56,7 @@ protected function configure_url($config) {
 			return;
 		}
 		Functions\expect('wp_remote_get')->with($config['path'])->andReturn($config['response']);
+		Functions\expect('wp_remote_retrieve_response_code')->with($config['response'])->andReturn($config['code']);
 		Functions\expect('wp_remote_retrieve_body')->with($config['response'])->andReturn($config['body']);
 	}
 }

tests/Unit/inc/Engine/Media/Lazyload/Subscriber/insertLazyloadScript.php

@@ -55,14 +55,33 @@ public function testShouldInsertLazyloadScript( $config, $expected ) {
 		$is_rest_request    = isset( $config['is_rest_request'] )    ? $config['is_rest_request']    : false;
 		$is_lazy_load       = isset( $config['is_lazy_load'] )       ? $config['is_lazy_load']       : true;
 		$is_rocket_optimize = isset( $config['is_rocket_optimize'] ) ? $config['is_rocket_optimize'] : true;
+		$is_not_cached_page = isset( $config['is_not_cached_page'] ) ? $config['is_not_cached_page'] : true;
 
 		Functions\when( 'is_admin' )->justReturn( $is_admin );
 		Functions\when( 'is_feed' )->justReturn( $is_feed );
 		Functions\when( 'is_preview' )->justReturn( $is_preview );
 		Functions\when( 'is_search' )->justReturn( $is_search );
-		Functions\expect( 'rocket_get_constant' )
-			->with('REST_REQUEST', 'DONOTLAZYLOAD', 'DONOTROCKETOPTIMIZE', 'WP_ROCKET_ASSETS_JS_URL')
-			->andReturn( $is_rest_request, !$is_lazy_load, !$is_rocket_optimize, 'http://example.org/wp-content/plugins/wp-rocket/assets/' );
+		Functions\when('rocket_get_constant')->alias(function ($name, $default = false) use ($is_rest_request, $is_lazy_load, $is_rocket_optimize, $is_not_cached_page) {
+			if($name == 'REST_REQUEST') {
+				return $is_rest_request;
+			}
+			if($name == 'DONOTLAZYLOAD') {
+				return !$is_lazy_load;
+			}
+			if($name == 'DONOTROCKETOPTIMIZE') {
+				return !$is_rocket_optimize;
+			}
+			if($name == 'WP_ROCKET_ASSETS_JS_URL') {
+				return !$is_rocket_optimize;
+			}
+			if($name == 'SCRIPT_DEBUG') {
+				return true;
+			}
+			if($name == 'DONOTCACHEPAGE') {
+				return !$is_not_cached_page;
+			}
+			return $default;
+		});
 
 		foreach ( $options as $key => $value ) {
 			$this->options->shouldReceive( 'get' )