Ext.dom.Element replaceWith throw exception
Ext version tested:
Browser versions tested against:- IE10 (in navigator mode: 7, 8, 9, 10
- FF 16.0.2 (firebug 1.10.5 installed)
DOCTYPE tested against:- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Description:- when call replaceWith on an element. the browser throw an excepetion (depend of the browser)
Steps to reproduce the problem:
The result that was expected:- no error in the javascript console
The result that occurs instead:- an error
- ie : DOM Exception: HIERARCHY_REQUEST_ERR (3)
- NS_ERROR_XPC_BAD_CONVERT_JS: Could not convert JavaScript argument arg 0 [nsIDOMHTMLDivElement.insertBefore]<br>ext-all-dev.js<br>Line 19567
Test Case:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title id='title'>Title</title>
<!-- ** CSS ** -->
<!-- base library -->
<link rel="stylesheet" type="text/css" href="../libs/ext-4.1.2.1/resources/css/ext-all.css" />
<!-- ** Javascript ** -->
<!-- base library -->
<script type="text/javascript" src="../libs/ext-4.1.2.1/ext-all-dev.js"></script>
<!-- page specific -->
<!-- overrides to base library -->
<script type="text/javascript">
/** patch * /
Ext.define('Ext.dom.AbstractElement-fix-replaceWith', {
override: 'Ext.dom.AbstractElement',
replaceWith: function (el) {
var
me = this;
if(el.nodeType || el.dom || typeof el == 'string'){
el = Ext.getDom(el);
me.dom.parentNode.insertBefore(el, me.dom);
}else{
el = Ext.core.DomHelper.insertBefore(me.dom, el);
}
Ext.removeNode(me.dom);
delete Ext.cache[me.id];
me.id = Ext.id(me.dom = el);
Ext.dom.AbstractElement.addToCache(me.isFlyweight ? new Ext.dom.AbstractElement(me.dom) : me);
return me;
}
});
/* */
</script>
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = '../libs/ext-4.1.2.1/resources/images/default/s.gif';
Ext.onReady(function() {
Ext.get("world").replaceWith("sencha");
}); //end onReady
</script>
</head>
<body>
<div>test:<br >
<div id="sencha">Sencha</div>
<div>hello <div id="world">world</div></div>
</div>
</body>
</html>
un-comment fix to see the workaround in action
Debugging already done:- The error come from the call of me.dom.parentNode.insertBefore the first param given is an Ext.domElement and not a dom object.
Possible fix:
Operating System:
