Cloned inputs get random huge height attribute in IE

[SkyFlyer]

When element is cloned in IE7 then its child nodes would have height and width (default 0) added to it. FF works fine, but I didn't test it in other browsers.

Here is an example with build 1438.
http://www.armtown.com/test/dialog3.html

[Devign]

This happened to me too, on IE6
It seems like only <input>s' height attribute is given wrong. On other elements such as <div> it was ok. Any access to height attribute gives random huge number, even when explicitly written in the element.

<script type="text/javascript">
window.addEvent("domready",function () {
	$("log").adopt(
		new Element("div",{text:$("x").height}), // value = 49032112
		new Element("div",{text:$("x").height}), // value = 48987912
		new Element("div",{text:$("x").height}), // 49004248
		new Element("div",{text:$("y").height}) // 49028096 even specified 10
	);

	var clone=$("x").clone(true);
	new Element("div",{text:clone.height}) // value = 49086463
		.inject("cloneHere","top");
	clone.inject("cloneHere");

	$("y").clone(true).inject("cloneHere"); // renders correctly with small height

});
</script>
<input type="text" id="x" style="width:100px;"/>
<input type="text" id="y" style="width:100px;" height="10"/>
<div id="log"></div>
<div id="cloneHere" style="background-color:#93B9CE;"></div>

[Devign]

Apparently height is not even valid attribute to <input> by Microsoft.

http://msdn2.microsoft.com/en-us/library/ms535841.aspx

So why it's still returned in the attributes collection and a random number?

A workaround could be adding

if (this.nodeName.toLowerCase()=="input" && key=="height") continue;

to the clone method at the for loop over 'this.attributes'.

[tomocchino]

since height is not a valid attribute for input elements, im closing this ticket as invalid

[Devign]

The default behavior is still not proper and nothing can be done to fix it.

<div><input type="text" name="x" /></div>
<div id="placeholder"></div>

<script type="text/javascript">
window.addEvent("domready",function () {
	$("placeholder").grab($("x").clone());
});
</script>

It's an IE bug and I think it should be treated like many other browser specific issues such as opera and class inheritance, ie6's BackgroundImageCache?, input with name/type/checked creation etc.

Look at this native JS code at IE:

<script type="text/javascript">
alert(document.createElement("input").height);
</script>

It will alert random number every time, and when setting this height property through the Element::clone method, it makes the input huge.

I suggest Clone method should look like:

	clone: function(contents, keepid){
		switch ($type(this)){
			case 'element':
				var attributes = {};
				for (var j = 0, l = this.attributes.length; j < l; j++){
					var attribute = this.attributes[j], key = attribute.nodeName.toLowerCase();
					if (Browser.Engine.trident && this.nodeName.toLowerCase()=="input" && key=="height") continue;
					var value = (key == 'style' && this.style) ? this.style.cssText : attribute.nodeValue;
					if (!$chk(value) || key == 'uid' || (key == 'id' && !keepid)) continue;
					if (value != 'inherit' && ['string', 'number'].contains($type(value))) attributes[key] = value;
				}
				var element = new Element(this.nodeName.toLowerCase(), attributes);
				if (contents !== false){
					for (var i = 0, k = this.childNodes.length; i < k; i++){
						var child = Element.clone(this.childNodes[i], true, keepid);
						if (child) element.grab(child);
					}
				}
				return element;
			case 'textnode': return document.newTextNode(this.nodeValue);
		}
		return null;
	},

[tomocchino]

fixed in r1552