Error en eventos de clic emergente de extensión: resolución de infracción de la política de seguridad de contenido

Descripción del error

En una extensión de Chrome, haga clic en eventos tanto en el icono de la extensión como en un botón dentro de la página emergente no genera la respuesta esperada de incrementar una variable de JavaScript.

Inspeccionando la causa raíz

Para depurar El problema, inspeccione la página emergente y examine los registros de la consola. El mensaje de error probablemente indica una violación de la Política de seguridad de contenido (CSP):

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".

Cumplimiento de CSP comprometido

Los scripts en línea dentro de la página HTML violan el CSP predeterminado. Esta política no permite JavaScript incorporado.

Solución: aislar JavaScript

Para resolver el problema, elimine todo el JavaScript incorporado del archivo HTML y colóquelo en un archivo JavaScript separado.

Estructura de código revisada

hello.html (página emergente)

popup.js

var a = 0;
function count() {
  a  ;
  document.getElementById('demo').textContent = a;
}
document.getElementById('do-count').onclick = count;

Notas

• Reemplace InnerHTML con textContent cuando cambie el texto para mitigar posibles vulnerabilidades XSS.
• Esta solución garantiza el cumplimiento de CSP, lo que permite la ejecución adecuada de scripts y el manejo de eventos de clic.