feat(plugin-a11y): load the in-page agent into hub hosts for a live host report#56
Open
antfubot wants to merge 1 commit into
Open
feat(plugin-a11y): load the in-page agent into hub hosts for a live host report#56antfubot wants to merge 1 commit into
antfubot wants to merge 1 commit into
Conversation
…ost report The docked A11y Inspector mounts its panel in the minimal hubs, but nothing loaded the in-page agent into the host's own page, so the panel stayed stuck at "No page connected" — no scan, no report, no highlight. Give hosts a first-class way to bridge the agent in, honoring devframe's rule that the agent is author-provided: - `a11yAgent()` (from `@devframes/plugin-a11y/vite`) serves the prebuilt agent bundle same-origin and injects its module script into the page Vite serves. - `a11yAgentBundlePath` and `A11Y_AGENT_PATH` are exported so any other host can serve the bundle and place the tag itself. Wire both minimal hub examples to it — Vite via `a11yAgent()`, Next by serving the bundle through the catch-all route and loading it from the root layout — so the inspector now shows a live axe-core report of the hub's own page and hover-to-highlight rings the offending element in the host UI. Created with the help of an agent.
✅ Deploy Preview for devfra ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What & why
The a11y inspector splits into a panel (the docked Solid SPA), a node backend, and an agent (
dist/inject/inject.js) that runs axe-core inside the host page and talks to the panel over a same-originBroadcastChannel. Both minimal hubs mounted the panel, but nothing ever loaded the agent into the host page — so the A11y Inspector sat permanently at "No page connected": no scan, no report, no highlight.devframe deliberately keeps its hands off the host DOM ("the agent is the author-provided bridge"), so this gives hosts a first-class, opt-in way to wire the agent in.
Changes
@devframes/plugin-a11ya11yAgent()(@devframes/plugin-a11y/vite) — serves the prebuilt agent bundle same-origin and injects its module script into the page Vite serves (dev-only; degrades to a console hint if the bundle isn't built).a11yAgentBundlePath+A11Y_AGENT_PATHexports so any non-Vite host can serve the bundle and place the tag itself.A11Y_AGENT_PATH.minimal-vite-devframe-hubaddsa11yAgent();minimal-next-devframe-hubserves the bundle through its catch-all route and loads it from the root layout.tsnapisnapshot refresh for the new exports; new unit test fora11yAgent().Verified
Ran both hubs in a real browser: the agent is injected, the panel connects (
websocket,axe 4.12.1), and lists live axe-core violations for the host page — Vite hub 2 serious, Next hub 1 serious color-contrast — with hover-to-highlight ringing the offending element in the host UI.pnpm lint,typecheck,test(537 passed), andbuildall green.Created with the help of an agent.