blob: 6fba55d6d5b195acd0e19503b7ecb9af66dd88a3 [file] [log] [blame]
<html>
<body>
<script>
var docToAppendTo;
function addTextarea(properties, opt_innerHTML) {
var title = docToAppendTo.createTextNode();
title.nodeValue = '';
var wrapper = docToAppendTo.createElement('div');
wrapper.style.cssText = 'display:inline-block;border:1px solid blue;font-size:12px;';
var textarea = docToAppendTo.createElement('textarea');
for (property in properties) {
var value = properties[property];
title.nodeValue += property + ': "' + value + '", ';
if (property == 'wrap')
textarea.setAttribute(property, value);
else if (property == 'style')
textarea.style.cssText = value;
else
textarea[property] = value;
}
textarea.innerHTML = opt_innerHTML ||
"Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv";
var span = document.createElement('span');
span.style.cssText = 'display:inline-block;width:80px;';
span.appendChild(title);
wrapper.appendChild(span);
wrapper.appendChild(document.createElement('br'));
wrapper.appendChild(textarea)
docToAppendTo.body.appendChild(wrapper);
}
function addAllTextareas(iframe, compatMode) {
iframe.style.cssText = 'width:100%;border:0;'
docToAppendTo = iframe.contentWindow.document;
docToAppendTo.body.style.cssText = 'margin:0';
if (docToAppendTo.compatMode != compatMode)
testFailed('This document should be in ' + compatMode + ' mode.');
var compatModeTitle = docToAppendTo.createElement('div');
compatModeTitle.innerHTML = 'CompatMode: ' + docToAppendTo.compatMode;
compatModeTitle.style.cssText = 'margin:5px 0;font-weight:bold;';
docToAppendTo.body.appendChild(compatModeTitle);
addTextarea({}, 'Lorem ipsum dolor');
addTextarea({disabled: 'true'});
addTextarea({style: 'padding:10px'});
addTextarea({style: 'padding:0px'});
addTextarea({style: 'margin:10px'});
addTextarea({style: 'margin:0px'});
addTextarea({style: 'width:60px'});
addTextarea({style: 'width:60px; padding:20px'});
addTextarea({style: 'width:60px; padding:0'});
addTextarea({style: 'height:60px'});
addTextarea({style: 'width:60px; height:60px'});
addTextarea({style: 'overflow:hidden'});
addTextarea({style: 'overflow:scroll'});
addTextarea({style: 'overflow:hidden; width:60px; height:60px'});
addTextarea({style: 'overflow:scroll; width:60px; height:60px'});
addTextarea({cols: 5, style: 'width:60px; height:60px'});
addTextarea({rows: 4, style: 'width:60px; height:60px'});
addTextarea({cols: 5, rows: 4, style: 'width:60px; height:60px'});
addTextarea({cols: 3});
addTextarea({rows: 3});
addTextarea({cols: 7});
addTextarea({rows: 7});
addTextarea({cols: 5, rows: 4});
addTextarea({wrap: 'off'});
addTextarea({wrap: 'hard'});
addTextarea({wrap: 'soft'});
addTextarea({style: 'white-space:normal'});
addTextarea({style: 'white-space:pre'});
addTextarea({style: 'white-space:prewrap'});
addTextarea({style: 'white-space:nowrap'});
addTextarea({style: 'white-space:pre-line'});
addTextarea({style: 'word-wrap:normal'});
addTextarea({wrap: 'off', style: 'white-space:pre-wrap'});
iframe.style.height = docToAppendTo.body.offsetHeight + 5 + 'px';
}
document.body.style.margin = 0;
var standardsIframe = document.createElement('iframe');
// Reference a page with a doctype so it's standards mode.
standardsIframe.src = 'resources/basic-textareas-standards.html';
standardsIframe.onload = function(e) {
addAllTextareas(e.target, 'CSS1Compat');
}
document.body.appendChild(standardsIframe);
var quirksIframe = document.createElement('iframe');
quirksIframe.onload = function(e) {
addAllTextareas(e.target, 'BackCompat');
}
document.body.appendChild(quirksIframe);
</script>
</body>
</html>