Teste para exibição de compatibilidade do IE8 / 9

Ter que oferecer suporte ao IE8 pode ser uma grande chatice, mas ter que oferecer suporte ao IE8 no Modo de Exibição de Compatibilidade pode ser ainda mais. Em um projeto recente, fui questionado se eu poderia fornecer suporte para o Modo de Exibição de Compatibilidade, para o qual minha resposta inicial foi um pouco incerta, pois não tinha ideia de como determinar quando o navegador estava no Modo de Exibição de Compatibilidade. Depois de pesquisar um pouco nas inter-webs e não encontrar muito, decidi girar minhas VMs e montar uma planilha com cada string de agente do usuário e documentMode de cada versão do navegador. Executei cada navegador por meio de visualização de compatibilidade e por meio de cada versão de navegador que estava disponível em F12. Depois de uma ou duas horas examinando os números, descobri como se pode testar de forma confiável o Modo de Exibição de Compatibilidade.

As versões do Trident são específicas da versão real do navegador, o IE10 executa o Trident6, o IE9 executa o Trident5, o IE8 executa o Trident4. Este é o valor importante. Nosso próximo valor importante é MSIE7 na string do agente do usuário. Independentemente da versão do IE, quando no Modo de Exibição de Compatibilidade, o navegador sempre se reporta como MSIE7.0 na string do agente do usuário. Testando a existência do MSIE7.0 e comparando-o com a versão do Trident, podemos determinar com precisão quando o navegador está no modo antigo (ou seja, visualização de compatibilidade).

Pegando nossa nova lógica e aplicando-a à API addTest do Modernizr, podemos ter uma pequena solução excelente. Abaixo está um link para meu repositório Github junto com o código (não reduzido e reduzido).

https://github.com/TechnotronicOz/IECompat

(function() {
    var ie8Compat = function() {
        var agentStr = navigator.userAgent;
        if ( agentStr.indexOf('MSIE') === -1 ) return false;
        if ( agentStr.indexOf('Trident/4.0') > -1 ) {
            if ( agentStr.indexOf('MSIE 7.0') > -1 ) {
                return true;
            } else {
                return false;
            }
        } else {
            return false;
        }
    },

    ie9Compat = function() {
        var agentStr = navigator.userAgent;
        if ( agentStr.indexOf('MSIE') === -1 ) return false;
        if ( agentStr.indexOf('Trident/5.0') > -1 ) {
            if ( agentStr.indexOf('MSIE 7.0') > -1 ) {
                return true;
            } else {
                return false;
            }
        } else {
            return false;
        }
    };

    Modernizr.addTest('ie8compat', ie8Compat);
    Modernizr.addTest('ie9compat', ie9Compat);
}());


(function(){ie8Compat=function(){var a=navigator.userAgent;return-1===a.indexOf("MSIE")?!1:-1<a.indexOf("Trident/4.0")?-1<a.indexOf("MSIE 7.0")?!0:!1:!1};ie9Compat=function(){var a=navigator.userAgent;return-1===a.indexOf("MSIE")?!1:-1<a.indexOf("Trident/5.0")?-1<a.indexOf("MSIE 7.0")?!0:!1:!1};Modernizr.addTest("ie8compat",ie8Compat);Modernizr.addTest("ie9compat",ie9Compat)})();