Teaser Break: IE8: JavaScript error

I'm assigning this to me. Once again, this has something to do with inserting comments. What fixed it for IE6 and IE7 wasn't enough for IE8 I guesś...
See #404532: TinyMCE/FCKeditor: Teaser break vanishes in IE6/7 for reference. I'll not mark this as duplicate since the consequences are much more severe here because an exception is actually triggered.
And there's a slight chance that it's not exactly the same bug, but still related.

Of course I forgot to actually do it...

I wonder whether jQuery might handle this correctly already? I.e.

     // document.createComment() required or IE will strip the comment.
-    $('img.wysiwyg-break', $content).replaceWith(document.createComment('break'));
+    $('img.wysiwyg-break', $content).replaceWith($('<!--break-->'));

At least, it feels a bit strange that we need to "invent" all of this...

Hm... Additionally, there is a conflict in this bug report with the actual error message. That code (line 51) belongs to

   * Replace images with <!--break--> tags in content upon detaching editor.

but the original post states that the detaching works, but not the attaching...?

Line 46 in break.js is * Replace images with <!--break--> tags in content upon detaching editor.
Line 51 in break.js is $('img.wysiwyg-break', $content).replaceWith(document.createComment('break'));.

I believe that what jofje meant was that the attaching works (as he can edit content, but changes do not stick) but after inserting a Teaser Break, or if one is already present, that error pops up when he disables rich text editing or submits the page, which is when detachment occurs. At least those where the symptoms I saw in IE8 and the debugger.

I've tested $('img.wysiwyg-break', $content).replaceWith($('<!--break-->')); in IE6 and it just removes the comment...
document.createComment('break') should be the correct way to do this, but for some reason IE8 doesn't play nice.
I've read about some issues where elements created the main document in IE8 and then inserted into an iframe will break things because they don't have the same owner document.
I'm unsure if this is related to that though.

I'll be able to continue debugging this in about an hour when I get my netbook back.

Ah, yes. The plugins are detached once upon attaching the editor (triggered internally by FCKeditor), which is why the error appears when jofje opens the page and there's already a teaser break in there.

The changes won't stick because the plugin detach code is called (and fails) during editor detachment which was initiated onSubmit. Because the plugin code fails, FCKeditor doesn't complete its onSubmit routine and the textarea isn't updated with the changed contents.

I have found a solution to the above problem: do not use jQuery to insert the comment, use the appropriate DOM methods instead.

I'm having problems tracing the exact source of the problem within the guts of jQuery. As soon as I try to insert the comment using jQuery it breaks in the clean method. When comparing the constructor of the inserted element to Number it says that .constructor is an invalid pointer. Why I don't know, but I can't seem to avoid it by other means than simplifying the operation down to not using jQuery for the actual element insertion. Since the operation is pretty straight forward and not likely to fail, I foresee no problems with this.

Tested in IE6/8 and FF3.

Some cleanups and clarifications, once again thanks to Sun. =)

Oops, wrong file. I'm not having much luck with this upload form, and probably shouldn't write code this late...

Some more changes, finally done.

Committed, with the addition of a few semicolons which kept eluding me. =)

@TwoD: For 2.x, you also need a checkout of DRUPAL-5--2 ;)

Also committed to 5.x-2.x.

Oh, right, thanks!

I was using FCKeditor at the time of writing #6, but of course this applies to any editor supporting Drupal plugins like Teaser Break, as they would all run that code.