Hi All,

The issue which we are facing is on mozilla firefox below is our document


When we select the content form the document like below:


var iframe= document.getElementById('PreviewDoc');
var idoc= iframe.contentDocument || iframe.contentWindow.document; // ie compatibility
var sel = idoc.getSelection();

According to above code we are getting the value of sel.rangeCount is 1 on Chrome and IE and everything is working fine.

In case of Firefox we are getting the value of sel.rangeCount is 3. and according to below code we are appending sel.getRangeAt(i).cloneContents() to container div by loop through rangeCount -

var parentNode = document.createElement("div");
var container = document.createElement("div");

if (typeof idoc.getSelection != "undefined") {
var sel = idoc.getSelection();
if (sel.rangeCount) {
for (var i = 0, len = sel.rangeCount; i < len; ++i) {

var strHTM=CleanContent(parentNode.innerHTML);
html = convertProblemCharacters(strHTM,false);


And we are getting the container with defferend views i.e. when one range is appended to container, all the closing tags are automatically appended to the container which have selected by sel.getRangeAt(i).cloneContents().

We don't know why we are getting the value of sel.rangeCount to 3.

Is there any way to get value of sel.rangeCount to 1 on firefox or is there any other function in ExtJS because we are using ExtJS also?