SuperAPI AI Directory
Partner with us中文AI newsFavorites
Skillscodeguard-html

codeguard-html

Testing & quality

View repository

Updated 10-15 21:47

About this skill

HTML Codeguard Gate

Goal: turn "looks fine" into repeatable tool evidence, and honestly distinguish pass, fail, unverifiable, and planned.

Start in 30 Seconds

  1. At the repository root, confirm 无专用标记文件 or the target file exists.
  2. Probe the tool:npx --no-install htmlhint --version。
  3. Read-only check first:bash -c 'find . \( -name '"'"'*.html'"'"' -o -name '"'"'*.htm'"'"' \) -type f -not -path '"'"'*/node_modules/*'"'"' -exec grep -L '"'"'<%'"'"' {} + | xargs -0 -r npx --no-install htmlhint'。
  4. Classify results as: code violations, missing configuration, missing tools, tool internal errors.
  5. Only perform safe fixes:prettier --write。
  6. Rerun lint, and run the project's existing test/build gates.

You can directly ask:

  • "Check this HTML project, don't modify anything yet, and give me a classification of lint failures."
  • "Only fix HTML formatting issues; list semantic issues first."
  • "Verify HTML lint, test, and build evidence before committing."

Capability Boundaries

✅ Good at handling

  1. Based on .html, .htm and project markers, identify the HTML workspace.
  2. Run npx --no-install htmlhint '{file}' and preserve exit codes, scope, and tool version.
  3. Distinguish formatting, static rules, configuration, dependency, and environment failures.
  4. Use prettier --write to handle reversible issues and rescan.
  5. Report local results in layers alongside CI/build/test evidence.

⚠️ Requires conditions

  1. The target tool must already be installed and its version compatible with the project constraints.
  2. It must be executed from the correct repository or module root directory.
  3. If the project has custom configuration, the committed configuration takes precedence.
  4. Whether generated code, vendor, and cache directories are scanned must follow repository rules.

❌ Not applicable

  1. Do not treat formatter passing as compilation, test, or security audit passing.
  2. Do not silently install tools, upgrade dependencies, or modify team rules.
  3. Do not use suppress/ignore/raising thresholds to hide real issues.
  4. Do not claim "checks passed" when tools or configuration are missing.

When to Use

  • The user requests checking or fixing HTML code standards.
  • AI modifies .html, .htm, requiring pre-commit verification.
  • CI shows failures related to npx --no-install htmlhint '{file}' .
  • Need to determine whether an issue can be automatically fixed or must be handled manually.

When Not to Use

  • When the main task is learning language syntax, framework design, or business modeling, use the corresponding language professional skill instead.
  • When the main task is dependency vulnerabilities, security auditing, or license governance, use a dedicated security skill.
  • When the user only asks to explain a single error and there is no project context, provide a local explanation first and do not claim the repository is all green.

Data and Security

This skill does not collect, upload, send, or store user code or credentials. By default it only reads local repository configuration and runs local tools; it does not install dependencies over the network, and does not record tokens, passwords, or private source code. Before any automated fix, check the diff first; destructive or large-scale changes must be explicitly confirmed by the user.

Execution Contract

Project Current Facts
Status stable(Since Codeguard V0.3)
File Extensions .html, .htm
Project Marker No dedicated marker file
Integration Configuration Based on the repository's existing configuration
Tool Preparation npm install -g htmlhint
Probe Commands npx --no-install htmlhint --version
lint npx --no-install htmlhint '{file}'
format/fix prettier --write
Project-level gate bash -c 'find . \( -name '"'"'*.html'"'"' -o -name '"'"'*.htm'"'"' \) -type f -not -path '"'"'*/node_modules/*'"'"' -exec grep -L '"'"'<%'"'"' {} + | xargs -0 -r npx --no-install htmlhint'

Standard Workflow

Step 1: Determine the Actual Scope

Confirm the repository root, module roots, generated directories, vendor directories, and user-specified files. For multi-module projects, list the modules that will be scanned first; do not guess based on the current directory.

Step 2: Read the Project Contract

Read Based on the repository's existing configuration and the actual commands in CI. Repository configuration takes precedence over this skill's examples; if the two conflict, report the differences first.

Step 3: Probe Tools and Versions

Run npx --no-install htmlhint --version. Missing tools, incompatible versions, or configuration that fails to load are all recorded as "unable to verify", not as passing.

Step 4: Run Read-Only Checks

Run bash -c 'find . \( -name '"'"'*.html'"'"' -o -name '"'"'*.htm'"'"' \) -type f -not -path '"'"'*/node_modules/*'"'"' -exec grep -L '"'"'<%'"'"' {} + | xargs -0 -r npx --no-install htmlhint', recording the command, working directory, exit code, tool version, and the first actionable error.

Step 5: Failure Classification

Type Typical Signal Handling
Format Indentation, whitespace, import order Formatter allowed, then check the diff
Static Rules unused, complexity, naming, dangerous APIs Minimal semantic fixes, no bulk guessing
Configuration parser/config/schema not found Fix the integration or report prerequisites
Environment command not found, version conflicts Report installation/version requirements, do not silently install
Tool Internal Errors crash, timeout, parser exception Preserve the raw evidence, narrow the reproduction scope

Step 6: Controlled Fixes

Prefer running prettier --write. Only handle issues that are certain and reversible; dependency upgrades, rule exemptions, generated files, and business semantic changes must be explained separately.

Step 7: Verification Loop

Re-run the same lint command, then run the project's existing tests and build. Only write "pass" when the command, scope, and exit code are all explicit; otherwise write "not run" or "unable to verify".

Rules

  1. Re-verify with the Same Command: after fixing, the original command that triggered the failure must be re-run.
  2. Layered Evidence: report lint, format, compile, test, and security separately.
  3. Minimal Changes: no incidental refactoring, do not expand style fixes into business rewrites.
  4. Configuration First: do not override the project's existing ignore, dialect, target, or version constraints.
  5. No Fabrication: tools not run, configurations not seen, and platforms not verified must be explicitly labeled.

Output Template

HTML Codeguard 结果
- 范围：<仓库/模块/文件>
- 工具：<名称与版本>
- 命令：<实际命令>
- 状态：PASS / FAIL / UNVERIFIED / PLANNED
- 发现：<按格式/规则/配置/环境分类>
- 修改：<文件与原因；无修改写 none>
- 复验：<命令、退出码>
- 未验证：<测试/构建/平台差异>

Gotchas

  1. Missing Tools Are Not a Pass — must output UNVERIFIED and an explicit preparation method.
  2. formatter is not a linter — All green formatting cannot override static rules or compilation errors.
  3. Root directory determines the result — Running in the wrong module may miss detection or load the wrong config.
  4. Placeholders are not literal arguments — {file} must be replaced with real, authorized paths.
  5. Auto-fix may expand the diff — After fixing, review the diff first, then run the regression gate.
  6. Generated and vendor directories need an explicit policy — Do not scan or modify third-party content across the whole repo at will.

Domain pitfalls and fixes

  1. Domain pitfalls — Template files may contain server-side syntax; when HTMLHint fails to parse, first confirm whether it should be handed to a template-specific tool.

When information is insufficient

Do not just say "please provide more information." First give a safe read-only inspection plan, and list the specific items that still need confirmation:

  1. Repository/module root directory;
  2. Target tools and versions;
  3. Project config files;
  4. Authoritative commands in CI;
  5. Whether auto-fix is allowed.

FAQ

Q1: If the tool is not installed, can we conclude the code is fine? No. The status must be UNVERIFIED。

Q2: Can ignore or suppression be added automatically? No. Exemptions may be granted only when the user explicitly accepts and the reason is recorded.

Q3: Why does it still fail after formatting? The formatter only covers formatting; static rules, config, compilation, and tests still need to be handled separately.

Q4: Should generated code be scanned? By default, follow the repository config; when there are no rules, exclude generated/vendor first, then explain to the user.

Q5: How can we avoid changing too much at once? First fix in batches by failure category and file; rerun the original command and review the diff for each batch.

Q6: If it passes locally, can we say CI will pass? No. CI's versions, environment variables, operating system, and command scope also need to be aligned.

Load resources as needed

  • When encountering exit codes, failure classification, or exemption decisions, read references/rules/gate-rules.md。
  • When you need to check this language's registry, toolchain, and project config, read references/tooling/toolchain.md。
  • When you need copyable task examples, read by scenario examples/; there is no need to load all at once.