WPEX 1690 - refactor post carousel to remove JQuery (#2235)

* replace slick with the tiny swiper component for post carousel

* handle external rss feed for post carousel

* handle ssr for post carousel posts

* handle attribute changes within individual post items

* update swiper post carousel internal posts

* adding script for front end tiny swiper post carousel

* handle front end carousels for post carousel including multiple carousels

* handle updates to external post feed within editor

* handle override navigation class swiper

* linting

* update webpack with removal of unused scripts

* remove commented line

* update snapshot in php unit test

* update cypress tests

* only show swiper when more than one post is available

* fix tests

* update php snapshot

* uncomment test code

* remove coblocks slick asset from editor assets

* Revert "remove coblocks slick asset from editor assets"

This reverts commit d2df8d4.

* add class names to nav buttons post carousel and space between slides

* update post carousel styles to account for wide width and full width

Co-authored-by: Olivier Lafleur <olafleur@godaddy.com>

.dev/tests/phpunit/src/blocks/post-carousel/test-index.php

@@ -67,7 +67,7 @@ public function test_coblocks_render_post_carousel_block() {
 
 
 		$this->assertEquals(
-			'<div class="wp-block-coblocks-post-carousel test-class-name"><div class="coblocks-slick pb-8" data-slick="{&quot;slidesToScroll&quot;:1,&quot;arrow&quot;:true,&quot;slidesToShow&quot;:2,&quot;infinite&quot;:true,&quot;adaptiveHeight&quot;:false,&quot;draggable&quot;:true,&quot;rtl&quot;:false,&quot;responsive&quot;:[{&quot;breakpoint&quot;:1024,&quot;settings&quot;:{&quot;slidesToShow&quot;:3}},{&quot;breakpoint&quot;:600,&quot;settings&quot;:{&quot;slidesToShow&quot;:2}},{&quot;breakpoint&quot;:480,&quot;settings&quot;:{&quot;slidesToShow&quot;:1}}]}"></div></div>',
+			'<div class="wp-block-coblocks-post-carousel external test-class-name"><div class="coblocks-swiper swiper-container pb-8" data-swiper="{&quot;slidesToScroll&quot;:1,&quot;arrow&quot;:true,&quot;slidesToShow&quot;:2,&quot;infinite&quot;:true,&quot;adaptiveHeight&quot;:false,&quot;draggable&quot;:true,&quot;rtl&quot;:false,&quot;responsive&quot;:[{&quot;breakpoint&quot;:1024,&quot;settings&quot;:{&quot;slidesToShow&quot;:3}},{&quot;breakpoint&quot;:600,&quot;settings&quot;:{&quot;slidesToShow&quot;:2}},{&quot;breakpoint&quot;:480,&quot;settings&quot;:{&quot;slidesToShow&quot;:1}}]}"><div class="swiper-wrapper" ></div></div><button class="wp-coblocks-post-carousel-nav-button__prev" id="wp-coblocks-post-carousel-swiper-prev" style="visibility:hidden" /><button class="wp-coblocks-post-carousel-nav-button__next" id="wp-coblocks-post-carousel-swiper-next" style="visibility:hidden" /></div>',
 			coblocks_render_post_carousel_block( $attributes )
 		);
 	}

.dev/tests/phpunit/test-class-coblocks.php

@@ -190,8 +190,6 @@ public function test_final_build_assets_exist() {
 				'dist/js/coblocks-google-recaptcha.js',
 				'dist/js/coblocks-lightbox.js',
 				'dist/js/coblocks-masonry.js',
-				'dist/js/coblocks-slick-initializer-front.js',
-				'dist/js/coblocks-slick-initializer.js',
 				'dist/js/vendors/flickity.js',
 				'dist/js/vendors/slick.js',
 				'src/js/coblocks-accordion-polyfill.js',
@@ -201,8 +199,6 @@ public function test_final_build_assets_exist() {
 				'src/js/coblocks-google-recaptcha.js',
 				'src/js/coblocks-lightbox.js',
 				'src/js/coblocks-masonry.js',
-				'src/js/coblocks-slick-initializer-front.js',
-				'src/js/coblocks-slick-initializer.js',
 			],
 			'css' => [
 				'dist/coblocks-1.css',

includes/class-coblocks-block-assets.php

@@ -403,16 +403,9 @@ public function frontend_scripts() {
 		// Post Carousel block.
 		if ( $this->is_page_gutenberg() || has_block( 'coblocks/post-carousel' ) || has_block( 'core/block' ) ) {
 			wp_enqueue_script(
-				'coblocks-slick',
-				$vendors_dir . '/slick.js',
-				array( 'jquery' ),
-				COBLOCKS_VERSION,
-				true
-			);
-			wp_enqueue_script(
-				'coblocks-slick-initializer-front',
-				$dir . 'coblocks-slick-initializer-front.js',
-				array( 'jquery' ),
+				'coblocks-post-carousel',
+				$dir . 'coblocks-post-carousel.js',
+				array(),
 				COBLOCKS_VERSION,
 				true
 			);