✒️SAP BTPFIORI / La configuración del test unitario y las herramientas de debugging Por Nilson Parra Martinez

• La realización del test unitario desde el BAS

El texto describe el proceso de realizar pruebas unitarias en el entorno de desarrollo utilizando SAP BAS (SAP Business Application Studio). A continuación se resumen los conceptos principales:

Acceso al SAP BAS: Se ingresa al SAP BAS para realizar las pruebas unitarias en el entorno de desarrollo.

Configuración de ejecución: Se crea una configuración de ejecución haciendo clic en el botón de "Run Configuración". Se selecciona el archivo ejecutable HTML5 y la versión de SAPUI5.

Dependencias: Se muestran las dependencias disponibles, incluyendo dependencias de servicio y fuentes de datos.

Vinculación de la aplicación: Si se necesita una conexión a un sistema backend, se vincula la aplicación al destino correspondiente.

Ejecución de la prueba: Una vez que las dependencias están vinculadas correctamente, se puede ejecutar la prueba de la aplicación haciendo clic en el botón de ejecución.

Script de ejecución: El script de ejecución se encuentra en el archivo "launch.json", al que se accede haciendo clic derecho sobre la carpeta.

Resultado de la prueba: Al ejecutar el proyecto, se muestra el resultado, que en este caso es una lista de órdenes de venta.

Pasos de inicio de la aplicación: Se describen los pasos que se ejecutan al iniciar la aplicación, incluyendo la carga de recursos, la creación de modelos y controladores, y la evaluación de las vinculaciones de las vistas.

Detener la ejecución: Si se desea detener la ejecución, se puede ir al modo de depuración y hacer clic en el botón de detener.

En resumen, el texto explica cómo realizar pruebas unitarias en SAP BAS, incluyendo la configuración, la vinculación de dependencias, la ejecución de la prueba y la visualización de los resultados. También se mencionan los pasos de inicio de la aplicación y cómo detener la ejecución.

• Las herramientas de desarrollo de Google Chrome

El texto habla sobre las herramientas de desarrollo de Google Chrome, conocidas como DevTools. Estas herramientas son útiles para el desarrollo web y la depuración dentro del navegador. Los paneles incluidos en DevTools son elementos, conectividad, fuentes, línea de tiempo, perfiles, recursos, auditorías y consolas. Se explica cómo acceder a las herramientas de desarrollo y cómo examinar y editar el HTML y el CSS de una página web. También se menciona cómo abrir las herramientas y se proporcionan atajos de teclado. Se describen los diferentes paneles disponibles en DevTools, como Elementos, Consola, Fuentes, Red, Línea de tiempo, Perfiles, Aplicación, Seguridad y Auditorías, y se explica qué información se puede obtener de cada uno de ellos.

• La activación del sistema de análisis de aplicaciones para SAPUI5

La activación del sistema de análisis de aplicaciones para SAPUI5 es una herramienta específica y útil que facilita el análisis de una aplicación en ejecución. Permite obtener información sobre la versión de las librerías de SAPUI5 y determinar qué componentes se pueden utilizar. Además, se pueden acceder a otras herramientas como el diagnóstico de SAPUI5 y el asistente de soporte. El diagnóstico de SAPUI5 muestra información técnica y permite activar el modo de depuración para ver el código y comentarios originales de la aplicación. El archivo manifest.json contiene la configuración global de la aplicación. El asistente de soporte proporciona reglas de validación y consejos para solucionar errores, mostrando el análisis en paneles que incluyen el árbol de objetos, los errores detectados y explicaciones del problema.

• Las extensiones de Google Chrome

Inspector UI5: Es una extensión gratuita y de código abierto que se instala en el panel de DevTools de Chrome. Permite analizar y examinar el código de UI5.

JSONView: Esta extensión muestra el contenido JSON de forma estructurada y permite expandir y contraer elementos de la jerarquía según sea necesario.

XML Tree: Similar a JSONView, esta extensión formatea el contenido XML de manera estructurada y ofrece la capacidad de expandir y contraer elementos jerárquicos.

• El análisis de las vistas y controladores

El texto habla sobre el análisis de vistas y controladores en una aplicación. Se menciona que al revisar el código de una aplicación, la mayor parte del tiempo se dedica a examinar las vistas y los controladores. Las vistas suelen estar en formato XML, mientras que los controladores están escritos en JavaScript. El panel Red en DevTools de Chrome permite ver el código fuente de las vistas y los controladores. Para ver las definiciones de vista XML, es necesario filtrar por "view.xml" en el panel. También se menciona que el panel de código fuente ofrece más funcionalidades, como establecer puntos de interrupción, examinar el estado de la aplicación y realizar cambios temporales en el código fuente. Finalmente, se menciona el panel de consola, que muestra los mensajes ingresados y las respuestas obtenidas.

• Cómo colocar un breakpoint

El texto explica cómo colocar breakpoints en una aplicación para detener la ejecución y examinar su estado. Se mencionan varias opciones para establecer breakpoints en el depurador del navegador, como hacer clic en el número de línea o hacer clic con el botón derecho para deshabilitar o editar breakpoints existentes. También se menciona que se puede utilizar la sentencia "debugger" en el código para establecer un breakpoint. Para entrar en modo debug en Google Chrome, se puede usar la tecla F12 o "Ctrl Shift I" y seleccionar la pestaña de fuentes. Se menciona que se puede saltar un breakpoint con la tecla F8. Luego, se menciona la función de búsqueda de una aplicación y cómo encontrar y examinar el código relacionado con esa función. También se explica cómo ver el valor de los parámetros de una función y cómo establecer un breakpoint en una línea específica del código. Finalmente, se menciona que se puede buscar recursos utilizando la combinación de teclas "Ctrl P".

• Los modelos OData

El texto menciona los siguientes conceptos:

Modelo de OData: Se refiere a una instancia de un modelo de OData en tiempo de ejecución que recupera un documento de metadatos y proporciona un mecanismo para acceder a recursos relacionados.

Recurso $metadata: Es un recurso específico en OData que contiene información sobre la estructura y los metadatos del servicio. Puede ser visualizado en el panel de red.

Llamado al servicio: Se refiere a la solicitud realizada al servicio de OData con los datos seleccionados en la pantalla.

Depuración de código: Se menciona la posibilidad de escribir código de depuración en la consola, como el uso del método "oEvent.getParameter("listItem")" para obtener el ítem seleccionado, y "oEvent.getParameter("listItem").getBindingContext().getProperty("SalesOrderID")" para obtener un valor específico.

Registros de nivel de depuración: Se menciona la capacidad de ver mensajes de información, advertencias y errores en los registros de depuración. También se menciona la posibilidad de filtrar los mensajes según el tipo de error deseado.

En resumen, el texto habla sobre el uso de modelos de OData, la visualización de recursos $metadata, la realización de llamados al servicio, la depuración de código y la visualización de registros de depuración con filtros en la consola de Chrome DevTools.

• ¿Cómo emulo mis aplicaciones UI5 y Fiori como si se estuvieran ejecutando en dispositivos móviles?

El texto menciona que se puede emular aplicaciones UI5 y Fiori para que parezcan estar funcionando en dispositivos móviles utilizando la herramienta de "Emulación móvil en modo dispositivo" en Google Chrome DevTool. Es importante considerar los dispositivos móviles al construir aplicaciones SAPUI5 o extender las existentes de Fiori. Google Chrome ofrece la funcionalidad de verificar cómo funciona un sitio web o aplicación en un dispositivo móvil mediante pasos sencillos. Aunque algunas aplicaciones se utilizarán principalmente en computadoras de escritorio, es crucial estar preparado para dispositivos móviles y comprender las implicaciones del diseño y la codificación al simular las aplicaciones en dispositivos móviles. La herramienta de emulación permite simular la respuesta de las extensiones Fiori y aplicaciones SAPUI5 en una variedad de teléfonos inteligentes y tabletas, cambios en la orientación del dispositivo, emulación táctil y condiciones de red limitadas como 3G, LTE, 4G, inalámbrico y modo sin conexión.