Cloudflare's Rocket Loader + Wordpress -> Ignore scripts?

Question

I'm trying to make Cloudflare's Rocket Loader work on my WP site. Everything works fine except for the WP Visual Editor. I followed the advice here but it doesn't work:

How do I add custom attributes to javascript tags in Wordpress?

Cloudflare says that in order to make Rocket Loader ignore a javascript file I need to add the data-cfasync="false" tag before my script:

<script data-cfasync="false" src="/javascript.js"></script>    

https://support.cloudflare.com/entries/22063443--How-can-I-have-Rocket-Loader-ignore-my-script-s-in-Automatic-Mode-

Rocket loader doesn't ignore my JS files.

Here's my code:

function rocket_loader_attributes( $url )
{
$ignore = array (

'http://www.mysite.com/wp-includes/js/tinymce/tiny_mce.js?ver=349-21274',
'http://www.mysite.com/wp-admin/js/editor.js?ver=3.4.2'

);
if ( in_array( $url, $ignore ) )
{ // this will be ignored
return "$url' data-cfasync='false";
}

return $url;
}
add_filter( 'clean_url', 'rocket_loader_attributes', 11, 1 );

What is wrong with my code?

I'm currently using Rocket Loader on Automatic mode.

Can anyone help?

@toscho if you see this maybe you can point me in the right direction.

Thank you.

Answer 1

Notice in the example that the tag does not have the type='text/javascript' attribute. For some reason Rocket Loader requires data-cfasync='false' to be used without the type='text/javascript'... a bug?

Your code does add the data-cfasync='false' attribute, but does not override the WordPress behaviour of adding the type='text/javascript' attribute also, which makes Rocket Loader not to "ignore" your script.

It might be tricky to override this WordPress behaviour since the relevant code does not support a filter...

Answer 2

You can achieve the desired result with the following function (replace script-handle with your script's handle):

add_filter( 'script_loader_tag', function ( $tag, $handle ) {

    if ( 'script-handle' !== $handle )
        return $tag;

    return str_replace( "type='text/javascript' src", ' data-cfasync="false" src', $tag     );
}, 10, 2 );

The above WordPress filter grabs a script by it's handle and allows you to add/edit script attributes.