Vous en avez marre de la bannière devenue à la mode sur les sites internet vous demandant d'accepter les cookies tiers ou de payer ? Dans cet article, j'explique comment j'ai créé (et publié) une extension Firefox pour l'éviter sur la plupart des sites

INFOS

Le code de cette extension est publié sur https://github.com/jagedn/removecookiewall-addon et vous pouvez l'installer dans Firefox (également sur mobile) depuis https://addons.mozilla.org/es/firefox/addon/removecookiewall/

Depuis quelques mois, et en raison d'une exigence européenne (je pense), la plupart des sites Web vous affichent une bannière lors du premier accès qui ne vous permet pas de continuer jusqu'à ce que vous choisissiez entre :

• Je vais placer des milliers de cookies tiers dans votre navigateur qui espionneront ce que vous naviguez

• passer à la caisse et me payer pour ne pas le faire

La plupart de ces bibliothèques exécutent javascript dès le chargement de la page qui lit vos cookies. S'ils voient que vous n'avez pas effectué le paiement, ils vous montrent une boîte de dialogue HTML et bloquent le corps en changeant le style en "bloquer" (ou similaire)

Cette boîte de dialogue ne vous permet pas de lire ce qu'il y a en dessous mais...​ c'est toujours un élément DOM du HTML, donc, puisque les navigateurs vous permettent d'ouvrir une console de développement et d'inspecter le HTML, j'ai eu l'idée de ​​en éliminant manuellement la boîte de dialogue (vous cliquez simplement sur inspecter, regardez dans le HTML où elle est définie et cliquez sur supprimer) et chimpanzé, la boîte de dialogue disparaît. Ensuite je cherche la déclaration "body" et en double-cliquant sur l'attribut style je supprime la propriété qui la bloque et je peux maintenant faire défiler.

Petite magie.

Que se passe-t-il alors ? Eh bien, le code javascript attend simplement qu'un événement utilisateur arrive lui indiquant sur quel bouton vous avez appuyé, mais ces boutons ne sont plus là, donc il n'arrivera jamais et il n'installera pas de cookies tiers.

Ok, mais que se passe-t-il si j'actualise la page ? Eh bien, recommencez...​ c'est donc parfait pour qu'une nouvelle extension de navigateur le fasse à ma place.

Supprimer l'extension CookieWall

Une extension Firefox, en bref, est un espace mémoire réservé au navigateur où est exécuté du code javascript qui peut dialoguer avec lui.

Il peut (si l'utilisateur accorde les autorisations) injecter du code dans les pages que vous visitez, ouvrir des onglets, les fermer, communiquer avec des services distants, …​

RemoveCookieWall est une extension Firefox dont la "seule" chose dont il a besoin est que le navigateur injecte un petit code javascript dans toutes les pages visitées par l'utilisateur.

Ce javascript, au fur et à mesure du chargement de la page, inspectera s'il existe un élément DOM qui correspond à l'un de ceux que j'ai étudiés et qu'ils utilisent. S'il le détecte, il utilisera les fonctions Javascript standard pour le supprimer.

Comme la bannière peut parfois apparaître (milli)secondes après l'exécution de notre code, le script répète la recherche pendant quelques secondes. Passé ce délai, si la bannière n'est pas apparue, l'extension suppose que la page ne possède pas de CookieeWall et se termine

Et c'est tout. Il ne reste plus qu'à empaqueter le code, ajouter un fichier Manifest qui indique les autorisations requises par notre extension et le publier dans Firefox

Code

Le code JS est essentiellement :

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);

Dès que le code est injecté dans la page, un intervalle démarre tous les 100 millis

Le script regarde si document.body.querySelectorAll trouve un élément comme #mrf-popup, #didomi-popup, etc. S'il le trouve, supprimez-le simplement avec element.remove()

Après quelques essais, l'intervalle finit par être supprimé

Chaque extension doit avoir un fichier manifeste. Celui de cette extension est simplement :

{

    "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]"
        }
    }
}

Comme vous le voyez, content_scripts indique que nous voulons injecter le js dans toutes les pages. D'autres extensions peuvent indiquer uniquement un site, d'autres exécutent un javascript en arrière-plan, …​

Construire et publier

Pour publier dans Firefox, il suffit de fournir un zip contenant tous les fichiers requis par l'extension. Pour faciliter les choses, j'ai créé un build.sh qui exécute simplement le zip :

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

La publication d'une extension dans Firefox ne présente aucune complication et est gratuite. La seule chose que votre extension doit passer un premier examen qui peut prendre un (ou plusieurs) jours