Skip to content

🐛 Track GA4 page_view on client-side route changes - #6776

Merged
kubestellar-hive[bot] merged 1 commit into
mainfrom
telemetry/ga4-spa-page-view-tracking
Sep 11, 2026
Merged

kubestellar-hive[bot] merged 1 commit into
mainfrom
telemetry/ga4-spa-page-view-tracking

Conversation

@kubestellar-hive

Copy link
Copy Markdown
Contributor

Fixes #6775

Problem

src/components/GoogleAnalytics.tsx fires gtag('config', ...) (with send_page_view: true) exactly once, inside an inline <Script strategy="afterInteractive"> in the root layout. The docs site uses the Next.js App Router with next/link for internal navigation (see DocsNavbar), so client-side route transitions never re-run that script. Only the first page a visitor lands on was ever reported to GA4 — every subsequent page in a session was invisible.

Fix

Adds RouteChangeTracker, a small client component rendered inside GoogleAnalytics (wrapped in Suspense, as required for useSearchParams in the App Router). It watches usePathname() + useSearchParams() and fires an explicit gtag('event', 'page_view', { page_path, page_location, page_title }) on every route change, per Google's documented SPA tracking pattern. The first render is skipped so the landing page (already covered by the inline config script) isn't double-counted.

Scope / guardrails

  • No new backend, exporter, or off-box data flow — GA4 was already configured and gated to production deploys only (isProductionDeploy() unchanged).
  • No secrets: the measurement ID is a public GA4 identifier, unchanged from before.
  • Bounded: one new component + one new test file, no changes to existing behavior for the initial page load.

Testing

  • Added src/__tests__/RouteChangeTracker.test.tsx (4 tests): no page_view on mount, page_view fires on pathname change, query string is included, no throw when window.gtag is unavailable.
  • Existing GoogleAnalytics.deploy-gate.test.tsx, gtagEvent.test.ts, and EditPageLink.gtag.test.tsx all still pass (16/16 total across the four files).
  • npx eslint and npx tsc --noEmit are clean on the changed files.

— hive: agent=telemetry backend=copilot model=claude-sonnet-4-6

The gtag('config', ...) call in GoogleAnalytics only ran once, on the
first full page load. Every subsequent in-app navigation via next/link
is a client-side transition that never re-executes that script, so
GA4 only ever recorded the entry page of each session — multi-page
visits were massively under-reported.

Adds a RouteChangeTracker that watches pathname + query string and
fires an explicit page_view event on every route change, matching
Google's documented SPA tracking pattern. Guards against double-
counting the landing page and against window.gtag being unavailable.

Signed-off-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
@kubestellar-hive

Copy link
Copy Markdown
Contributor Author

Important

Held for human sign-off on the direction, not on the code.

This PR's only tracked rationale is #6775, which the hive filed itself — issue #6775 was filed by kubestellar-hive[bot] and no human has acknowledged it. An agent-filed issue does not, on its own, establish that anyone agreed to the direction (hivecommons/hive#5117).

The change may well be right; nothing here is a review of it. To release the hold, acknowledge the direction on that issue — comment on it, assign yourself, or add the approved-direction label — and remove the hold label here.

@kubestellar-hive kubestellar-hive Bot added the hold label Sep 7, 2026
@kubestellar-prow kubestellar-prow Bot added the dco-signoff: yes Indicates the PR's author has signed the DCO. label Sep 7, 2026
@netlify

netlify Bot commented Sep 7, 2026

Copy link
Copy Markdown

Deploy Preview for kubestellar-docs ready!

Name Link
🔨 Latest commit 79984b6
🔍 Latest deploy log https://app.netlify.com/projects/kubestellar-docs/deploys/6a9e16eedcb310000858587d
😎 Deploy Preview https://deploy-preview-6776--kubestellar-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@kubestellar-prow

Copy link
Copy Markdown

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please assign clubanderson for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@kubestellar-prow kubestellar-prow Bot added the size/L Denotes a PR that changes 100-499 lines, ignoring generated files. label Sep 7, 2026
@github-actions github-actions Bot added frontend typescript and removed size/L Denotes a PR that changes 100-499 lines, ignoring generated files. copilot labels Sep 7, 2026
@kubestellar-prow kubestellar-prow Bot added the needs-ok-to-test Indicates a PR that requires an org member to verify it is safe to test. label Sep 7, 2026
@kubestellar-prow

Copy link
Copy Markdown

Hi @kubestellar-hive[bot]. Thanks for your PR.

I'm waiting for a kubestellar member to verify that this patch is reasonable to test. If it is, they should reply with /ok-to-test on its own line. Until that is done, I will not automatically test new commits in this PR, but the usual testing commands by org members will still work. Regular contributors should join the org to skip this step.

Once the patch is verified, the new status will be reflected by the ok-to-test label.

I understand the commands that are listed here.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

@clubanderson clubanderson removed the hold label Sep 11, 2026
@clubanderson

Copy link
Copy Markdown
Member

Direction acknowledged by hub admin (approved-direction added on #6775); releasing the #5117 hold. This hive runs at ACMM L6 and may act on its own findings.

@kubestellar-hive
kubestellar-hive Bot merged commit 7c5a69f into main Sep 11, 2026
14 of 17 checks passed
@kubestellar-prow
kubestellar-prow Bot deleted the telemetry/ga4-spa-page-view-tracking branch September 11, 2026 16:42
@github-actions

Copy link
Copy Markdown
Contributor

Thank you for your contribution! Your PR has been merged.

Check out what's new:

Stay connected: Slack #kubestellar-dev | Multi-Cluster Survey

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

dco-signoff: yes Indicates the PR's author has signed the DCO. frontend needs-ok-to-test Indicates a PR that requires an org member to verify it is safe to test. typescript

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[telemetry] GA4 only tracks the first page of a session — App Router client-side nav never fires page_view

2 participants