Falha nos eventos de clique de pop-up da extensão: resolvendo violação da política de segurança de conteúdo

Descrição do erro

Em uma extensão do Chrome, clique em eventos no ícone da extensão e um botão na página pop-up não está gerando a resposta esperada de incremento de uma variável JavaScript.

Inspecionando a causa raiz

Para depure o problema, inspecione a página pop-up e examine os logs do console. A mensagem de erro provavelmente indica uma violação da Política de Segurança de Conteúdo (CSP):

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

Conformidade de CSP comprometida

Scripts embutidos na página HTML violam o CSP padrão. JavaScript in-line não é permitido sob esta política.

Solução: isolar JavaScript

Para resolver o problema, elimine todo o JavaScript in-line do arquivo HTML e coloque-o em um arquivo JavaScript separado.

Estrutura de código revisada

hello.html (página pop-up)

popup.js

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

Notas

• Substitua innerHTML por textContent ao alterar o texto para mitigar possíveis vulnerabilidades XSS.
• Esta solução garante a conformidade com CSP, permitindo a execução adequada de scripts e o tratamento de eventos de clique.