jQuery error (tinyMCE is not defined) on Wordpress

Question

After upgrading Wordpress from 3.2 to 3.5 i am getting jQuery error on admin side. below is the error.

Error: ReferenceError: tinyMCE is not defined
Source File: http://domainname.com/wp-includes/js/tinymce/langs/wp-langs-en.js?ver=345-20111127

Can any one please help me here . Thanks

Answer 1

From the documentation:

Using Your Browser to Diagnose JavaScript Errors

If you're experiencing issues with your interactive functionality this may be due to JavaScript errors or conflicts. For example, your flyout menus may be broken, your metaboxes don't drag, or your add media buttons aren't working. [...] This guide will show you how to diagnose JavaScript issues in different browsers.

• Step 1: Try Another Browser
• Step 2: Enable SCRIPT_DEBUG
• Step 3: Diagnosis
• Step 4: Reporting

Answer 2

It's better to use a declaration:

define('CONCATENATE_SCRIPTS', false); 

in wp-config.php.

Answer 3

For anyone else that comes across this and is pulling their hair out a bit, @dale3h's answer was the solution for me.

If you have a function in your functions.php which hooks into the script_loader_tag filter and doesn't always return the appropriate parts of the original tag markup, or has a bug in it of some kind, it can make some scripts fail to load because scripts to be output to the page are run through this filter first.

Something I've done to avoid this is whitelist script handles depending on what extra attributes I want to give them, so the work can be done conditionally (leaving all other scripts intact):

// Manage extra attibutes for enqueued scripts
function foo_script_extras( $tag, $handle, $src ){

    $whitelist = array(
        'js-font-awesome-core'  => array(
            'sri'   => 'sha384-XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
            'defer' => true
        ),
        'js-font-awesome-light' => array(
            'sri'   => 'sha384-XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
            'defer' => true
        ),
        'js-popper'             => array(
            'sri'   => 'sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ'
        ),
        'js-bootstrap'          => array(
            'sri'   => 'sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm'
        ),
        'js-gtag'               => array(
            'async' => true
        )
    );

    // Construct the script if we want to give it extra attributes
    if( array_key_exists( $handle, $whitelist ) ){

        // Extra markup
        $extra  = '';
        $mods   = $whitelist[$handle];

        // Check for SRI
        if( array_key_exists( 'sri', $mods ) ){
            $extra .= ' integrity="' . $mods['sri'] . '" crossorigin="anonymous"';
        }

        // Check for deferral
        if( array_key_exists( 'defer', $mods ) ){
            $extra .= ' defer';
        }

        // Check for async
        if( array_key_exists( 'async', $mods ) ){
            $extra .= ' async';
        }

        // Reutrn full script tag
        return '<script src="' . $src . '"' . $extra . '"></script>';

    }else{

        // Return the tag as-is otherwise to avoid breaking it
        return $tag;

    }

}
add_filter( 'script_loader_tag', 'foo_script_extras', 10, 3 );

This is not a terribly general solution in terms of checking for which attributes to add to the whitelisted handles, and I would have used something along the lines of "for each attribute of a whitelisted handle, add the key if it's a bool and is true, else add it's value" but SRI needs two attributes (integrity and crossorigin) so I've left it for now.

Additionally, if you don't see /wp-includes/js/tinymce/ somewhere in your page markup (similar to what @Mar said, but the exact script name can change between versions it seems) then that script ain't loading!

Answer 4

In my situation, disabling the defer javascript enhancements that I made in functions.php caused this error to disappear when loading edit pages.

Answer 5

After reading a million posts about turning everything off, reinstalling everything, waving chicken bones over my keyboard and throwing salt over my shoulder, I decided to get serious.

tinyMCE is not defined means exactly that. Assumption: it never got loaded. Check the page source for http://yourdomain.com/wp-includes/js/tinymce/tiny_mce.js?ver=359-20131026'> or some other script tag for tiny_mce.js. I bet you don't have one. If you do, this is not the solution for you. If you don't, read on.

I located the code that should be placing the js tag in your page in ...\wp-includes\class-wp-editor.php.

There is an if block "if ( $compressed ) {..." that will load ...\wp-includes\js\tinymce\wp-tinymce.php into the js tag (doesn't work) when $compressed = 1, or ...\wp-includes\js\tinymce\tiny_mce.js when $compressed = 0. So I set $compressed = 0 just before the if block to force the else. That fixed my problem.

It's an easy fix and if it doesn't solve your issue it is easily reversed without risking breaking anything else in the WP ecosphere.