TinyMCE vs. Internet Explorer 9 (IE9) – Problem Solved

We’ve noticed that the release of IE9 has caused a number of problems for a number of web sites and web tools. One of these problems is that TinyMCE, the popular WYSIWIG (What you see is what you get) editor simply won’t work in IE9. A number of clients were complainging about this and we decided to see if we could come up with a solution to the problem of TinyMCE causing errors in Internet Explorer 9.

So if you find that your TinyMCE editor no longer works in IE9 and you don’t want to upgrade your editor (maybe because you’ve create custom plugins) look no further, we have a solution for you.

Open tiny_mce.js

If you open the file tiny_mce.js and go to line 5000, you will find the following code:
if (isIE){

Change this to:

if (isIE && typeof(duplicate) != "undefined") {

The function duplicate() causes an error, that’s why we had to change that if statement. This fixes the error with duplicate() but now we’re getting a new error. This time it’s about the nodeName.

Around line 5000 you will also find:

 if (e.nodeName == 'BODY')

This error is fixed by replacing it with the following code:

if (e && e.nodeName == 'BODY')

Now the only problem is that the text is not selectable in IE9. Take a look at around line 7730:

m.add({
title : t.settings.title,
'class' : 'mceMenuItemTitle',
onclick : function() {
if (t.settings.onselect('') !== false)
t.select(''); // Must be runned after
}
});

So as you can see, it will say t.select(”); just get rid of that, and it will work; the new code will be:

 m.add({
title : t.settings.title,
'class' : 'mceMenuItemTitle'
});

That should do it! Hope this helps some people that found themselves in a similar situation.