[2.2] IE 7 Error with cssText assignment

[nak1]

We ran into an error on the ext-all.js. It gives us an error stating: 'invalid procedure call or argument'

I've debugged the problem and it turns out that on line 26 of ext-all.js there is a method:

Ext.util.CSS=function(){var D=null;var C=document;var B=/(-[a-z])/gi;var A=function(E,F){return F.charAt(1).toUpperCase()};return{createStyleSheet:function(G,J){var F;var E=C.getElementsByTagName("head")[0];var I=C.createElement("style");I.setAttribute("type","text/css");if(J){I.setAttribute("id",J)}if(Ext.isIE){E.appendChild(I);F=I.styleSheet;F.cssText=G}else{try{I.appendChild(C.createTextNode(G))}catch(H){I.cssText=G}E.appendChild(I);F=I.styleSheet?I.styleSheet:(I.sheet||C.styleSheets[C.styleSheets.length-1])}this.cacheStyleSheet(F);return F}

For some reason F.cssText=G assignment is unable to be preformed. As if F.cssText was a private attribute. Any thoughts?

[Condor]

Always debug using ext-all-debug.js!

Then you would have known that the actual line was:

   createStyleSheet : function(cssText, id){
       var ss;
       var head = doc.getElementsByTagName("head")[0];
       var rules = doc.createElement("style");
       rules.setAttribute("type", "text/css");
       if(id){
           rules.setAttribute("id", id);
       }
       if(Ext.isIE){
           head.appendChild(rules);
           ss = rules.styleSheet;
           ss.cssText = cssText;
       }else{

Are you creating the stylesheet after the DOM is ready?

[nak1]

Condor, I'm using a user defined object called: Ext.ux.ManagedIFrame and the error is generating from this statement below:

Ext.onReady( function(){
  //Generate CSS Rules but allow for overrides.
    var CSS = Ext.util.CSS, rules=[];

    CSS.getRule('.x-managed-iframe') || ( rules.push('.x-managed-iframe {height:100%;width:100%;overflow:auto;}'));
    CSS.getRule('.x-managed-iframe-mask')||(rules.push('.x-managed-iframe-mask{width:100%;height:100%;position:relative;}'));
    if(!CSS.getRule('.x-frame-shim')){
        rules.push('.x-frame-shim {z-index:8500;position:absolute;top:0px;left:0px;background:transparent!important;overflow:hidden;display:none;}');
        rules.push('.x-frame-shim-on{width:100%;height:100%;display:block;zoom:1;}');
        rules.push('.ext-ie6 .x-frame-shim{margin-left:5px;margin-top:3px;}');
    }
    CSS.getRule('.x-hide-nosize') || (rules.push('.x-hide-nosize,.x-hide-nosize *{height:0px!important;width:0px!important;border:none;}'));

    if(!!rules.length){
        CSS.createStyleSheet(rules.join(' '));
    }
});

[nak1]

I think I just solved the issue, there was a !! in the last call there. Must be a typo.

N

[powerbart]

What do you mean with
"I think I just solved the issue, there was a !! in the last call there. Must be a typo."

Where was the bug? Was it in the style you had "!!" ... Which last call?
Did you fix ext-debug.js ... or was it in your code?

Please reply, because I have the same bug.... And is kind of stocked :-(