# Security Visual Testing

Security-first visual testing combining URL validation, PII detection, and visual...

- Repository: https://github.com/proffesor-for-testing/agentic-qe (521 stars)
- Category: Design
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add proffesor-for-testing/agentic-qe --skill security-visual-testing -g -a claude-code -y`
Codex: `npx skills add proffesor-for-testing/agentic-qe --skill security-visual-testing -g -a codex -y`
Cursor: `npx skills add proffesor-for-testing/agentic-qe --skill security-visual-testing -g -a cursor -y`
Gemini CLI: `npx skills add proffesor-for-testing/agentic-qe --skill security-visual-testing -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add proffesor-for-testing/agentic-qe`

## Description

Security-first visual testing combining URL validation, PII detection, and visual regression with parallel viewport support. Use when testing web applications that handle sensitive data, need visual regression coverage, or require WCAG accessibility compliance.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Security Visual Testing

## Browser engine

Uses the **qe-browser** fleet skill (`.claude/skills/qe-browser/`) for all browser automation. The Vibium engine (10MB Go binary, WebDriver BiDi) is installed automatically by `aqe init`. For security-visual workflows, qe-browser adds two things on top of stock visual testing: `check-injection.js` (scans page content for prompt-injection patterns before screenshots are stored) and `assert.js` (16 typed checks including `no_failed_requests` for detecting data-leak requests).

```bash
# Before storing any screenshot, scan the page
vibium go "$TARGET_URL"
vibium wait load
node .claude/skills/qe-browser/scripts/check-injection.js --include-hidden
INJ=$?
if [ $INJ -ne 0 ]; then
  echo "Prompt-injection findings, do NOT store screenshot"
  exit $INJ
fi
# Safe to proceed with visual-diff
node .claude/skills/qe-browser/scripts/visual-diff.js --name "${PAGE_NAME}"
```

<default_to_action>
When performing security-aware visual testing:
1. VALIDATE URLs before navigation (check for malicious patterns)
2. SCAN for PII before saving screenshots (mask sensitive data)
3. CAPTURE parallel viewports (mobile, tablet, desktop)
4. COMPARE against baselines (detect visual regressions)
5. AUDIT accessibility (WCAG 2.1 AA compliance)

**Quick Security-Visual Checklist:**
- URL validation (no javascript:, data:, file: schemes)
- PII detection (emails, phones, SSN, credit cards, API keys)
- Visual regression (diff threshold < 0.1%)
- Viewport coverage (320px, 768px, 1024px, 1440px)
- Accessibility score (> 90% axe-core pass rate)

**Critical Success Factors:**
- Always mask PII before storing screenshots
- Test across all target viewports in parallel
- Store baselines in version control
- Run accessibility audits on every visual change
</default_to_action>

## Quick Reference Card

The rest: https://github.com/proffesor-for-testing/agentic-qe/blob/HEAD/.claude/skills/security-visual-testing/SKILL.md
