# Update 2018 for [Microsoft Edge Developer Tools][3]

The Dev Tools in Edge finally added support for managing and browsing cookies.

> **Note**: Even if you are testing and supporting IE targets, you mine as well do the heavy lifting of your browser compatibility testing by leveraging the new tooling in Edge, and defer checking in IE 11 (etc) for the last leg.



### [Debugger Panel][4] > [Cookies Manager][6]

[![Debugger Tab][1]][1]

### [Network Panel][5] > [Request Details][7] > Cookies

[![Network Tab][2]][2]

The benefit, of course, to the debugger tab is you don't have to hunt and peck for individual cookies across multiple different and historical requests.

  [1]: https://i.stack.imgur.com/x3bGr.png
  [2]: https://i.stack.imgur.com/w1A2x.png
[3]: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide
[4]:https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide/debugger
[5]: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide/network
[6]: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide/debugger/cookies
[7]: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide/network#request-details

I'm looking for how to view the cookies set using developer tools in IE11. I see an option in network profiling to view cookies being sent back and forth, but this is not really the same thing. It is cumbersome to use since it's per request. Surely there must be a way to view all cookies like you can in IE10.

How do I view cookies in Internet Explorer 11 using Developer Tools

# Please Don't Do This.

Browser detection is known to be very unreliable and is not future proof at all.  
<sub>As evidenced by you having this problem in the first place.</sub>

Instead, detect browser features and deliver what you need to based off those.

Check out these resources:

* http://modernizr.com/
* http://www.quirksmode.org/js/support.html

---

If you **have** to do this, then you can use any of these methods:

* [How to detect IE11?](https://stackoverflow.com/q/17907445/1366033)
* [how to detect IE11 using jquery](https://stackoverflow.com/q/20089145/1366033)
* [Jquery fail to detect IE 11](https://stackoverflow.com/q/18684099/1366033)

Ex:



    if (!!navigator.userAgent.match(/Trident.*rv\:11\./)) {self.location = "google.com"}

I must redirect IE user to other website and from IE6 to IE9 this code working very good:

     

This code working very good for IE 10:

     <script type="text/javascript">if (navigator.appName == 'Microsoft Internet Explorer'){self.location = "google.com"}</script>

But I can't find any solution for IE11 - in this browser my website doesn't redirect.

Maybe you know how to write only one script to redirect all IE browsers to other website?

How to detect IE11 and redirect it to other site

My guess is there is an issue with the way that [IcoMoon](https://icomoon.io/) created the font files.

I'm having trouble rendering in Chrome, IE, and FF (respectively):

![Render](http://i.imgur.com/hHY1qnj.png)

It appears the font is being delivered to the site okay:

![Network](http://i.imgur.com/cGqSsOs.png)

Here are the relevant portions of your [CSS file][myCSS], which wouldn't hurt to include in the question:



    @font-face {
        font-family: 'vt-icons';
        src: url('fonts/vt-icons/fonts/vt-icons.eot?ovc75f');                                      /* IE9 Compat Modes */
        src: url('fonts/vt-icons/fonts/vt-icons.eot?#iefixovc75f')    format('embedded-opentype'), /* IE6-IE8 */
             url('fonts/vt-icons/fonts/vt-icons.woff?ovc75f')         format('woff'),              /* Modern Browsers */
             url('fonts/vt-icons/fonts/vt-icons.ttf?ovc75f')          format('truetype'),          /* Safari, Android, iOS */
             url('fonts/vt-icons/fonts/vt-icons.svg?ovc75f#vt-icons') format('svg');               /* Legacy iOS */
    }
    [class^="icon-"], [class*=" icon-"] {
        font-family: 'vt-icons';
    }
    
    .icon-vt-logo-solid:before {
        content: "\e600";
    }
    .icon-study: before {
        content: "\e601";
    }

If you try another `content` type like `"\e601"`, it works fine.  So I'm guessing it's the build for that specific item.

You can confirm this by downloading a font-viewer like [FontForge] and opening the [.woff file][myFont]:

![Fonts](http://i.imgur.com/1OHcGsP.png)

It shows the same problem, so it's unlikely to be the browser.

If you double click on the icon, you'll see the exact vectors used to create it:

![VT Original](http://i.imgur.com/leAO1vS.png)

What's happening is that the circle and the VT logo are both rendered on the "fore" layer.  Everything inside the circle is filled in, rendering the "VT" fill invisible.  You easily see this by changing the shape of the circle and seeing the VT come out from "behind" it.

![VT New](http://i.imgur.com/dB7BbcU.png)

I'm not sure what the difference in circles was, but the twitter circle seems to be properly cancelling out the inner shapes.  So you can copy and paste that circle into your other icon to get this:

![Twitter & VT](http://i.imgur.com/0YGMhZ9.png)

Then just export and upload to your host

Just for good measure, I saved the changes, exported some of the relevant font files, and [added them to GitHub][Github] so you can download them.

Until you add to your own host, this'll work:



    @font-face {
        font-family: 'vt-icons';
        src: url('http://www.corsproxy.com/kylemitofsky.com/libraries/libraries/fonts/vt-icons.woff?ovc75f') format('woff');
        unicode-range: U+E600-E626;
    }

### Working Version! Yay!

![Working Version](http://i.imgur.com/UTR5HYG.png)

>**By the way**, You can also try adding a unicode-range for `@font-family` declarations so the browser only needs to download the characters it absolutely needs, like this: `unicode-range: U+E600-E626;`


### Further Reading

* http://css-tricks.com/snippets/css/using-font-face/
* https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face
* http://fontforge.github.io/en-US/

[myCSS]: http://d25wzyo6b5ic8t.cloudfront.net/rev/d557aa69/new/myvoice/css/myvoice-dark.css
[myFont]: http://d25wzyo6b5ic8t.cloudfront.net/rev/d557aa69/new/myvoice/css/fonts/vt-icons/fonts/vt-icons.woff?ovc75f
[FontForge]:http://fontforge.github.io/en-US/
[Github]: https://github.com/KyleMit/libraries/commit/5fbb591e0ff15ee0dba4a42ae27d325d0ac52986?diff=unified

I created a couple icon fonts with [**IcoMoon**](https://icomoon.io/). 

They work fine in all other browsers but some reason they are completely opaque in all versions of IE tested (8-11). Bootstrap's icon fonts look fine so it's something I must be doing or not doing.

You can see it in the upper left corner here: http://voicethread.com/new/myvoice/#browse

How it looks in different browsers:

![How it looks in Chrome, FF, Safari, and IE](http://i.imgur.com/EdTujwl.png)
