feat: adds compatibility with multiple slider plugins

cypress/integration/test_masterslider_background_lazyload.js

@@ -0,0 +1,13 @@
+describe( 'Check MasterSlider Background Page', function () {
+	it( 'successfully loads', function () {
+		cy.visit( '/masterslider/' )
+	} );
+	it( 'Slider background images in view should be lazyloaded', function () {
+		cy.get( '.entry-content' ).find( '.master-slider' ).eq( 0 ).should( 'have.attr', 'class' ).and( 'include', 'optml-bg-lazyloaded' )
+	} );
+	it( 'Scroll the page', function () {
+		cy.scrollTo( 0, 2500 )
+		cy.get( '.entry-content' ).find( '.master-slider' ).eq( 1 ).should( 'have.css', 'background-image' ).and( 'match', /none/ )
+	} );
+
+} );

cypress/integration/test_metaslider_background_lazyload.js

@@ -0,0 +1,25 @@
+describe( 'Check Metaslider Background Page', function () {
+	it( 'successfully loads', function () {
+		cy.visit( '/metaslider/' )
+	} );
+	it( 'Slider background images in view should be lazyloaded', function () {
+		cy.get( '.entry-content' ).find( '.coin-slider > .coin-slider' ).eq( 0 ).should( 'have.attr', 'class' ).and( 'include', 'optml-bg-lazyloaded' );
+	} );
+	it( 'Slider background images in view should be lazyloaded', function () {
+		for ( let i=4;i<=30;i++ ) {
+			cy.get( '.entry-content' ).find( '.coin-slider > .coin-slider > a' ).eq( i ).should( 'have.attr', 'class' ).and( 'include', 'optml-bg-lazyloaded' );
+		}
+	} );
+
+	it( 'Scroll the page', function () {
+		cy.scrollTo( 0, 2500 )
+	} );
+	it( 'After scroll slider background images not in view should be lazyloaded', function () {
+		cy.get( '.entry-content' ).find( '.coin-slider > .coin-slider' ).eq( 1 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+	} );
+	it( 'After scroll slider background images not in view should be lazyloaded', function () {
+		for ( let i=35;i<=67;i++ ) {
+			cy.get( '.entry-content' ).find( '.coin-slider > .coin-slider > a' ).eq( i ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+		}
+	} );
+} );

cypress/integration/test_smartslider3_background_lazyload.js

@@ -0,0 +1,27 @@
+describe( 'Check Smart Slider Background Page', function () {
+	it( 'successfully loads', function () {
+		cy.visit( '/smartslider3/' )
+	} );
+	it( 'Slider background images in view should be lazyloaded', function () {
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 0 ).should( 'have.attr', 'class' ).and( 'include', 'optml-bg-lazyloaded' );
+	} );
+	it( 'Slider background images not in view have background-image:none', function () {
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 1 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+	} );
+	it( 'Slider background images not in view have background-image:none', function () {
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 2 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+	} );
+	it( 'Slider background images not in view have background-image:none', function () {
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 3 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+	} );
+	it( 'After scroll the background images that come in view should be loaded', function () {
+		cy.scrollTo( 0, 2000 )
+
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 3 ).should( 'have.attr', 'class' ).and( 'include', 'optml-bg-lazyloaded' );
+
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 4 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+
+		cy.get( '.entry-content' ).find( '.n2-ss-slide-background-image' ).eq( 5 ).should( 'have.css', 'background-image' ).and( 'match', /none/ );
+
+	} );
+} );

inc/compatibilities/master_slider.php

@@ -0,0 +1,47 @@
+<?php
+
+/**
+ * Class Optml_master_slider.
+ *
+ * @reason Added classes to watch for background lazyload
+ */
+class Optml_master_slider extends Optml_compatibility {
+
+
+
+	/**
+	 * Should we load the integration logic.
+	 *
+	 * @return bool Should we load.
+	 */
+	function should_load() {
+		include_once( ABSPATH . 'wp-admin/includes/plugin.php' );
+
+		return is_plugin_active( 'master-slider/master-slider.php' );
+	}
+
+	/**
+	 * Register integration details.
+	 */
+	public function register() {
+		add_filter(
+			'optml_lazyload_bg_selectors',
+			function ( $all_watchers ) {
+				$all_watchers = array_merge( $all_watchers, ['.master-slider'] );
+				return $all_watchers;
+			}
+		);
+		add_filter(
+			'optml_dont_replace_url',
+			function ( $arg, $url = null ) {
+				if ( strpos( $url, 'blank.gif' ) !== false ) {
+					return true;
+				}
+					return $arg;
+			},
+			10,
+			2
+		);
+
+	}
+}

inc/compatibilities/metaslider.php

@@ -27,6 +27,13 @@ public function register() {
 		add_filter( 'optml_possible_lazyload_flags', [ $this, 'add_ignore_lazyload' ], PHP_INT_MAX, 1 );
 		add_filter( 'optml_watcher_lz_classes', [ $this, 'add_watcher_class' ], 10, 1 );
 		add_filter( 'metaslider_coin_slider_image_attributes', [ $this, 'setup_listner' ], PHP_INT_MAX, 1 );
+		add_filter(
+			'optml_lazyload_bg_selectors',
+			function ( $all_watchers ) {
+				$all_watchers = array_merge( $all_watchers, ['.coin-slider > .coin-slider > a', '.coin-slider > .coin-slider'] );
+				return $all_watchers;
+			}
+		);
 	}
 
 	/**

inc/compatibilities/smart_slider_3.php

@@ -0,0 +1,35 @@
+<?php
+
+/**
+ * Class Optml_smart_slider_3.
+ *
+ * @reason Added classes to watch for background lazyload
+ */
+class Optml_smart_slider_3 extends Optml_compatibility {
+
+
+
+	/**
+	 * Should we load the integration logic.
+	 *
+	 * @return bool Should we load.
+	 */
+	function should_load() {
+		include_once( ABSPATH . 'wp-admin/includes/plugin.php' );
+
+		return is_plugin_active( 'smart-slider-3/smart-slider-3.php' );
+	}
+
+	/**
+	 * Register integration details.
+	 */
+	public function register() {
+		add_filter(
+			'optml_lazyload_bg_selectors',
+			function ( $all_watchers ) {
+				$all_watchers = array_merge( $all_watchers, ['.n2-ss-slide-background-image'] );
+				return $all_watchers;
+			}
+		);
+	}
+}

inc/lazyload_replacer.php

@@ -255,7 +255,6 @@ public function can_lazyload_for( $url, $tag = '' ) {
 				return false;
 			}
 		}
-
 		if ( false === Optml_Filters::should_do_image( $url, self::$filters[ Optml_Settings::FILTER_TYPE_LAZYLOAD ][ Optml_Settings::FILTER_FILENAME ] ) ) {
 			return false;
 		}

inc/manager.php

@@ -68,7 +68,10 @@ final class Optml_Manager {
 		'elementor_builder',
 		'divi_builder',
 		'thrive',
+		'smart_slider_3',
+		'master_slider',
 	);
+
 	/**
 	 * Class instance method.
 	 *