Foto de Miguel Á. Padriñán de Pexels

Automatizar la verificación de texto (y su HTML) puede ser un desafío si no se siente cómodo con el lenguaje y el marco que está utilizando. Tener un tiempo limitado para aprender y explorar es su propio desafío. Una de mis tareas para automatizar una prueba de humo para nuestro proyecto fue verificar el texto en cada entorno, y cada configuración específica tenía su propio mensaje de bienvenida. Y lo admito, no estaba muy seguro de por dónde empezar. Sabía lo que necesitaba y descubrí dónde conseguirlo. Pero reunir todas las piezas no fue tan sencillo como parecía.

Comencé con la necesidad de obtener acceso a la base de datos. Y luego trabajar con nuestra configuración para asegurarme de que pueda usar la configuración de la aplicación (que le indica al marco dónde encontrar información y funciona con la configuración para mantener la información privada) para conectarme con la base de datos durante una ejecución. Luego podría juntar las piezas, obtener la información de la base de datos y compararla con la información mostrada para realizar pruebas.

Manualmente, fue simple; debería haber adivinado que esto significa que no iba a ser tan fácil como esperaba. Mirar el HTML y verificar que todo estuviera en el diseño adecuado fue simple. Entiendo lo suficiente del diseño HTML simple, por lo que fue una verificación rápida para asegurarme de que las palabras fueran correctas y continuar. Había hecho esta prueba de humo con muchas pausas para verificación manual por una razón. Entre esto y la lista de cosas que necesitaba verificar, me animarían a aprender, explorar y pedir ayuda para que esta automatización sea exitosa y aplicarla en las otras pruebas.

Una vez creado el acceso a la base de datos (¡y la cadena de conexión adecuada!), pude configurar el texto de las páginas como una variable. Esta fue la parte fácil: sabía lo que estaba haciendo aquí y me sentí realizado al lograrlo. Ejecuté la prueba de Playwright, con la esperanza de que el texto de la página coincidiera en términos de palabras, pero no con los componentes HTML. Y estaba en lo cierto: las palabras adecuadas estaban ahí, pero la prueba falló con el HTML agregado.

¡Tiempo de investigación! El primer intento fue usar Page.ContentAsync(), que es el comando para obtener el HTML completo de la página, incluidos los encabezados. Esto debería permitirme buscarlo y encontrar la subcadena del texto, ¿correcto? Como primera idea, no fue demasiado horrible: tenía guardado el HTML que estaba buscando y todo lo que tenía que hacer era recorrer todo el contenido del documento para localizarlo. ¡No es eficiente y ciertamente no es una buena práctica! Debería darme el resultado que necesitaba y luego podría repetirlo.

No fue así. No era posible encontrar rápidamente una subcadena en toda la página y quería que mi automatización fuera rápida. Después de algunas docenas de intentos para que esto funcionara como quería y teniendo en cuenta la regla del negocio (si no puedes resolverlo en 45 minutos de esfuerzo, es hora de preguntarle a otra persona), me reuní con uno de los desarrolladores. Sé que están ocupados y creando una actualización muy necesaria: la reunión finalizó con una nota adjunta que decía "podemos reprogramar si es necesario".

Mientras esperaba la reunión, seguí preocupándome por ello: uno de los desafíos para reducir el área era la clase del div: no tenía un buen nombre y, con Bootstrap, la posibilidad de duplicar divs con el El mismo nombre me había causado problemas en otras páginas. Hablando con alguien que había estado aquí mucho más tiempo que yo, descubrí que este era SIEMPRE el tercer div de la página.

Ahora tenía un nuevo plan para encontrarlo: usar el localizador Nth() y encontrar el div correcto. Me encantaría resolver esto, escribir la publicación que estoy escribiendo ahora y pasar al siguiente número antes de la reunión. Como muchos de ustedes sabrán y/o sospecharán, este es un buen detonante para que surja algo urgente, y así fue. Los planos se copiaron de una página a otra en el organizador durante varios días, hasta que llegó el momento de desarrollarlos en conjunto.

Trabajar con este desarrollador siempre es un placer: tenemos mucho en común y nos respetamos mutuamente. Además, ¡son buenos enseñando! Después de una rápida revisión de cuál era el objetivo, repasamos los intentos que había hecho para resolverlo. Dejé el último, con los errores en el IDE, con la esperanza de que fuera útil. ¡Y ahora a avanzar!

Utilizando el depurador, verificamos que el HTML se estuviera ingresando correctamente. Esta era un área que no había revisado por completo y, afortunadamente, era correcta. Estuvimos de acuerdo en que el nombre del div no era muy útil: el trabajo que habían realizado recientemente había creado otro div con el mismo nombre, pero en una página diferente. Eso se anotó pero se pospuso hasta que llegué a ese punto de la prueba.

Se necesitaban las habilidades en NUnit que tienen; la forma más fácil de verificar esta sección era usar el comando AreEqual. Esto permitió a la prueba comprobar que las cuerdas eran iguales. El dramaturgo estaba siendo terco. Quería localizadores en lugar de cadenas (o al revés) cuya elaboración simplemente requería demasiado tiempo. Y me alegré de aprender esta técnica. ¡Creo que será útil en el futuro!

Después de algunos intentos de hacer que Nth() funcione, recurrimos al uso de esa extraña clase div, después de asegurarnos de que solo se usara esta vez en la página. Eso nos dio un punto de partida: ahora debemos descubrir cómo incluir el HTML allí (afortunadamente, esto era lo único en ese div específico). Unos cuantos comienzos en falso más y finalmente abandoné la idea de que ContentAsync() para ese div no iba a funcionar, los llevaron a la solución que había probado y descarté.

InnerHtmlAsync() nos dio el contenido exacto del div. Espacios y todo. Y ese fue el siguiente obstáculo... y se nos acabó el tiempo para la reunión. Estuvieron dispuestos a darme unos minutos más, afortunadamente, principalmente porque era un problema que ya habían resuelto antes. Solo necesitaba la sintaxis para eliminar los espacios: Reemplazar(" ", "") si tenía curiosidad. Y eso permitió que la prueba se ejecutara, hasta que el siguiente PauseAsync() que agregué para la verificación manual la detuvo por un momento.

Se fueron a almorzar y yo pasé el siguiente bloque de tiempo preparando notas. Tenía otras cosas que encontrar y ahora tengo más pistas sobre cómo hacerlo.