Depuración de complementos con herramientas de desarrollo para Microsoft Edge (Chromium)

En este artículo se muestra cómo depurar el código del lado cliente (JavaScript o TypeScript) del complemento cuando se cumplen las condiciones siguientes.

  • No se puede depurar mediante herramientas integradas en el IDE; o se encuentra con un problema que solo se produce cuando el complemento se ejecuta fuera del IDE.
  • El equipo usa una combinación de versiones de Windows y Office que usan el control de vista web perimetral (basado en Chromium), WebView2.

Sugerencia

Para obtener información sobre la depuración con Edge WebView2 (basado en Chromium) dentro de Visual Studio Code, vea Depurar complementos en Windows mediante Visual Studio Code y Microsoft Edge WebView2 (basado en Chromium).

Para determinar qué vista web está usando, vea Exploradores y controles de vista web que usan los complementos de Office.

Sugerencia

En las versiones recientes de Office, una manera de identificar el control de vista web que usa Office es a través del menú de personalidad en cualquier complemento donde esté disponible. (El menú personalidad no se admite en Outlook). Abra el menú y seleccione Información de seguridad. En el cuadro de diálogo Información de seguridad de Windows, runtime notifica Microsoft Edge, Microsoft Edge (versión anterior) o Internet Explorer. El tiempo de ejecución no se incluye en el cuadro de diálogo en versiones anteriores de Office.

Depuración de un complemento de panel de tareas mediante herramientas de desarrollo de Microsoft Edge (basadas en Chromium)

Nota:

Si el complemento tiene un comando de complemento que ejecuta una función, la función se ejecuta en un proceso en tiempo de ejecución del explorador oculto desde el que no se pueden iniciar las herramientas de desarrollo de Microsoft Edge (basadas en Chromium), por lo que la técnica descrita en este artículo no se puede usar para depurar código en la función.

  1. Transferir localmente y ejecutar el complemento.

    Nota:

    Para transferir localmente un complemento en Outlook, vea Transferir localmente complementos de Outlook para realizar pruebas.

  2. Ejecute las herramientas de desarrollo de Microsoft Edge (basadas en Chromium) mediante uno de estos métodos:

    • Asegúrese de que el panel de tareas del complemento tiene el foco y presione Ctrl+Mayús+I.
    • Haga clic con el botón derecho en el panel de tareas para abrir el menú contextual y seleccione Inspeccionar, o bien abra el menú personalidad y seleccione Asociar depurador. (El menú personalidad no se admite en Outlook).

    Nota:

    El nuevo cliente de escritorio de Outlook en ventana (versión preliminar) no admite el menú contextual ni el método abreviado de teclado para acceder a las herramientas para desarrolladores de Microsoft Edge. En su lugar, debe ejecutar desde olk.exe --devtools un símbolo del sistema. Para obtener más información, vea la sección "Depurar el complemento" de Desarrollo de complementos de Outlook para el nuevo Outlook en Windows (versión preliminar).

  3. Abra la pestaña Orígenes .

  4. Abra el archivo que desea depurar con los pasos siguientes.

    1. En el extremo derecho de la barra de menús superior de la herramienta, seleccione el botón ... y, a continuación, seleccione Buscar.
    2. Escriba una línea de código del archivo que desea depurar en el cuadro de búsqueda. Debe ser algo que no es probable que esté en ningún otro archivo.
    3. Seleccione el botón actualizar.
    4. En los resultados de la búsqueda, seleccione la línea para abrir el archivo de código en el panel situado encima de los resultados de la búsqueda.

    Pestaña de origen de las herramientas de desarrollo de Edge Chromium con 4 elementos etiquetados de A a D.

  5. Para establecer un punto de interrupción, seleccione el número de línea de la línea en el archivo de código. Aparece un punto rojo por la línea del archivo de código. En la ventana del depurador de la derecha, el punto de interrupción se registra en la lista desplegable Puntos de interrupción .

  6. Según lo necesite, ejecute funciones en el complemento para activar el punto de interrupción.

Sugerencia

Para obtener más información sobre el uso de las herramientas, consulte Introducción a Las herramientas de desarrollo de Microsoft Edge.

Depuración de un cuadro de diálogo en un complemento

Si el complemento usa la API de diálogo de Office, el cuadro de diálogo se ejecuta en un proceso independiente del panel de tareas (si existe) y la herramienta debe iniciarse desde ese proceso independiente. Siga estos pasos.

  1. Ejecutar el complemento.

  2. Abra el cuadro de diálogo y asegúrese de que tiene el foco.

  3. Abra las herramientas de desarrollo de Microsoft Edge (basadas en Chromium) mediante uno de estos métodos:

    • Presione Ctrl+Mayús+I o F12.
    • Haga clic con el botón derecho en el cuadro de diálogo para abrir el menú contextual y seleccione Inspeccionar.
  4. Use la herramienta igual que lo haría para el código en un panel de tareas. Consulte Depuración de un complemento de panel de tareas mediante las herramientas de desarrollo de Microsoft Edge (basadas en Chromium) anteriormente en este artículo.