All sorts problems with IE browser

Recently, we just finished the development of our application, now it's in E2E test.

We get a bunch of defects from Test team, and surprisingly a lot of them are browser based defects.

 

First of all, for Angular2 to run smoothly, we need to apply a lot of shims and polyfills. Then it seems to be working fine.

But the truth is that, its failing everywhere.

 

The first defect we see is the SVG doesn't animate in most versions of IE, and is only supported in IE Edge.

So we have to switch all SVGs to gif, which is larger in size but with lower image quality.

 

Then a test guy told me that his application always stuck at first start. 

Later it turns out that if you don't open the dev tool in IE, then there won't be any console.** method registered in your javascript.

Therefore console.log is blocking the program. Really weird design.

 

Another one is the IE9's input field component. For text input, IE9 doesn't offer placeholder attribute.

This can only be solve by setting placeholder value to input value. 

 

Yeah. Guess browser compatibility isn't that easy to achieve.