IE10 also validates special character escape sequences

Most of the pages have been rendering pretty consistently in Internet Explorer 10. I was perturbed that one particular page was giving a problem on IE10, but, not on Chrome and Firefox. When I opened the developer tools, I saw the following two error reports:

HTML1402: Character reference is missing an ending semi-colon “;”.

and

HTML1403: Numeric character reference does not resolve to a valid character.

On going to the relevant line of HTML code, I found that there was a comment section which contained data curtailed beyond 30 characters.

What the developer had done in fact was to encode the single quote in the comment before inserting it into the database and then extract the first 30 characters via code before rendering it. As a result the single quote ( ‘ ) translated into its escape sequence [& # 3 9 ;] and got cut off to some text ending in &#3.

Chrome did not even report a warning about this malformed escape character. Neither did Firefox.

To set matters straight, firstly, we need to encode after curtailing and not before.

We could also try the following css which actually curtails on the basis of width. The good thing about it is that it considers the rendered text and not the html text. Therefore, you will never have a situation where a portion of your escape sequence is curtailed.

<style>
.curtail {width: 329px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
</style>
try it on the following html in your page
<p class=”curtail”>
This is some text interspersed with single quotes’ to ensure that it is going to be a lot more longer than hundred pixels.
</p>

–Updated on December 5, 2012

Thanks to my colleagues who were trying the above class on a span and found that it was ineffective. All we had to do was a little tweak. Basically span is an inline element and as such does not take widths. We updated the class to make it behave like an inline-block element and it worked!

<style>
.curtail {width: 329px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
</style>
try it on the following html in your page
<span>
This is some text interspersed with single quotes’ to ensure that it is going to be a lot more longer than hundred pixels.
</span>

Personally, HTML conformance is a good thing. However, most programmers, who treat HTML with disdain may be in for trouble if they continue to ignore malformed HTML when handling it in their code.

Validate doctype XHTML 1.0 strict on w3 validator correctly

In our Visual Studio settings, the default doctype for pages is XHTML 1.0 transitional. However, in recent days, after getting the Internet Explorer 10 update, I found that I could not debug the page because the browser kept indicating an error about the wrong doctype. My site is not expected to run in HTML 5 mode, but, the recommendation was for using the HTML 5 doctype.

I found that using XHTML 1.0 strict doctype resolved the problem. Still digging deeper, I found a very interesting answer to the difference between strict and transitional mode in http://stackoverflow.com/questions/3735979/browser-rendering-difference-between-strict-transitional-doctypes

Notably, the following extract is of interest,

The final piece of the puzzle is that all modern browsers render pages with a strict DOCTYPE in ‘strict’ mode and pages with a transitional DOCTYPE in ‘almost strict’ mode.

The next problem was that the br tag gave an error despite closing it (
). Initially, I was led to believe that either we will have to get away from strict mode also or live with the errors in W3C validator. But reading the error details carefully I realized, that the validator expected it to be inside a container tag like div, p, etc. and not directly in the body. You can see the gallery below to see the difference yourself.

The following link is great to understand what you can and should not do in strict mode. I do kind of agree that how the page looks should be part of CSS and not the HTML.

http://24ways.org/2005/transitional-vs-strict-markup

Fix bgiframe related JavaScript issues in IE9+

For quite a few months one of the pages in my custom project planning and tracking application would not open any pop ups in IE9 but would work fine in other browsers. The simple work around was to open that page in Chrome. Finally, when IE10 came, I decided to troubleshoot the issue.

The issue reported in the developer console was:

SCRIPT5022: InvalidCharacterError

Ultimately, with the help of the following URL it was discovered that the issue pertains to bgiframe using a regular expression which errors out in internet explorer (because of the faulty regex for IE9+).

http://stackoverflow.com/questions/6424526/bgiframe-plugin-causes-error-in-ie9

All that was done to resolve the issue was replace

$.browser.msie && /6.0/.test(navigator.userAgent)

with

$.browser.msie && /msie 6\.0/i.test(navigator.userAgent)

FCKEditor bug fix for IE10

IE 10 is the first browser where the major version number (before the dot) is in double digits. Most scripts, including the one written for FCKEditor at the time had a browser detection regex pattern that expected only a single digit before the dot (see below)

var sBrowserVersion = navigator.appVersion.match(/MSIE (.\..)/)[1] ;

The following change will thankfully remediate the situation immediately.

var sBrowserVersion = navigator.appVersion.match(/MSIE ([\d.]+)/)[1] ;

Credit for the above script goes to the author in answer to a stackoverflow question (http://stackoverflow.com/questions/1926394/get-browser-version-of-ie-using-javascript)

Browser Usage: IE6 and IE9 predictions

For all of nearly last 7 years that I have worked on web applications, IE6 has tormented me and all my colleagues alike. While the client’s expectation in terms of feature richness has multiplied, IE6 continues to be the standard on which the development has to be based!

I have been following browser usage statistics for the last couple of years at gs.statcounter.com. Although predictions can always swing 10-15% either ways, I am still venturing out to predict the changing scenario of IE 6 to IE 9 in the next 6 months in U.S.

  • As per my analysis, IE 6 will fall below 50% by the end of this year and become negligible by March 2012.
  • IE8 and IE9 will be almost level by March 2012.
  • The rate of change could have been much more rapid had the adoption rate for Windows 7 not been so sluggish (and mostly due to budget constraints).
  • Another key point to note is that there is a great chance that overall share of IE could come down from around 44% to around 41.5% in the next 6 months.
Date IE 6.0 IE 7.0 IE 8.0 IE 9.0
avg +/-

0.16

0.54

1.11

-1.26

2011-10

0.78

4.28

25.95

13.67

2011-11

0.62

3.74

24.84

14.93

2011-12

0.47

3.20

23.73

16.19

2012-01

0.31

2.66

22.62

17.45

2012-02

0.15

2.12

21.51

18.71

2012-03

-0.01

1.58

20.40

19.97

Avg +/- denotes average increase or decrease expected.

Who cares about modern browsers?

Firefox recently took IE9 and its modern browser claims head on in an article, “Is IE9 a modern browser?”.

Microsoft then retorted with “A Modern Browser”.

The only point the two have proven is eloquence of words. In reality Google’s chrome is the one proving the technical point.

Take for instance that Firefox’s much touted version 4 is still not out. Their adoption rate for new versions is next only to IE. Firefox 3.6 has the majority, but there are still many users for 3.5, 3.0 and a few beta users of 4.0. IE, as every one knows has IE8, IE7 and IE6 all being used in significant numbers. Look at chrome. Chrome 9 and chrome 8. No trace of the lower versions. This will be a very important aspect from a modern browser’s perspective.

Today a developer targeting IE has to cater to too many differences that are there between IE 6, 7 and 8.

The other challenge is that despite all the success of Windows 7, even in U.S., the number of WIN7 users has still not crossed WINXP. Even if IE9 comes out in a few months, it will take at least 2-3 years to become the standard browser when WINXP becomes a minority that no one is really worried about. The current trends for U.S. are less than 1% decrease for WINXP per month over the last 13 months. Currently around 32%, and at this rate, it will not take less than 30-36 months before it comes below 2-3% in U.S. (see http://gs.statcounter.com/#os-US-monthly-201002-201102)

For Firefox, the challenge will remain on how quickly they can bring out the stable version of 4.0 as user patience is very thin these days. Firefox was around 32.8% worldwide 13 months back. Today it is 30.5% worldwide. All the efforts of Firefox are not really leading to an increase in share. They too are taking a step in the right direction, ;-). However, they have a long way to go and prove that they are a better alternative to Chrome. (see http://gs.statcounter.com/#browser-ww-monthly-201002-201102)

From an end-user’s perspective, I would love to use the browser which is the fastest and most memory/processor efficient. At the moment I will still choose to use Chrome although I like both Firefox 4 and IE9.

From a developer’s perspective, I know that there is going to be a 3 way split between IE, Firefox and Chrome/Safari. The one with the least matching features is the one that will stand out like a sore thumb for me because when making browser compliant sites, we will have to choose the least common denominator. No matter what I like, I have to program to IE6 / IE7 levels and I will continue to hate IE for doing that to me till the time I have to continue doing it.

WIN7 ready to overtake WINXP in U.S. and Chrome 8 ready to overtake FireFox 3.6 in India

Finally, Windows 7 looks close to overtaking Windows XP for the first time in U.S. It is just 3% behind which it is surely going to cover in the next 5-6 weeks going by the growth rate it has shown in the last 1 year.

In the last week of December 2010, the stats read as

WinXP 31.49, Win7 28.37, WinVista 22.67, MacOSX 14.47, iOS 1.13, Linux 0.71

U.S. Operating System Market Share % 25 to 31 Dec 10

U.S. Operating System Market Share % 25 to 31 Dec 10

Chrome has been making steady gains all across the world. It is on the verge of overtaking FireFox 3.6 as the number 1 browser. FireFox has been number 1 for just 5 months in India (it overtook IE6 in August 2010).

In the last week of December 2010, the stats read as

Firefox 3.6 23.48, Chrome 8.0 20.21, IE 8.0 16.62, IE 6.0 15.66

India Browser Version Market Share % 25 to 31 Dec 10

India Browser Version Market Share % 25 to 31 Dec 10