Ejecute pruebas de dramaturgo usando AI.
auto-playwright : npm install auto-playwright -D.env : export OPENAI_API_KEY= ' sk-..."auto : import { test , expect } from "@playwright/test" ;
import { auto } from "auto-playwright" ;
test ( "auto Playwright example" , async ( { page } ) => {
await page . goto ( "/" ) ;
// `auto` can query data
// In this case, the result is plain-text contents of the header
const headerText = await auto ( "get the header text" , { page , test } ) ;
// `auto` can perform actions
// In this case, auto will find and fill in the search text input
await auto ( `Type " ${ headerText } " in the search box` , { page , test } ) ;
// `auto` can assert the state of the website
// In this case, the result is a boolean outcome
const searchInputHasHeaderText = await auto ( `Is the contents of the search box equal to " ${ headerText } "?` , { page , test } ) ;
expect ( searchInputHasHeaderText ) . toBe ( true ) ;
} ) ;Incluya el tipo de StepOptions con los valores necesarios para conectarse a Azure OpenAI.
import { test , expect } from "@playwright/test" ;
import { auto } from "auto-playwright" ;
import { StepOptions } from "../src/types" ;
const apiKey = "apikey" ;
const resource = "azure-resource-name" ;
const model = "model-deployment-name" ;
const options : StepOptions = {
model : model ,
openaiApiKey : apiKey ,
openaiBaseUrl : `https:// ${ resource } .openai.azure.com/openai/deployments/ ${ model } ` ,
openaiDefaultQuery : { 'api-version' : "2023-07-01-preview" } ,
openaiDefaultHeaders : { 'api-key' : apiKey }
} ;
test ( "auto Playwright example" , async ( { page } ) => {
await page . goto ( "/" ) ;
// `auto` can query data
// In this case, the result is plain-text contents of the header
const headerText = await auto ( "get the header text" , { page , test } , options ) ;
// `auto` can perform actions
// In this case, auto will find and fill in the search text input
await auto ( `Type " ${ headerText } " in the search box` , { page , test } , options ) ;
// `auto` can assert the state of the website
// In this case, the result is a boolean outcome
const searchInputHasHeaderText = await auto ( `Is the contents of the search box equal to " ${ headerText } "?` , { page , test } , options ) ;
expect ( searchInputHasHeaderText ) . toBe ( true ) ;
} ) ; Como mínimo, la función auto requiere un mensaje de texto sin formato y un argumento que contenga su page y objetos test (opcional).
auto ( "<your prompt>" , { page , test } ) ; Ejecutando sin el parámetro test :
import { chromium } from "playwright" ;
import { auto } from "auto-playwright" ;
( async ( ) => {
const browser = await chromium . launch ( { headless : true } ) ;
const context = await browser . newContext ( ) ;
const page = await context . newPage ( ) ;
// Navigate to a website
await page . goto ( "https://www.example.com" ) ;
// `auto` can query data
// In this case, the result is plain-text contents of the header
const res = await auto ( "get the header text" , { page } ) ;
// use res.query to get a query result.
console . log ( res ) ;
await page . close ( ) ;
} ) ( ) ; Puede pasar un atributo debug como el tercer parámetro a la función auto . Esto imprimirá el aviso y los comandos ejecutados por OpenAI.
await auto ( "get the header text" , { page , test } , { debug : true } ) ; También puede establecer la variable de entorno AUTO_PLAYWRIGHT_DEBUG=true , que habilitará la depuración para todas las llamadas auto .
export AUTO_PLAYWRIGHT_DEBUG=trueCada navegador que el dramaturgo admite.
Hay opciones adicionales que puede aprobar como un tercer argumento:
const options = {
// If true, debugging information is printed in the console.
debug : boolean ,
// The OpenAI model (https://platform.openai.com/docs/models/overview)
model : "gpt-4-1106-preview" ,
// The OpenAI API key
openaiApiKey : 'sk-...' ,
} ;
auto ( "<your prompt>" , { page , test } , options ) ; Dependiendo del type de acción (inferido por la función auto ), existen diferentes comportamientos y tipos de retorno.
Una acción (por ejemplo, "hacer clic") es una interacción simulada del usuario con la página, por ejemplo, un clic en un enlace. Las acciones devolverán 'indefinido' 'si tuvieran éxito y lanzarán un error si fallan, por ejemplo
try {
await auto ( "click the link" , { page , test } ) ;
} catch ( e ) {
console . error ( "failed to click the link" ) ;
}Una consulta devolverá los datos solicitados de la página como una cadena, por ejemplo,
const linkText = await auto ( "Get the text of the first link" , { page , test } ) ;
console . log ( "The link text is" , linkText ) ; Una afirmación es una pregunta que devolverá true o false , por ejemplo
const thereAreThreeLinks = await auto ( "Are there 3 links on the page?" , {
page ,
test ,
} ) ;
console . log ( `"There are 3 links" is a ${ thereAreThreeLinks } statement` ) ; | Aspecto | Enfoque convencional | Prueba con dramaturgo automático |
|---|---|---|
| Acoplamiento con marcado | Fuertemente vinculado al marcado de la aplicación. | Elimina el uso de selectores; Las acciones están determinadas por el asistente de IA en tiempo de ejecución. |
| Velocidad de implementación | Implementación más lenta debido a la necesidad de traducción precisa de código para cada acción. | Creación de prueba rápida utilizando instrucciones simples de texto sin formato para acciones y afirmaciones. |
| Manejo de escenarios complejos | La automatización de escenarios complejos es desafiante y propenso a fallas frecuentes. | Facilita la prueba de escenarios complejos centrándose en los resultados de las pruebas previstas. |
| Tiempo de escritura de prueba | Solo puede escribir pruebas después del desarrollo completo de la funcionalidad. | Habilita un enfoque de desarrollo basado en pruebas (TDD), lo que permite la escritura de pruebas concurrente con o antes del desarrollo de la funcionalidad. |
locator.blurlocator.boundingBoxlocator.checklocator.clearlocator.clicklocator.countlocator.filllocator.getAttributelocator.innerHTMLlocator.innerTextlocator.inputValuelocator.isCheckedlocator.isEditablelocator.isEnabledlocator.isVisiblelocator.textContentlocator.uncheckpage.goto Agregar nuevas acciones es fácil: solo actualice las functions en src/completeTask.ts .
Esta biblioteca es gratuita. Sin embargo, hay costos asociados con el uso de OpenAI. Puede encontrar más información sobre los precios aquí: https://openai.com/picing/.
Usando https://ray.run/ como ejemplo, el costo de ejecutar un paso de prueba es de aproximadamente $ 0.01 usando GPT-4 Turbo (y $ 0.001 usando GPT-3.5 Turbo).
El bajo costo es en parte porque auto-playwright usa desinfectación HTML para reducir el tamaño de la carga útil, por ejemplo, lo que sigue es la carga útil que se enviaría para https://ray.run/.
Naturalmente, el precio variará dramáticamente dependiendo de la carga útil.
< div class =" cYdhWw dKnOgO geGbZz bGoBgk jkEels " >
< div class =" kSmiQp fPSBzf bnYmbW dXscgu xJzwH jTWvec gzBMzy " >
< h1 class =" fwYeZS fwlORb pdjVK bccLBY fsAQjR fyszFl WNJim fzozfU " >
Learn Playwright
</ h1 >
< h2 class =" cakMWc ptfck bBmAxp hSiiri xJzwS gnfYng jTWvec fzozfU " >
Resources for learning end-to-end testing using Playwright automation
framework
</ h2 >
< div
class =" bLTbYS gvHvKe cHEBuD ddgODW jsxhGC kdTEUJ ilCTXp iQHbtH yuxBn ilIXfy gPeiPq ivcdqp isDTsq jyZWmS ivdkBK cERSkX hdAwi ezvbLT jNrAaV jsxhGJ fzozCb "
> </ div >
</ div >
< div class =" cYdhWw dpjphg cqUdSC fasMpP " >
< a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /blog "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Blog </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Learn in depth subjects about end-to-end testing. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /ask "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Ask AI </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Ask ChatGPT Playwright questions. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /tools "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Dev Tools </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > All-in-one toolbox for QA engineers. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /jobs "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > QA Jobs </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Handpicked QA and Automation opportunities. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /questions "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Questions </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Ask AI answered questions about Playwright. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /discord-forum "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Discord Forum </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Archive of Discord Forum posts about Playwright. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /videos "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Videos </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Tutorials, conference talks, and release videos. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /browser-extension "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > Browser Extension </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > GUI for generating Playwright locators. </ p >
</ div > </ a
> < a
class =" gacSWM dCgFix conipm knkqUc bddCnd dTKJOB leOtqz hEzNkW fNBBKe jTWvec fIMbrO fzozfU group "
href =" /wiki "
> < div class =" plfYl bccLBY hSiiri fNBpvX " > QA Wiki </ div >
< div class =" jqqjPD fWDXZB pKTba bBmAxp hSiiri evbPEu " >
< p > Definitions of common end-to-end testing terms. </ p >
</ div > </ a
>
</ div >
< div
class =" kSmiQp fPSBzf pKTba eTDpsp legDhJ hSiiri hdaZLM jTWvec gzBMzy bGySga fzoybr "
>
< p class =" dXhlDK leOtqz glpWRZ fNCcFz " >
Use < kbd class =" bWhrAL XAzZz cakMWc bUyOMB bmOrOm fyszFl dTmriP " > ⌘ </ kbd > +
< kbd > k </ kbd > + "Tools" to quickly access all tools.
</ p >
</ div >
</ div > La función auto utiliza Sanitize-HTML para desinfectar el HTML de la página antes de enviarla a OpenAI. Esto se hace para reducir los costos y mejorar la calidad del texto generado.
Este proyecto se inspira en Zerostep. Zerostep ofrece una API similar pero con una implementación más sólida a través de su backend patentado. Auto Playwright fue creado con el objetivo de explorar la tecnología subyacente de Zerostep y establecer una base para una versión de código abierto de su software. Para los entornos de producción, sugiero optar por Zerostep.
Aquí hay una comparación de lado a lado de Auto Playwright y Zerostep:
| Criterios | Dramaturgo automático | Zerostep |
|---|---|---|
| Utiliza la API de OpenAI | Sí | No 1 |
| Usa indicaciones de texto sencillo | Sí | No |
Utiliza functions sdk | Sí | No |
| Utiliza desinfectación HTML | Sí | No |
| Utiliza la API de dramaturgo | Sí | No 2 |
| Utiliza capturas de pantalla | No | Sí |
| Utiliza la cola | No | Sí |
| Utiliza WebSockets | No | Sí |
| Instantáneas | Html | Domina |
| Implementa el paralelismo | No | Sí |
| Permite desplazarse | No | Sí |
| Proporciona accesorios | No | Sí |
| Licencia | MIT | MIT |
MIT License
Copyright (c) 2023 Reflect Software Inc
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Utiliza la API patentada de Zerostep. ↩
Utiliza algunas API de dramaturgo, pero depende predominantemente del Protocolo Chrome DevTools (CDP). ↩