Introducción al script de monitorización del browser

El browser con secuencias de comandos emula una experiencia personalizada del usuario mediante un browser con secuencias de comandos que navega por su sitio web, realiza acciones específicas y garantiza que haya elementos específicos presentes. Para crear un browser con secuencias de comandos, vaya a one.newrelic.com > Synthetic monitoring > Create a monitor y luego seleccione el mosaico User flow / functionality.

Consulte Referencia del navegador con secuencias de comandos para obtener una lista de todas las funciones disponibles.

Scripted monitors are driven by Selenium WebDriver. Each time your script runs, New Relic creates a fully virtualized Selenium-driven Google Chrome browser that navigates your website and follows each script step. Synthetic monitoring includes an IDE-style script editor that suggests functions, locators, and other elements to simplify scripting.

Para ver cómo usar Selenium IDE para registrar su flujo de trabajo y exportarlos en el formato requerido por New Relic, mire este breve video de YouTube (3:49 minutos).

Visita una URL

Todos los scripts comienzan especificando a qué URL debe navegar el monitor. Para especificar una URL, llame a $browser.get("url"):

$browser.get("https://mywebsite.com");

Secuencia de acciones

Debido a que WebDriverJS es asincrónico, las acciones de script a veces pueden ejecutarse fuera de orden. Para forzar que las acciones del script se ejecuten en orden, incluya cada acción en una llamada then(function(){}) :

$browser.get("https://my-website.com").then(function(){
    return $browser.findElement($driver.By.linkText("Configuration Panel"));
});

Para conectar varias acciones en secuencia, envuelva cada acción en una llamada then(function(){}) y encadene las llamadas:

$browser.get("https://my-website.com").then(function(){
    return $browser.findElement($driver.By.linkText("Configuration Panel"));
}).then(function(){
    return $browser.findElement($driver.By.partialLinkText("Configuration Pa"));
});

Localizar elementos

Una vez que haya especificado una URL para monitor, generalmente querrá ubicar un elemento particular en la página. Ubicar un elemento verifica su presencia en la página y también le permite interactuar con el elemento de página.

Puede ubicar elementos por su class, id, link text, name o incluso XPath. Para encontrar estos atributos, utilice las herramientas de desarrollo de su browser o vea el código fuente de su sitio web. Para obtener una lista de todas las funciones del localizador, consulte Localizadores: Buscar elemento de página.

$browser.findElement($driver.By.className("button"));

$browser.findElement($driver.By.id("edit-submit"));

$browser.findElement($driver.By.linkText("Configuration Panel"));

$browser.findElement($driver.By.partialLinkText("Configuration Pa"));

$browser.findElement($driver.By.name("search-query-field"));

$browser.findElement($driver.By.xpath("//input[@placeholder = 'search-query-field']"));

Interactuar con elementos

Debido a que un monitor con secuencias de comandos controla un browser Google Chrome real con tecnología Selenium, los monitores con secuencias de comandos pueden interactuar con el elemento de página de la misma manera que lo haría un usuario. Por ejemplo, el monitor puede hacer clic en un enlace, ingresar texto en un cuadro de búsqueda, etc. Para obtener una lista de acciones disponibles, consulte ActionSequence: vincular varias acciones.

Primero, ubique el elemento de página y luego llame a una función de interacción:

$browser.findElement($driver.By.linkText("Configuration Panel")).click();

$browser.findElement($driver.By.className("config-panel-02")).click();

$browser.findElement($driver.By.name("search-query-field")).sendKeys("EXAMPLE USER NAME");

$browser.findElement($driver.By.id("search-q-box")).sendKeys("EXAMPLE USER NAME");

$browser.findElement($driver.By.name("search-query-field")).clear();

$browser.findElement($driver.By.id("search-q-box")).clear();

Esperas y tiempos de espera

Los elementos de página grandes, como imágenes o contenido dinámico complejo, pueden tardar mucho en cargarse. Esto puede hacer que su script falle cuando el monitor intenta interactuar o ubicar un elemento que aún no se ha cargado.

Para evitar estos problemas, establezca condiciones de espera que pausarán el script hasta que el elemento de página especificado esté presente, o secuenciar acciones manualmente. Para obtener una lista de condiciones, consulte Condiciones: pausar y esperar condiciones.

//Call the wait function
$browser.wait(function() {
//Tell the monitor to get the page title, then run a function on that title.
  return $browser.getTitle().then(function(title) {
//Specify the expected page title.
    return title === "Your Page Title Here";
    });
//If the condition is not satisfied within a timeout of 1000 milliseconds (1 second), proceed anyway.
}, 1000);

//Tell the monitor to wait up to 7,500 milliseconds (7.5 seconds) for a link whose text is `Your Link Text Here`.
$browser.waitForAndFindElement($driver.By.linkText("Your Link Text Here"), 7500);

Log resultados del script

También puede log manualmente los resultados del monitor en el logdel script. Utilice el registro para solucionar problemas de una script: para descubrir qué paso de su script está fallando, incluya una función log junto con cada paso clave de su script.

//Send `Hello world.` to the console log.
console.log('Hello world.');

// ----------------------------------- Console log
Hello world.

//Declare the variable `WEBSITE_URL`
var assert = require('assert'),
  WEBSITE_URL = 'https://my-website.com/';

console.log('Hello world.');
//Load the website specified in `WEBSITE_URL`
$browser.get(WEBSITE_URL);
//Log our success to the console
console.log('Success for', WEBSITE_URL);

// ----------------------------------- Console log
Hello world.
Success for https://my-website.com/

Desbloquear servicios de análisis

Sintético bloquea la ejecución de scripts de servicios de análisis populares de forma predeterminada. Puede permitir que se ejecute un script para un servicio específico. Esto permite que el script del servicio se ejecute y recopile datos como lo haría para un usuario real.

//Allow Google Analytics scripts to run
$browser.addHostnameToWhitelist(hostnameArr: ['google-analytics.com']);

//Visit https://my-website.com
$browser.get('https://my-website.com');

Personaliza el agente de usuario

Puede personalizar el agente de usuario del browser con script para garantizar que las correcciones específicas browseren su aplicación funcionen correctamente o para evitar un mecanismo de seguridad para filtrar un sitio interno.

//Simulate Internet Explorer 10.6
$browser.addHeader('User-Agent', 'Mozilla/5.0 (compatible; MSIE 10.6; Windows NT 6.1; Trident/5.0; InfoPath.2; SLCC1; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET CLR 2.0.50727) 3gpp-gba UNTRUSTED/1.0');

//Visit http://httpbin.org/user-agent
$browser.get('http://httpbin.org/user-agent');

Importar módulos opcionales

También puede importar muchos módulos populares de Node.js para mejorar su conjunto de pruebas, automatizar la inserción de datos de prueba y simplificar funciones complejas. Para obtener más información, consulte Importación de módulos de Node.js.