miscoded

Today we'll have a backstage look at the coding of one of the most important sites out there: they don't come much bigger than MSN Hotmail..

Their junkmail "Block sender" settings screen does not work in Opera. You can add addresses but not submit the final result to actually save the setting, because clicking the "OK" button seems to do nothing.

There are two subtle differences in the code sent to IE and the code sent to Opera.
Firstly, IE gets this code for the OK button:

<input type="submit" class="A" name="OK.x" value="   OK   ">

while Opera gets

<input type="button" class="A" onClick="return buildAllLists();" name="OK.x" value="   OK   ">

In other words, IE gets a submit button whose default action is to submit a form. Opera just gets a button. It will run some JavaScript when clicked and one might expect that the script, if run successfully, would submit the form. But no..

The JavaScript is also different from what IE gets. It contains an error that stops script execution.

The following line refers to the form element that contains blocked addresses. It is supposed to go through all items in the list. i is a variable that points to the currently analysed item.

while (document.listsForm.destList.options.text != "")

The problem is that when i is increased, it will eventually be a higher number than there are items in the list and then cause an error because the script is trying to get the "text" content of an item that does not exist.

It should have been written

while (document.listsForm.destList.options && document.listsForm.destList.options.text != "")

This is however not the only reason it doesn't work: even if I fix the error, it does not actually submit the form! There is nothing in the JavaScript to send the form off - it is obviously written to work with a "submit" button. The guys who wrote the JavaScript didn't communicate with those who wrote the HTML, and neither of them tested the result in Opera..

I've saved a snapshot of the page Opera gets to prove that it is so broken it won't even work in IE:
<http://www.hallvord.com/opera/hotmailblock/>
Try to go there and click the "OK" button - you will get a scripting error. That's what we call "BAD": Broken As Designed.

Problem: Opera can do its best to interpret the code that is sent to us, to be compatible with the standards and with other browsers BUT if the code we get is different from what the others get and plain inconsistent, we don't have any opportunity to displaying the page as the webmaster intended. Not the slightest.

Take, for example https://www.fleet.ford.com/default.asp

You will notice the overlapping content at once. A quick look at the source shows the following problem..

IE receives:

<div ID='contentdiv' class='contentIE'>

FireFox receives:

<div ID='contentdiv' class='contentNS'>

What Opera gets is:

<div ID='contentdiv' class=''>

Either what they send IE or what they send FF would work just fine. Opera falls between two chairs because the sniffer is intelligent enough to recognise it is neither of them but has no alternative content.