Astro Dev Toolbar App // CHROME BUILT-IN AI
astro-dev-broken-anchor-healer
Detect broken internal #anchor targets and fuzzy-match renamed headings.
01. Architectural Specifications
STATUS: PRODUCTION READY
[ 01 // CAPABILITY ]
Anchor Link Scanner
Finds all internal href links and verifies them against active DOM id attributes.
[ 02 // CAPABILITY ]
Semantic Fuzzy Matching
Combines Levenshtein edit distance with Gemini Nano to match renamed heading IDs.
[ 03 // CAPABILITY ]
1-Click DOM Fixer
Highlights the broken anchor in viewport and updates the DOM attribute to verify link target instantly.
02. Implementation & Usage
BUN / ASTRO 5+
// Installation
CLI
bun add astro-dev-broken-anchor-healer
# or
pnpm add astro-dev-broken-anchor-healer
// Configuration
astro.config.mjs
// astro.config.mjs
import { defineConfig } from "astro/config";
import devBrokenAnchorHealer from "astro-dev-broken-anchor-healer";
export default defineConfig({
integrations: [
devBrokenAnchorHealer({
autoScanOnRoute: true
})
]
});
// Chrome Built-in AI Prerequisites
- 1. Open
chrome://flagsin Google Chrome 128+ - 2. Set
#prompt-api-for-gemini-nanoto Enabled - 3. Set
#optimization-guide-on-device-modelto Enabled ByPassPerfRequirement - 4. Restart Chrome and verify model status at
chrome://components