Race condition avec Firefox + Ophirofox sur LeParisien ?

[Write]

Sur un nouveau profile Firefox (about:profiles), avec Ophirofox fraichement installé, il semblerait que la bannière "Lire sur Europresse" ne s'affiche qu'au premier chargement d'une page LeParisien, puis très rarement, au bout de beaucoup de rechargement :

Par exemple cette page : https://www.leparisien.fr/jo-paris-2024/apres-les-rixes-saint-denis-sinquiete-un-peu-pour-les-jo-ca-fait-peur-pour-limage-de-la-ville-23-01-2024-LH6YFQQEXVACNGTU73ZQAUUF7M.php

[lnoss]

Fonctionne avec un navigateur Web sans bloqueur de pubs de mon côté. Il semblerait que côté Parisien, on n'apprécie pas trop de ne pas trouver les éléments HTML générés pour son paywall et retirés par uBlock et compagnie. Du genre un gros null. Peut-être attendre la mise à jour des listes de ces extensions ?

[Write]

Perso j'ai testé sur un nouveau profile sans uBlock Origin et uniquement avec Ophirofox installé about:profiles > Créer un nouveau profil > Installation d'ophirofox > load du parisien > ctrl + r plusieurs fois.

[lnoss]

Ça casse bien sûr Firefox (pas essayé sans extensions), mais pas sur Edge avec Ophirofox seulement.

[Write]

Oui sur Chrome aucun problème,

Personnellement dans mes projets quand je dois être sûr de la présence d'un element j'utilise

const onElemAvailable = async selector => {
  while (document.querySelector(selector) === null) {
    await new Promise(resolve => requestAnimationFrame(resolve));
  }
  return document.querySelector(selector);
};

Puis :

onElemAvailable('.monselecteur').then((selector) => {
          // do something
});

J'ai testé mais uniquement sur mon userscript, ça fonctionne bien

onElemAvailable('.paywall
sticky.width_full.d_flex.pt_3_m.pb_3_m.pt_4_nm.pb_4_nm.pos_stick.ff_gct.fw_r.justify_center').then((selector) => {
    onLoad().catch(console.error);
});

[lovasoa]

const onElemAvailable = async selector => {
  while (document.querySelector(selector) === null) {
    await new Promise(resolve => requestAnimationFrame(resolve));
  }
  return document.querySelector(selector);
};

Ça fait tourner le sélecteur 60 fois par secondes !

[Write]

Cette méthode est assez légère en termes de performances car elle utilise requestAnimationFrame, qui est optimisé pour les animations et les mises à jour de l'interface utilisateur. Elle n'effectue pas de polling intensif qui pourrait ralentir l'interface utilisateur.

Elle continuera à vérifier périodiquement la présence de l'élément jusqu'à ce qu'il soit trouvé, ce qui peut utiliser des ressources du navigateur même lorsque l'élément est présent, mais cela devrait être négligeable en termes de performances, surtout si l'élément est trouvé rapidement.

Autrement, je peux comprendre qu’il soit préférable d’utiliser MutationObserver.

[lovasoa]

Non, non, ce ce n'est pas léger du tout, ça va évaluer le sélecteur environ 60 fois par secondes, voir plus si l'écran a un plus haut taux de rafraîchissement.

[Write]

Non, non, ce ce n'est pas léger du tout, ça va évaluer le sélecteur environ 60 fois par secondes, voir plus si l'écran a un plus haut taux de rafraîchissement.

Au temps pour moi, j'étais persuadé de l'efficience de ce bout de code,

En attendant j'ai fait un PR ici : https://github.com/lovasoa/ophirofox/pull/196

[Write]

Clos via #196