SKILL.md 1.3 KB
name: verify-csp
description: Scan popup HTML and JS for Alpine.js CSP violations after editing popup code
Scan popup/popup.html and popup/popup.js for Alpine.js CSP compliance violations.
The extension runs under a Content Security Policy that forbids JavaScript evaluation, so Alpine.js attributes must never contain inline expressions.
Check for these violation patterns in HTML attributes (x-show, x-if, x-text, x-bind:*, :attr, @event, etc.):
- Equality/comparison operators:
===,!==,==,!=,>,< - Method or function calls:
foo(),this.bar() - Ternary expressions:
condition ? a : b - Logical operators used to compute values:
a && b,a || b - String concatenation or arithmetic
What is allowed:
- Simple property access:
x-show="isOpen",:class="activeClass" $el,$refs,$storeaccess without calling methods- Negation of a boolean property:
x-show="!isOpen"(acceptable)
For each violation found, report:
- File and line number
- The offending attribute and its current value
- The compliant fix — typically moving the logic into
Alpine.data()as a computed property or method, then binding the property name in the template
If no violations are found, confirm the popup is CSP-compliant.