Merge pull request #16 from stellarwp/fix/tag-replacement-for-modules

Fix/tag replacement for modules

assets.php

@@ -2,7 +2,7 @@
 /**
  * Plugin Name: Assets
  * Description: Asset library with a plugin bootstrap file for automated testing.
- * Version: 1.2.5
+ * Version: 1.2.6
  * Author: StellarWP
  * Author URI: https://stellarwp.com
  */

src/Assets/Assets.php

@@ -459,16 +459,18 @@ public function filter_tag_async_defer( $tag, $handle ) {
 	/**
 	 * Filters the Script tags to attach type=module based on the rules we set in our Asset class.
 	 *
-	 * @param string $tag Tag we are filtering.
+	 * @since 1.0.0
+	 * @since 1.2.6
+	 *
+	 * @param string $tag    Tag we are filtering.
 	 * @param string $handle Which is the ID/Handle of the tag we are about to print.
 	 *
 	 * @return string Script tag with the type=module
-	 * @since 1.0.0
-	 *
 	 */
 	public function filter_modify_to_module( $tag, $handle ) {
-		// Only filter for own own filters.
-		if ( ! $asset = $this->get( $handle ) ) {
+		$asset = $this->get( $handle );
+		// Only filter for our own filters.
+		if ( ! $asset ) {
 			return $tag;
 		}
 
@@ -482,16 +484,15 @@ public function filter_modify_to_module( $tag, $handle ) {
 			return $tag;
 		}
 
-		// These themes already have the `type='text/javascript'` added by WordPress core.
-		if ( ! current_theme_supports( 'html5', 'script' ) ) {
-			$replacement = 'type="module"';
-
-			return str_replace( "type='text/javascript'", $replacement, $tag );
+		// Remove the type attribute if it exists.
+		preg_match( "/ *type=['\"]{0,1}[^'\"]+['\"]{0,1}/i", $tag, $matches );
+		if ( ! empty( $matches ) ) {
+			$tag = str_replace( $matches[0], '', $tag );
 		}
 
 		$replacement = '<script type="module" ';
 
-		return str_replace( '<script ', $replacement, $tag );
+		return str_replace( '<script', $replacement, $tag );
 	}
 
 	/**

tests/acceptance/EnqueueJSCest.php

@@ -58,6 +58,27 @@ public function it_should_enqueue_from_alternate_path_with_js_in_path( Acceptanc
 		$I->seeElement( 'script', [ 'src' => 'http://wordpress.test/wp-content/plugins/assets/tests/_data/other-asset-root/js/fake-alt.js?ver=1.0.0' ] );
 	}
 
+	public function it_should_enqueue_script_as_module( AcceptanceTester $I ) {
+		$code = file_get_contents( codecept_data_dir( 'enqueue-template.php' ) );
+		$code .= <<<PHP
+		add_action( 'wp_enqueue_scripts', function() {
+			Asset::add( 'fake-js', 'fake.js' )
+				->enqueue_on( 'wp_enqueue_scripts' )
+				->set_as_module( true )
+				->register();
+			Asset::add( 'fake3-js', 'fake3.js' )
+				->enqueue_on( 'wp_enqueue_scripts' )
+				->register();
+		}, 100 );
+		PHP;
+
+		$I->haveMuPlugin( 'enqueue.php', $code );
+
+		$I->amOnPage( '/' );
+		$I->seeElement( 'script', [ 'src' => 'http://wordpress.test/wp-content/plugins/assets/tests/_data/js/fake.js?ver=1.0.0', 'type' => 'module' ] );
+		$I->seeElement( 'script', [ 'src' => 'http://wordpress.test/wp-content/plugins/assets/tests/_data/js/fake3.min.js?ver=1.0.0' ] );
+	}
+
 	public function it_should_enqueue_min( AcceptanceTester $I ) {
 		$code = file_get_contents( codecept_data_dir( 'enqueue-template.php' ) );
 		$code .= <<<PHP