search

aFarkas / webshim

[DEPRECATED] Webshims Lib is a modular capability-based polyfill-loading library
http://aFarkas.github.com/webshim/demos/index.html
MIT License
1.42k stars 201 forks source link

webshim causes IE7-8 to ignore the favicon link tag in the document's head #190

Closed benlancaster closed 11 years ago

benlancaster commented 11 years ago

With the following markup, IE 7 and 8 ignore the favicon.ico declaration and falls back to the default path of "/favicon.ico":

<!DOCTYPE html>
<!--[if lt IE 7]>      <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#" class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en-GB">   <![endif]-->
<!--[if IE 7]>         <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#" class="no-js lt-ie9 lt-ie8" lang="en-GB">          <![endif]-->
<!--[if IE 8]>         <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#" class="no-js lt-ie9" lang="en-GB">                 <![endif]-->
<!--[if gt IE 8]><!--> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#" class="no-js" lang="en-GB">                        <!--<![endif]-->
<head>
  <meta charset="utf-8" />
  <link rel="shortcut icon" type="image/x-icon" href="static/my-favicon.ico" />
  <!-- full dev version of modernizr -->
  <script src="static/jscript/libs/modernizr.js"></script>
</head>
<body>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="static/jscript/libs/webshim/polyfiller.js"></script>
  <script type="text/javascript">
  $.webshims.polyfill('forms');
  </script>

</body>
</html>

With a clean cache and history on IE, it doesn't even make an http request for static/my-favicon.ico but falls back to /favicon.ico instead. Removing $.webshims.polyfill('forms'); loads the custom favicon as expected.

thirdender commented 11 years ago

I can't remember all the details (I stopped thinking IE6/7 about a year ago), but I've always included two META tags:

<link href='/lib/favicon.ico' rel='shortcut icon' />
<link href='/lib/favicon.ico' rel='icon' type='image/ico' />

More reading: Stack Overflow: favicon not working in IE

benlancaster commented 11 years ago

Yeah, I've tried every combination you can think of! I've never spent so long trying to sort out a favicon!

I'm going to see if I can work out which bit of webshims is causing it (and hopefully fix it too) tomorrow.

aFarkas commented 11 years ago

@benlancaster

I couldn't reproduce your bug. My first guess was the stylesheet loading. Try to load webhshims without styles:

$.webshims.setOptions('loadStyles', false);
$.webshims.polyfill('forms');
benlancaster commented 11 years ago

Yeah I wondered whether it was something manipulating the head that caused it - disabling styles does indeed seem to have sorted it. Thanks!