miscoded

As seen in this discussion, the BBC site uses a map from maps.live.com - and all we Opera users get is an error message:

We're sorry but your browser does not support BBC Sport's Olympic map.

Looking into it, first there is some Opera-sniffing from the BBC itself that detects Opera and displays the warning instead of the map.

With that sniffing neutralised, the map loads - but shows the United States, not Beijing. Come one Live Maps, admit you're wrong by several thousand kilometers.. Or?

Not in the mood to admit any fault, the script instead spits out an error laying the blame on us:

JavaScript - http://news.bbc.co.uk/sport2/hi/olympics/7493757.stm
Timeout thread: delay 10 ms
Error:
name: Msn.Drawing.Exception
message: Your Web browser does not support SVG or VML. Some graphics features may not function properly.
stacktrace:   Line 1 of linked script http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.1

So, my web browser does not support SVG, eh? Let's have a closer look at how you figured that out..

if(document.all)
         return new Msn.Drawing.VMLGraphic(e,b);
else{if(navigator.userAgent.indexOf("KHTML")!==-1)
         return new Msn.Drawing.SVGGraphic(e,b);
var c=0,f=0,g=new RegExp("Firefox/(.*)"),d=g.exec(navigator.userAgent);
if(d&&d.length>=2){
         var a=d[1].split(".");
         if(a){c=a[0];
         f=a[1];
         if(parseInt(c)>0&&parseInt(f)>=5||parseInt(c)>=2)
                  return new Msn.Drawing.SVGGraphic(e,b)

         }
}
throw new Msn.Drawing.Exception(L_GraphicsInitError_Text)

Yes, nothing but browser sniffing.. Not a single attempt at intelligent feature detection. Basically, by claiming Opera doesn't support SVG and can't load the map Microsoft is lying to the BBC and to our users.

The Prototype library defines a .replace() method on any element that replaces the contents of that element. The WebForms 2 spec defines a .replace attribute on INPUT type=submit that can be set to replace="values" to make a form submit not replace the entire document but simply update the form contents. You can't give two different things the same name. So if you use Prototype and call someInput.replace() your script will stop with an error in Opera because we support WebForms2 and "replace" is a property and not a method.

The wonderful flexibility of ECMAScript / JavaScript lets script authors define nearly anything and everything just about anywhere in the environment. That's why extending JavaScript is getting so complicated - anything we add to specifications and in browsers risks conflicting with something that an author already added somewhere. ES4 plans to come to the rescue with namespaces but until we get there we'll keep stumbling into problems when we try to improve the web. HTML5, you're overdue and welcome - but proceed with caution..

There is a new and very Spolskyesque article on browsers, web standards and IE8 just out from the one and only Joel Spolsky.

Some selected quotes.. On the IE8 team being stuck between a rock and a hard place:

"The IE team has to walk a fine line..." This is incorrect. It’s not a fine line. It’s a line of negative width. There is no place to walk. They are damned if they do and damned if they don’t.

On why "standards" generally aren't:

despite general agreement on what constitutes kosher food, .. you will not find a rabbi from one ultra-orthodox community who is willing to eat at the home of a rabbi from a different ultra-orthodox community. And the web designers are discovering what the Jews of Mea Shearim have known for decades: just because you all agree to follow one book doesn’t ensure compatibility, because the laws are so complex and complicated and convoluted that it’s almost impossible to understand them all

standards are sometimes misinterpreted, sometimes confusing and even ambiguous (...) it’s a platonic ideal and a set of misinterpretations

It's all so true. The web is badly under-specified (and quite likely anything as large and complex as the web and its underlying technologies would be, wouldn't it?).

However, while Joel has been busy selling MP3 players on Mars and watching Microsoft there are a couple of developments he's missed: maybe, maybe Microsoft has moved from what he calls a "pragmatist" position to an "idealist" position - but at the same time, the good old consortium has sort of moved in the opposite direction, from the merry idealism of un-implementable X-es to the grassroots pragmatism of HTML5.

Today the standard ITSELF is in beta, and planning to be in beta for a while among other things in order to figure out if it is compatible with the Web content. Standards Trotskyists are not cool anymore.

Joel asserts that we're dealing with "some mythical, platonic 'standard' that is not actually implemented anywhere". Actually, any modern standard has a reference implementation, it's called a test suite. (Note that I'm using circular logic here: if a standard doesn't I won't call it "modern" ) HTML5 will even have reference parsers. It's not quite the mind-reading validator which checks that your CSS rules are according to the spec and do what you had in mind. A site's compliance to the standard can't be tested beyond basic structural validation - but the user agent's compliance can! And the IE team understands this situation very well, as evident from the fact that one of the spin-offs from their CSS 2.1 implementation is a public test suite!

For all those websites Joel found that were broken in IE8, some of them may be broken due to bugs in the new implementation, some because the IE team fixed their CSS parser before implementing the specific issue a parser-based hack worked around, some because of the site violating standards generally and the rest - the whole lot of them - because of user agent sniffing. Every site and every detail needs analysis. We don't know yet to what extent the improved standards support causes these failures. Microsoft will have to figure that out over time and see on each count what there is to do about it. Even if it's down to the nasty quirks of client-side browser detection it may be possible to add workarounds. For example, if it turns out that most CSS served within IE conditional comments is now harmful, IE8 could stop parsing STYLE and LINK rel=stylesheet tags inside conditional comments unless the comment explicitly targets IE8.

Finally, Joel describes a world where the players don't cooperate. Today browsers are from Venus, we've spent more than 10 years exploring each others' quirks and collaborate on making compromises. Compromises that can be disappointing but useful. Joel is excused for not noticing, since we already know he's from Mars.

Since I spend most of my day investigating problems with Opera, I'm sometimes too quick to take for granted that a problem is Opera's problem. So when I was exploring the JIRA site with an internal build of Opera, clicked a link saying JIRA video overview and saw nothing but an empty page and a very weird JS console error, I immediately started reducing the page to a small test case to file a bug report.

The error was completely incomprehensible, except that it seemed like Opera tried to execute some HTML markup as JavaScript:

Inline script compilation
Syntax error while loading: line 6 of inline script at http://www.atlassian.com/software/jira/videos/jira_video/jira_video.jsp :
Expected expression
<script language="JavaScript"></script><noscript></noscript>
--------------------------------------^

This sometimes happens if a file has a SCRIPT element with a SRC that links to a HTML file. But the page had only two external .js files, and neither was broken.

After a bit of trial and error I had a minimal file. The error occurs because a starting HTML comment inside a SCRIPT tag does not have a matching closing comment inside that SCRIPT tag. So Opera looks ahead for another closing comment, and it seems this confusion means some of the markup is seen as being "inside" the script.

Now I was in for a great surprise: both IE7 and Firefox 2 did exactly what Opera did when displaying my attempted test case! Have a look:
jira.htm
My first thought was that while minimising I had removed something that made the site work in IE and Firefox. Then I tried watching the video in either browser.. No joy. JIRA's video page is broken (by an Omniture SiteCatalyst script that carelessly omits a //--> from a script element) and - wow - they have broken it in a cross-browser compatible way!

Well, I just added that missing closing comment and re-loaded the page from cache in Opera - but I must be the only person who has seen JIRA's demo video recently