I am adding a web application to a client’s existing site, so I adopted some of the code of the firm that wrote it. Since I am not allowed to refactor the entire site, my Yii instance simply runs on a subdomain and uses the same theme elements of the original site (images, CSS, etc). I cannot share much of the code since it is proprietary and I am under contract, but I can tell you as much as I can to reproduce the problem. Forgive me for any unanswered questions, as I am still learning the nature of the problem myself.
The site works fine in everything but IE. Not only do I encounter odd styling errors, the browser freezes after a few seconds while echoing "> where some images would be. To show you what I mean, I will link to two screenshots. The logo of the site has been blacked out in the normal shot (rendered in Chrome). Compare this to the other screenie, which has the bugged output underlined in red above a largely unstyled form. The cross you see is only but one image that is not related to the bug, although other images were superimposed on it.
I inspected the source of the bugged images and found that they had styles using expression() in their rules. All they do is take the innerHTML of the link the images are meant to go under and replace them with the markup of the image itself. Go figure.
/* MSIE PC */ #logo a {
background-image: expression(this.runtimeStyle.backgroundImage = "none", this.innerHTML = '<img src="images/justia-kleinmediation-com.gif" border="0" alt="' + this.innerHTML + '">');
}
#tagline a {
background-image: expression(this.runtimeStyle.backgroundImage = "none", this.innerHTML = '<img src="images/h2.gif" border="0" alt="' + this.innerHTML + '">');
}
Things get interesting when I notice that an entry in the runtime log shows the REQUEST_URI with the image name for expression()'d images as an action for the current controller.
The logs quickly hit their max size and rotate until IE freezes and/or crashes, which suggests that the requests are made infinitely. This may be related to the echoed ">
. To test this, I made the following change.
/* MSIE PC */ #logo a {
background-image: expression(this.runtimeStyle.backgroundImage = "none", alert(this.innerHTML));
}
The alert boxes never stopped. I also found out from the content of the boxes that this was their way of doing black hat keyword injections. Fun!
[size="2"]Other Details[/size]
I do not know why this is relevant, but this issue ONLY occurs on IE, and ONLY when the page contains a CActiveForm (in my case). The expression()'d images do not wig out on pages with simple views with static content.
I will be talking to my client about removing the expression() rule, since I have never once seen that used and I doubt we even need it. I will inform you of any new information I come across.