Setting of innerHTML on a domNode in FF4 does not properly cleanup style nodes

This issue only appears in FF4 and probably should be filed with Mozilla, but I 
think there should be a fix for this in the Closure library until it get fixed 
in Firefox4

What steps will reproduce the problem?
1. Go to the demo page for the rich text editor 
(http://closure-library.googlecode.com/svn/trunk/closure/goog/demos/editor/edito
r.html)

2. In the rich text field paste text in from MS Word or any other document that 
contains html with a style tag inside 

3. In the box below the rich text field type a simple text

4. Hit the 'Set field content' button

5. See how the 'Current content field' box not only contains your text from the 
third step, but also the style from the word document.

What is the expected output? What do you see instead?
See step 5

What version of the product are you using? On what operating system?
FF4 on a Mac, using whatever version of Closure is currently available on the 
demo pages

Please provide any additional information below.
There is also not proper detection of Firefox4. If you use FF4 the userAgent 
version is set to 2. This makes a workaround difficult.

There is a workaround, though:
In goog.editor.Field.prototype.injectContents before you set the innerHTML on 
the field, first clear it out. That properly deletes the style tag from thew 
field.

goog.editor.Field.prototype.injectContents = function(contents, field) {
  var styles = {};
  var newHtml = this.getInjectableContents(contents, styles);
  goog.style.setStyle(field, styles);
+ field.innerHTML = '';  
  field.innerHTML = newHtml;
};

Original issue reported on code.google.com by jtuchsch...@gmail.com on 25 Apr 2011 at 8:52

shinjixxxxx / closure-library

Setting of innerHTML on a domNode in FF4 does not properly cleanup style nodes #315