Enqueue the registered scripts from block.json (#2566)

* enqueue the registered scripts from block.json * fix the test
godaddy-wordpress · Sep 7, 2023 · a3dda77 · a3dda77
1 parent 09cc42f
commit a3dda77
Show file tree

Hide file tree

Showing 9 changed files with 85 additions and 3 deletions.
diff --git a/includes/class-coblocks-block-assets.php b/includes/class-coblocks-block-assets.php
@@ -449,7 +449,7 @@ public function frontend_scripts() {
 		// Post Carousel block script.
 		wp_register_script(
 			'coblocks-post-carousel',
-			$this->assets_dir . 'coblocks-post-carousel.js',
+			$this->assets_dir . 'coblocks-post-carousel-script.js',
 			array(),
 			COBLOCKS_VERSION,
 			true
@@ -467,7 +467,7 @@ public function frontend_scripts() {
 		// Events block.
 		wp_register_script(
 			'coblocks-events',
-			$this->assets_dir . 'coblocks-events.js',
+			$this->assets_dir . 'coblocks-events-script.js',
 			array(),
 			COBLOCKS_VERSION,
 			true

diff --git a/src/blocks/counter/block.json b/src/blocks/counter/block.json
@@ -44,5 +44,6 @@
 			}
 		}
 	},
-	"editorScript": ["coblocks-13"]
+	"editorScript": ["coblocks-13"],
+	"viewScript": ["coblocks-counter-script"]
 }
diff --git a/src/blocks/counter/test/counter.cypress.js b/src/blocks/counter/test/counter.cypress.js
@@ -102,4 +102,25 @@ describe( 'Test CoBlocks Counter Block', function() {
 
 		helpers.checkForBlockErrors( 'coblocks/counter' );
 	} );
+
+	/**
+	 * Test that we can add counter block and use locale formatting controls
+	 * and save block without errors.
+	 */
+	it( 'Test counter block properly enqueues its scripts.', function() {
+		helpers.addBlockToPost( 'coblocks/counter', true );
+
+		cy.get( '.wp-block-coblocks-counter.rich-text' ).first().focus().type( counterData.counterText );
+		cy.get( '.wp-block-coblocks-counter.rich-text' ).last().focus().type( counterData.counterDescription );
+		cy.get( '.wp-block-coblocks-counter.rich-text' ).first().contains( '10000 hours' );
+
+		helpers.savePage();
+		helpers.checkForBlockErrors( 'coblocks/counter' );
+
+		helpers.viewPage();
+
+		cy.get( "script[src*='coblocks-counter-script']" );
+
+		helpers.editPage();
+	} );
 } );
diff --git a/src/blocks/events/block.json b/src/blocks/events/block.json
@@ -32,5 +32,6 @@
 	"textdomain": "coblocks",
 	"description": "Add a list of events or display events from a public calendar.",
 	"editorScript": ["coblocks-2"],
+	"viewScript": ["coblocks-tiny-swiper","coblocks-events"],
 	"render": "index.php"
 }
diff --git a/src/blocks/events/test/events.cypress.js b/src/blocks/events/test/events.cypress.js
@@ -75,4 +75,22 @@ describe( 'Block: Events', function() {
 
 		helpers.checkForBlockErrors( 'coblocks/events' );
 	} );
+
+	/**
+	 * Test the events block saves with custom classes
+	 */
+	it( 'properly enqueues scripts', function() {
+		// Workaround for the advanced panel not loading consistently.
+		cy.get( '.editor-post-title' ).click();
+
+		helpers.checkForBlockErrors( 'coblocks/events' );
+
+		helpers.savePage();
+		helpers.viewPage();
+
+		cy.get( "script[src*='coblocks-events-script']" );
+		cy.get( "script[src*='tiny-swiper']" );
+
+		helpers.editPage();
+	} );
 } );
diff --git a/src/blocks/gist/block.json b/src/blocks/gist/block.json
@@ -19,5 +19,6 @@
 	"title": "Gist",
 	"textdomain": "coblocks",
 	"editorScript": ["coblocks-9"],
+	"viewScript": ["coblocks-gist-script"],
 	"description": "Embed a GitHub Gist."
 }
diff --git a/src/blocks/gist/test/gist.cypress.js b/src/blocks/gist/test/gist.cypress.js
@@ -22,4 +22,26 @@ describe( 'Test CoBlocks Gist Block', function() {
 
 		helpers.checkForBlockErrors( 'core/embed' );
 	} );
+
+	/**
+	 * Test that we can add counter block and use locale formatting controls
+	 * and save block without errors.
+	 */
+	it( 'Test embedded gist properly enqueues its scripts.', function() {
+		helpers.addBlockToPost( 'core/embed', true );
+
+		cy.get( '.wp-block-embed .components-placeholder__input' ).type( 'https://gist.github.com/jrtashjian/98c1fcfd0e9f9ed59d710ccf7ef4291c#file-block-variation-js' );
+		cy.get( '.wp-block-embed .components-button.is-primary' ).click();
+
+		cy.get( '.components-sandbox' ).should( 'exist' );
+
+		helpers.savePage();
+		helpers.checkForBlockErrors( 'core/embed' );
+
+		helpers.viewPage();
+
+		cy.get( "script[src*='coblocks-gist-script']" );
+
+		helpers.editPage();
+	} );
 } );
diff --git a/src/blocks/post-carousel/block.json b/src/blocks/post-carousel/block.json
@@ -75,5 +75,6 @@
 	"textdomain": "coblocks",
 	"description": "Display posts or an external blog feed as a carousel.",
 	"editorScript": ["coblocks-11"],
+	"viewScript": ["coblocks-tiny-swiper","coblocks-post-carousel"],
 	"render": "index.php"
 }
diff --git a/src/blocks/post-carousel/test/post-carousel.cypress.js b/src/blocks/post-carousel/test/post-carousel.cypress.js
@@ -75,4 +75,21 @@ describe( 'Test CoBlocks Post Carousel Block', function() {
 
 		helpers.editPage();
 	} );
+
+	/**
+	 * Test the post-carousel block saves with custom classes
+	 */
+	it( 'Test the post-carousel properly enqueues its scripts.', function() {
+		helpers.addBlockToPost( 'coblocks/post-carousel', true );
+
+		helpers.savePage();
+		helpers.checkForBlockErrors( 'coblocks/post-carousel' );
+
+		helpers.viewPage();
+
+		cy.get( "script[src*='coblocks-post-carousel-script']" );
+		cy.get( "script[src*='tiny-swiper']" );
+
+		helpers.editPage();
+	} );
 } );