Você está farto do banner que virou moda em sites pedindo para você aceitar cookies de terceiros ou finalizar a compra? Neste post explico como fiz (e publiquei) uma extensão do Firefox para evitá-la na maioria dos sites

INFORMAÇÕES

O código desta extensão está publicado em https://github.com/jagedn/removecookiewall-addon e você pode instalá-lo no Firefox (também no celular) em https://addons.mozilla.org/es/firefox/addon/removecookiewall/

Por alguns meses, e devido a uma exigência europeia (eu acho), a maioria dos sites mostra um banner na primeira vez que você os acessa, que não permite que você continue até que você decida entre:

• Vou colocar milhares de cookies de terceiros em seu navegador que espionarão o que você navega

• vá até o caixa e me pague para não fazer isso

A maioria dessas bibliotecas executa javascript assim que a página que lê seus cookies é carregada. Se eles perceberem que você não fez check-out, eles mostrarão uma caixa de diálogo HTML e bloquearão o corpo alterando o estilo para "bloquear" (ou similar)

Esta caixa de diálogo não permite que você leia o que está por baixo, mas... ainda é um elemento DOM do HTML, então, como os navegadores permitem que você abra um console de desenvolvimento e inspecione o HTML, tive a ideia de ​​eliminando manualmente a caixa de diálogo (basta clicar em inspecionar, olhar no HTML onde está definido e clicar em excluir) e chimpón, a caixa de diálogo desaparece. Depois procuro a declaração "body" e clicando duas vezes no atributo style removo a propriedade que a bloqueia e agora posso rolar.

Um pouco de magia.

O que está acontecendo então? Bem, o código javascript simplesmente fica esperando que um evento do usuário chegue informando qual botão você pressionou, mas esses botões não estão mais lá, então ele nunca chegará e não instalará cookies de terceiros.

Ok, mas e se eu atualizar a página? Bem, comece de novo... então isso é perfeito para uma nova extensão de navegador fazer isso por mim.

Remover extensão CookieWall

Uma extensão do Firefox, em resumo, é um espaço reservado de memória do navegador onde é executado o código javascript que pode dialogar com ele.

Ele pode (se o usuário conceder permissões) injetar código nas páginas que você visita, abrir guias, fechá-las, comunicar-se com serviços remotos,…​

RemoveCookieWall é uma extensão do Firefox que a "única" coisa que precisa é que o navegador injete um pequeno código javascript em todas as páginas que o usuário visita.

Este javascript, conforme a página é carregada, irá inspecionar se há um elemento DOM que corresponda a algum dos que investiguei e que eles estão usando. Se detectá-lo, usará funções Javascript padrão para excluí-lo.

Como o banner às vezes pode aparecer (mili)segundos após a execução do nosso código, o que o script faz é repetir a pesquisa por alguns segundos. Após esse tempo, caso o banner não tenha aparecido, a extensão assume que a página não possui CookieeWall e termina

E isso é tudo. Resta empacotar o código, adicionar um arquivo de manifesto que indica as permissões que nossa extensão requer e publicá-lo no Firefox

Código

O código JS é basicamente:

var readyStateCheckInterval;
var counter = 0;

function sanitizeBody() {
    document.body.style.overflow = "unset"
    document.body.classList.remove('sxnlzit')
    document.body.classList.remove('didomi-popup-open')
    document.body.parentNode.classList.remove('sp-message-open')
}

function removeMe(element) {
    element.remove();
    sanitizeBody();
}

readyStateCheckInterval = setInterval(function() {
    if (document.readyState === "complete") {
        counter  ;
        const removeParent = ['div.pmConsentWall']; //elpais
        [...removeParent].forEach(s => {
            var divs = document.body.querySelectorAll(s);
            [...divs].forEach(element => {
                removeMe(element.parentNode);
            });
        });
        const removeThis = [
            'div[data-nosnippet="data-nosnippet"]',
            '#mrf-popup',
            '#didomi-popup',
            '[id^="sp_message_container_"]',
            '#cl-consent',
            'dialog.cookie-policy'
        ];
        [...removeThis].forEach(s => {
            var divs = document.body.querySelectorAll(s);
            [...divs].forEach(element => {
                removeMe(element);
            });
        });
        if (counter > 30) {
            clearInterval(readyStateCheckInterval);
        }
    }
}, 100);

Assim que o código é injetado na página, um intervalo começa a cada 100 milis

O script verifica se document.body.querySelectorAll encontra algum elemento como #mrf-popup, #didomi-popup, etc. Se encontrar, simplesmente remova-o com element.remove()

Depois de algumas tentativas acaba apagando o intervalo

Toda extensão deve ter um arquivo de manifesto. O desta extensão é simplesmente:

{

    "description": "Remove CookieWall",
    "manifest_version": 2,
    "name": "RemoveCookieWall",
    "version": "0.11",
    "homepage_url": "https://github.com/jagedn/removecookiewall-addon",
    "icons": {
        "48": "icons/border-48.png"
    },
    "content_scripts": [{
        "matches": [
            "*://*/*"
        ],
        "js": ["removeCookieWall.js"]
    }],
    "browser_specific_settings": {
        "gecko": {
            "id": "[email protected]"
        }
    }
}

Como você pode ver, content_scripts indica que queremos injetar js em todas as páginas. Outras extensões podem indicar apenas um site, outras executam um javascript em segundo plano,…​

Construir e publicar

Para publicar no Firefox basta fornecer um zip contendo todos os arquivos exigidos pela extensão. Para facilitar, criei um build.sh que simplesmente executa o zip:

zip -r -FS ../remove-cookiewall.zip * --exclude '.git' --exclude 'build.sh'

Publicar uma extensão no Firefox não tem complicações e é gratuito. A única coisa que sua extensão precisa é passar por uma revisão inicial que pode levar um (ou vários) dias