Skip to main content

Astro

Add Monitoring to an Astro site with the @accessible-so/monitor-astro integration, one line in astro.config.mjs.

On this page

Astro has its own integration, @accessible-so/monitor-astro. It adds the loader to every page for you and works out the one thing a bare <script> tag cannot: which route pattern a concrete URL belongs to, so findings group by /products/[slug] rather than by one row per product. The patterns come from Astro's own route table, so they are exactly what your src/pages tree calls them.

Install the integration

Terminal
pnpm add @accessible-so/monitor-astro

The peer dependency is astro >=5.

Add it to your config

astro.config.mjs
// astro.config.mjs
import { defineConfig } from 'astro/config';
import accessibleMonitor from '@accessible-so/monitor-astro';

export default defineConfig({
  integrations: [accessibleMonitor({ siteKey: 'acc_rum_YOUR_SITE_KEY' })],
});

Replace acc_rum_YOUR_SITE_KEY with your site's own key — copy the snippet from your domain's Monitoring page, which already carries it. There is nothing to add per page or per layout.

The integration adds the loader tag to the <head> of every page. It never starts the engine itself: sampling and when the engine downloads stay the loader's own decision, exactly as they are with a plain script tag. See Configuration for both options.

What the pattern looks like

The pattern is the route as Astro names it: /products/[slug], /docs/[...parts]. Where a static page sits beside a dynamic one, such as /products/featured next to /products/[slug], the static page reports its own path, the same choice Astro's router makes. Under base: '/shop' the pattern is still /products/[slug], never /shop/products/[slug].

Navigation with Astro's client router (<ClientRouter />) needs nothing extra: each page reports its own pattern.

Compatibility

Tested end to end in a real browser against Astro 7.3.6 with static output. Astro 5 and 6 are supported by the integration API it uses (astro:routes:resolved, added in Astro 5), but have not been run in a browser.

Known limits

All of these end the same way: the finding is still reported, and the route pattern on it is absent rather than wrong.

  • No component attribution. Astro renders your components to plain HTML, so there is no component left in the page to attribute an element to.
  • A URL that matches no page route — your 404 page, or a path outside base — reports no pattern.
  • Endpoints and redirects are not routes for this purpose. They never render a page.

Check it's working

See Debugging to confirm the script is reporting.