Official Vue component for Font Awesome 7
87
Pending
Does it follow best practices?
Impact
87%
1.15xAverage score across 10 eval scenarios
Pending
The risk profile of this skill
{
"context": "Evaluates how well the solution leverages @fortawesome/vue-fontawesome to render masked icons. Focuses on wiring the library's icon, mask, maskId, and accessibility props rather than recreating SVG masking logic. Ensures masking behavior is stable across instances and rerenders.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Mask prop",
"description": "Base icon render uses FontAwesomeIcon's `mask` prop to supply the mask icon instead of manually building SVG masks.",
"max_score": 30
},
{
"name": "MaskId binding",
"description": "Provided `maskId` is passed through to FontAwesomeIcon's `maskId` prop so mask definitions and references share the caller's id.",
"max_score": 25
},
{
"name": "Auto id strategy",
"description": "When no maskId is given, a collision-free id is generated and bound via FontAwesomeIcon's `maskId` prop so multiple instances render distinct masks while keeping a stable id per instance.",
"max_score": 15
},
{
"name": "Icon prop handling",
"description": "Base icon input is forwarded through FontAwesomeIcon's `icon` prop using the package-supported input shapes (string, [prefix, name] tuple, or { prefix, iconName } object) without custom SVG paths.",
"max_score": 15
},
{
"name": "Title passthrough",
"description": "Optional title/aria text is relayed through FontAwesomeIcon's accessibility props (e.g., `title` or `titleId`) rather than custom wrappers.",
"max_score": 15
}
]
}docs
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10