whatwg what spec language español consortium javascript debugging google-chrome-extension

javascript - what - Depurar popup.html de una extensión de Chrome?



what is html (4)

Haga clic derecho en el botón de la extensión, luego ''Inspeccionar ventana emergente''

Estoy haciendo una extensión de Chrome y necesito ver el HTML / CSS / JS de popup.html .

No puedo hacer clic derecho para inspeccionar los elementos. ¿Hay otra manera? Necesito asegurarme de que CSS y JavaScript se inserten correctamente. Cómo depurar un problema en ese archivo emergente?


Inspect Popup se ha ido con la última versión.

Así es como debo depurar las ventanas emergentes de la extensión de Chrome.

  1. Haga clic en su botón emergente para ver la página web (la ventana emergente misma).
  2. Haga clic derecho en la ventana y seleccione Inspeccionar elemento
  3. La ventana del depurador de Chrome aparece con el contexto correcto, pero ya ha omitido sus puntos de corte y declaraciones de debugger .
  4. AQUÍ ESTÁ EL TRUCO. Haga clic en la parte de la consola del depurador y escriba: location.reload(true) y presione enter.

¡Ahora tus puntos de quiebre son golpeados! Una excelente forma de volver a cargar los scripts cambiados sin volver a visitar la página de extensiones.


Quizás otra forma sea encontrar la ID: para su aplicación en chrome: // chrome / extensions /

A continuación, puede cargar su ventana emergente en una ventana normal

chrome-extension://id_of_your_application/popup.html

Intercambie popup.html por el archivo que ha especificado en manifest.json en la propiedad "default_popup".


Sí, "Inspeccionar emergente" en el ícono de la extensión, y aparte de eso, desde el administrador de extensiones también puede inspeccionar su página de opciones.