Depuración del código JavaScript para aplicaciones basadas en modelo

Las aplicaciones controladas por modelos usan recursos web de JavaScript para contener lógica personalizada. Estos recursos web proporcionan las bibliotecas que definen funciones que los desarrolladores registran como controladores de eventos.

Al ver una aplicación controlada por modelos en un explorador web, puede usar herramientas de desarrollo que proporcionan todos los exploradores modernos. Mediante estas herramientas, puede encontrar las bibliotecas de JavaScript cargadas en la aplicación controlada por modelos, establecer puntos de interrupción y depurar el código mediante métodos comunes.

Las aplicaciones controladas por modelos que se ven mediante aplicaciones móviles en Android o la aplicación de escritorio de Windows requieren algunos pasos más. Vea:

• Depurar JavaScript en aplicaciones móviles Android
• Depurar JavaScript en aplicaciones móviles iOS
• Depurar JavaScript en la aplicación de escritorio de Windows

Nota

Debido a la forma en que se agregan las bibliotecas a la página, es posible que no encuentre fácilmente la biblioteca que representa el recurso web de JavaScript. Es posible que estas bibliotecas no aparezcan en la lista de archivos o en la jerarquía de archivos de origen.

Si conoce el nombre del recurso web de JavaScript que desea depurar, para orígenes de Microsoft Edge o Google Chrome, use el Ctrl+P comando Abrir archivo para buscar el archivo por nombre e iniciar la depuración. Si tiene un controlador de eventos que provoca un error, pero no conoce el nombre del archivo, consulte Identificación del recurso web javaScript que provoca un error.

Más información:

• Documentación web de Mdn: ¿Qué son las herramientas de desarrollo del explorador?

  • Microsoft Edge Sources
  • Fuentes de Google Chrome
  • Mozilla Firefox Depurador de JavaScript
  • Pestaña del Depurador de Safari de Apple

Identificar el recurso web de JavaScript que causa el error

Cuando un controlador de eventos provoca un error de script en una aplicación basada en modelos, aparece el siguiente cuadro de diálogo:

Si selecciona el vínculo Mostrar detalles, puede encontrar los detalles que incluyen: nombre del evento, nombre de la función, nombre del recurso web, nombre de la solución y nombre del editor.

Xrm.Navigation.openalertDialog is not a function
Session Id: 53febd7c-3388-4ea5-a195-d84cf5883c30
Correlation Id: aaaa0000-bb11-2222-33cc-444444dddddd
Event Name: onsave
Function Name: Example.formOnSave
Web Resource Name: example_example-form-script
Solution Name: Active
Publisher Name: DefaultPublisherYourOrg
Time: Tue Jan 31 2023 13:36:34 GMT-0800 (Pacific Standard Time)

En este caso, el nombre de la función era incorrecto, openalertDialog debe ser openAlertDialog.

Nota

Puede obtener los mismos detalles sobre los errores usando Monitor. Para obtener más información, consulte Errores de scripts personalizados.

Depurar JavaScript en aplicaciones móviles en Android

Al usar recursos web de JavaScript para escenarios móviles, puede usar el dispositivo Android para depurar el código específico del dispositivo móvil y asegurarse de que funciona según lo previsto.

Para depurar JavaScript en aplicaciones móviles en Android, complete los tres pasos siguientes:

1. Configure su dispositivo

• Consulte la documentación de Android para habilitar las opciones de desarrollador y la depuración de USB en su dispositivo. Para obtener más información, consulte Desarrolladores de Android: Configurar opciones de desarrollador en dispositivos.

• En el navegador Microsoft Edge o Chrome, descubra su dispositivo Android. Para obtener más información, consulte Desarrolladores de Chrome: Depuración remota de dispositivos Android.

  • En Microsoft Edge: edge://inspect/#devices
  • En Chrome: chrome://inspect/#devices

Nota

Asegúrese de que la opción Descubrir dispositivos USB se encuentre activada.

2. Configure la aplicación móvil

1. En la aplicación móvil, vaya a la lista de Power Apps y seleccione el botón de menú.
2. Asegúrese de que el interruptor Habilitar depuración remota para aplicaciones basadas en modelos esté activado.
3. Aparece un cuadro de diálogo de confirmación al habilitar esta opción. Seleccione Confirmar.

3. Depure desde su máquina de desarrollo

1. Conecte el equipo al dispositivo Android.

2. Abra cualquier aplicación controlada por modelos desde Power Apps o la aplicación Field Service Mobile.

3. En la página edge://inspect/#devices de su navegador, busque la URL de su organización en la sección Objetivo remoto.

   

4. Seleccione inspeccionar.

Para obtener más información, consulte Microsoft Edge: Depurar dispositivos Android de forma remota.

Depurar JavaScript en aplicaciones móviles en iOS

Use Safari en un equipo Mac para depurar recursos web de JavaScript en iOS.

Para depurar JavaScript en aplicaciones móviles en iOS, complete los dos pasos siguientes:

1. Configure la aplicación móvil

1. En la aplicación móvil, vaya a la lista de Power Apps y seleccione el botón de menú.
2. Asegúrese de que el interruptor Habilitar depuración remota para aplicaciones basadas en modelos esté activado.

2. Depurar desde su Mac

1. Conecte su iPhone o iPad a su Mac.
2. Inicie Safari en el Mac.
3. En el menú Desarrollar, busque su iPhone conectado o iPad y, a continuación, busque Power Apps o Field Service.

Para obtener más información, consulte Inspección de iOS y iPadOS | Documentación para desarrolladores de Apple.

Depurar JavaScript en la aplicación de escritorio de Windows

Para depurar JavaScript en Windows, instale primero las aplicaciones de requisitos previos.

• Instale un entorno de ejecución de WebView2 en la máquina con una versión mínima de 111. Descargue el runtime de WebView2.
• Instale las herramientas remotas para Microsoft Edge desde Microsoft Store: Herramientas remotas para Microsoft Edge - Aplicaciones de Microsoft Store.

1. Configure su dispositivo Windows

1. Habilitar modo desarrollador.

   1. Abra Configuración de Windows>Privacidad & seguridad>Para desarrolladores.
   2. Habilitar modo desarrollador.

2. Habilitar portal del dispositivo.

   1. Abra Configuración de Windows>Privacidad & seguridad>Para desarrolladores.
   2. Habilitar portal del dispositivo.
   3. Seleccione Sí para instalar el paquete del modo de desarrollador de Windows cuando se le solicite.
   4. Una vez habilitado Device Portal, anote la dirección URL que usa para conectarse a través de localhost. En la mayoría de los dispositivos, es https://localhost:50080.
   5. Para depurar Power Apps o Field Service Mobile localmente, puede continuar con Restringir a las conexiones de retorno solamente habilitada y la autenticación deshabilitada (de lo contrario, debe configurar una contraseña de usuario).

   Aquí hay un resumen de captura de pantalla de la configuración de desarrollador recomendada:

   

2. Configurar la aplicación Windows

Configure la aplicación de escritorio de Windows Power Apps o Field Service para la depuración remota.

Use el comando Ejecutar (el acceso directo es Windows + R) y use el siguiente enlace profundo para iniciar la aplicación de Windows con argumentos especiales.

• Power Apps: ms-apps://?addWebView2AdditionalBrowserArgument=--enable-features=msEdgeDevToolsWdpRemoteDebugging
• Aplicación Móvil de Servicio de Campo: ms-apps-fs://?addWebView2AdditionalBrowserArgument=--enable-features=msEdgeDevToolsWdpRemoteDebugging

3. Depurar desde Windows

1. Inicie Power Apps o Field Service para Windows.

2. Abra el navegador Microsoft Edge y vaya a edge://inspect.

3. Utilice la sección Conectar a un dispositivo Windows remoto y conéctese a http://localhost:50080. Se tarda unos segundos en conectarse, pero verá la dirección URL de la organización.

   

4. Seleccione inspeccionar y se abrirá DevTools.

Artículos relacionados

Recursos web de JavaScript
Depurar una aplicación basada en modelo con Monitor
Solucionar problemas en la aplicación móvil Power Apps