Comprender la función de evaluación en CasperJS

Quiero entender en qué caso debería o debo usar la función de evaluate .

He leído el documento API sobre la función de evaluación de CasperJS, pero no estoy seguro de en qué caso debería usar esta función. ¿Y qué significa el contexto DOM? ¿Alguien puede dar un ejemplo?

La documentación de CasperJS tiene una descripción bastante buena de lo que hace casper.evaluate() .

Para recapitular: pasas una función que se ejecutará en el contexto DOM (también puedes llamarlo el contexto de la página). Puede pasar algunas primitivas como argumentos a esta función y devolver una primitiva. Tenga en cuenta que esta función que pase para evaluate debe ser independiente. No puede usar variables o funciones que están definidas fuera de esta función.


CasperJS proporciona muchas buenas funciones para las tareas diarias, pero puede encontrarse en una situación en la que necesita una función personalizada para hacer algo. evaluate está básicamente allí para hacer

  1. Recupere algún valor de la página para tomar medidas basadas en su script
  2. Manipule la página de otra manera que no sea hacer clic o completar un formulario
  3. Combinaciones de puntos 1. y 2.

Ejemplos

Es posible que necesite una función genérica para obtener la propiedad checked de una checkbox. Actualmente, CasperJS solo proporciona la función getElementAttribute , que no funcionará en este caso.

 function getChecked(cssSelector){ return document.querySelector(cssSelector).checked; } if (casper.evaluate(getChecked, selector)){ // do something } else { // do something else } 

En la mayoría de los casos, es solo preferencia de lo que quiere usar. Si tiene una lista de usuarios con data-uid en cada elemento li , entonces tiene al menos 2 posibilidades para recuperar los uids.

Casper solo:

 var uids = casper.getElementsAttribute('ul#user-list > li', 'data-uid'); 

Casper-Evalúa:

 var uids = casper.evaluate(function(){ return Array.prototype.map.call(document.querySelectorAll('ul#user-list > li'), function(li){ return li["data-uid"]}); }); 

En cuanto a la manipulación, todo es posible, pero depende de lo que quieras hacer. Supongamos que quiere tomar capturas de pantalla de páginas web, pero hay algunos elementos que no desea que estén allí. O puede agregar su propio CSS al documento.

Eliminar elementos:

 function removeSelector(cssSelector){ var elements = document.querySelectorAll(cssSelector); Array.prototype.forEach.call(elements, function(el){ el.parent.removeChild(el); }); } casper.evaluate(removeSelector, '.ad'); // if it would be that easy :) 

Cambiar la apariencia del sitio a través de CSS:

 function applyCSS(yourCss){ var style = document.createElement("style"); style.innerHTML = yourCss; document.head.appendChild(style); } casper.evaluate(applyCSS, 'body { background-color: black; }'); // non-sense 

Roots

CasperJS está construido sobre PhantomJS y, como tal, hereda algunas de sus peculiaridades. La documentación de page.evaluate() para page.evaluate() dice esto:

Nota: Los argumentos y el valor de retorno para la función de evaluate deben ser un simple objeto primitivo. La regla general: si se puede serializar a través de JSON, entonces está bien.

¡Cierres, funciones, nodos DOM, etc. no funcionarán!

    Intereting Posts