Permalink
Browse files

Merge pull request #2622 from SergioCrisostomo/fix-2265-ieStyleText

Fix setter so IE7/8 can set text of style element
  • Loading branch information...
ibolmo committed Jul 4, 2014
2 parents e0a608e + dbabf06 commit d1dce0f25dbd69b14572fe264393139730844b98
Showing with 62 additions and 3 deletions.
  1. +39 −3 Source/Element/Element.js
  2. +23 −0 Specs/Element/Element.js
View
@@ -214,12 +214,33 @@ var escapeQuotes = function(html){
};
/*</ltIE8>*/
/*<ltIE9>*/
// #2479 - IE8 Cannot set HTML of style element
var canChangeStyleHTML = (function(){
var div = document.createElement('style'),
flag = false;
try {
div.innerHTML = '#justTesing{margin: 0px;}';
flag = !!div.innerHTML;
} catch(e){}
return flag;
})();
/*</ltIE9>*/
Document.implement({
newElement: function(tag, props){
if (props){
if (props.checked != null) props.defaultChecked = props.checked;
if ((props.type == 'checkbox' || props.type == 'radio') && props.value == null) props.value = 'on';
/*<ltIE9>*/ // IE needs the type to be set before changing content of style element
if (!canChangeStyleHTML && tag == 'style'){
var styleElement = document.createElement('style');
styleElement.setAttribute('type', 'text/css');
if (props.type) delete props.type;
return this.id(styleElement).set(props);
}
/*</ltIE9>*/
/*<ltIE8>*/// Fix for readonly name and type properties in IE < 8
if (createElementAcceptsHTML){
tag = '<' + tag;
@@ -531,13 +552,28 @@ properties.text = (document.createElement('div').textContent == null) ? 'innerTe
Object.forEach(properties, function(real, key){
propertySetters[key] = function(node, value){
node[real] = value;
node[real] = value;

This comment has been minimized.

Show comment
Hide comment
@arian

arian Jul 4, 2014

Member

WHITESPACE 😱

@arian

arian Jul 4, 2014

Member

WHITESPACE 😱

This comment has been minimized.

Show comment
Hide comment
@ibolmo

ibolmo Jul 4, 2014

Member

lmao. one sec

@ibolmo

ibolmo Jul 4, 2014

Member

lmao. one sec

};
propertyGetters[key] = function(node){
return node[real];
};
});
/*<ltIE9>*/
propertySetters.text = (function(setter){
return function(node, value){
if (node.get('tag') == 'style') node.set('html', value);
else node[properties.text] = value;
};
})(propertySetters.text);
propertyGetters.text = (function(getter){
return function(node){
return (node.get('tag') == 'style') ? node.innerHTML : getter(node);
};
})(propertyGetters.text);
/*</ltIE9>*/
// Booleans
var bools = [
@@ -599,7 +635,7 @@ el = null;
/*<ltIE9>*/
// #2479 - IE8 Cannot set HTML of style element
var canChangeStyleHtml = (function(){
var canChangeStyleHTML = (function(){
var div = document.createElement('style'),
flag = false;
try {
@@ -1034,7 +1070,7 @@ Element.Properties.html = {
else if (typeOf(html) == 'array') html = html.join('');
/*<ltIE9>*/
if (this.styleSheet && !canChangeStyleHtml) this.styleSheet.cssText = html;
if (this.styleSheet && !canChangeStyleHTML) this.styleSheet.cssText = html;
else /*</ltIE9>*/this.innerHTML = html;
},
erase: function(){
View
@@ -1866,6 +1866,29 @@ describe('Element.set("html")', function(){
styleElement.destroy();
});
it('should set the text of a style Element', function(){
var docHead = $(document.head);
var styleElement = new Element('style', {type: 'text/css'}).inject(docHead);
var definition = [
'.pos-abs-left {',
'position: absolute;',
'width: 200px;',
'height: 200px;',
'left: 10%;',
'background: red;',
'}'
].join('');
styleElement.set('text', definition);
var returned = styleElement.get('text').toLowerCase();
expect(returned.indexOf('position: absolute')).not.toEqual(-1);
expect(returned.indexOf('width: 200px')).not.toEqual(-1);
expect(returned.indexOf('height: 200px')).not.toEqual(-1);
expect(returned.indexOf('left: 10%')).not.toEqual(-1);
expect(returned.indexOf('background: red')).not.toEqual(-1);
styleElement.destroy();
});
});
describe('Elements.empty', function(){

0 comments on commit d1dce0f

Please sign in to comment.