Javascript Girl
  1. Javascript Girl
  3. Comment tester (automatisé) qu'une opération survient après le repeint du navigateur?
Intereting Posts
Détecter le type de curseur Puis-je trouver des événements liés à un élément avec jQuery? Uncaught TypeError: impossible de définir la propriété 'position' de indefini Bootstrap (4) peut-il être intégré avec le matériel angulaire (2)? Sencha Ext.define utilise vs requiert SVG rendu dans une toile floue sur l'affichage de la rétine Obtenir l'attribut d'identification raphael dans le DOM Javascript boucle un tableau pour trouver des nombres divisibles par 3 Comment réduire l'utilisation de la mémoire de getImageData lors de l'utilisation de la toile pour éditer une vidéo? Quelle serait la marche à suivre pour les alertes JavaScript générées dans le chargement d'une page () à l'aide de Selenium? Dormir dans JQuery? Comment coder base64 dans l'intérieur de javascript Image d'outils de Highcharts Comment puis-je comparer les numéros de version arbitraires? SetTimeout s'exécute une seule fois au lieu de plusieurs fois

Comment tester (automatisé) qu'une opération survient après le repeint du navigateur?

Selon les commentaires de cette publication du blog , la technique suivante exécute une opération de manière asynchrone mais attend un repeint: 

function nextTick(callback) { var img = new Image; img.onerror = callback; img.src = 'data:image/png,' + Math.random(); }

Alors que celui-ci n'attend pas de repeint: 

 var mc = new MessageChannel; function nextTick(callback) { mc.port1.onmessage = callback; mc.port2.postMessage(0); }

Comment puis-je vérifier cela, par programme, de manière à ce que les tests automatisés sur plusieurs plates-formes / navigateurs puissent vérifier?

Vous pouvez utiliser requestAnimationFrame au lieu de la solution de contournement dans la publication du blog.

En savoir plus sur le blog de Paul Irish http://paulirish.com/2011/requestanimationframe-for-smart-animating/