A4A: Update page view tracker to split base path and query parameters.

[jkguidaven]

This PR enhances our page view tracking by separating the base path from query parameters, ensuring accurate grouping of page views by the base path.

Closes https://github.com/Automattic/automattic-for-agencies-dev/issues/1249

Proposed Changes

• Update the A4APageViewTracker to separate the query parameters from the base path during page view tracking.

Why are these changes being made?

To prevent duplicate track event names on the same page, ensure that the submitted path excludes query parameters, treating it as a single entity.

Testing Instructions

• Use the A4A live link and go to the /signup?ref=wordpress.com page.
• Confirm that the page view tracker correctly captures the base path and the ref parameters.
• You can expect this by filtering the network tab in your browser with .gif and looking for requests like the one below.

Pre-merge Checklist

• Has the general commit checklist been followed? (PCYsg-hS-p2)
• Have you written new tests for your changes?
• Have you tested the feature in Simple (P9HQHe-k8-p2), Atomic (P9HQHe-jW-p2), and self-hosted Jetpack sites (PCYsg-g6b-p2)?
• Have you checked for TypeScript, React or other console errors?
• Have you used memoizing on expensive computations? More info in Memoizing with create-selector and Using memoizing selectors and Our Approach to Data
• Have we added the "[Status] String Freeze" label as soon as any new strings were ready for translation (p4TIVU-5Jq-p2)?
• For changes affecting Jetpack: Have we added the "[Status] Needs Privacy Updates" label if this pull request changes what data or activity we track or use (p4TIVU-aUh-p2)?

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-121993

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-121993&env=jetpack

Automattic for Agencies live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-121993&env=a8c-for-agencies

[matticbot]

This PR modifies the release build for the following Calypso Apps:

For info about this notification, see here: PCYsg-OT6-p2

• notifications
• wpcom-block-editor

To test WordPress.com changes, run install-plugin.sh $pluginSlug update/a4a/page-view-tracker-to-parse-base-path on your sandbox.

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

Sections (~187 bytes added 📈 [gzipped])

name                                parsed_size           gzip_size
a8c-for-agencies-signup                   +86 B  (+0.1%)      +37 B  (+0.1%)
a8c-for-agencies-team                     +22 B  (+0.0%)      +16 B  (+0.0%)
a8c-for-agencies-sites                    +22 B  (+0.0%)      +20 B  (+0.0%)
a8c-for-agencies-settings                 +22 B  (+0.0%)      +12 B  (+0.0%)
a8c-for-agencies-referrals                +22 B  (+0.0%)      +17 B  (+0.0%)
a8c-for-agencies-purchases                +22 B  (+0.0%)      +23 B  (+0.0%)
a8c-for-agencies-partner-directory        +22 B  (+0.0%)      +19 B  (+0.0%)
a8c-for-agencies-overview                 +22 B  (+0.0%)      +20 B  (+0.0%)
a8c-for-agencies-migrations               +22 B  (+0.0%)      +14 B  (+0.0%)
a8c-for-agencies-marketplace              +22 B  (+0.0%)      +16 B  (+0.0%)
a8c-for-agencies-agency-tier              +22 B  (+0.0%)      +13 B  (+0.0%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[yashwin]

LGTM!

It works as expected!

[travisw]

Thanks for the update, @jkguidaven!

I'm not sure if we need to add the URL parameters as separate event properties. Unless you see a clear need for that.
We'll already have the full URL available in the document location property (_dl in the t.gif request) in case we need access to the parameters.

I don't feel that strongly against having them though, I just wouldn't want to make the events to noisy in the case that many requests using parameters start coming through.

I'm curious if @simonktnga8c and any thoughts on if having those separate event properties would be useful at all at this point.

[simonktnga8c]

I discussed this with @jkguidaven on Slack. My recommendation is to keep setting the "ref" property for the event if there is a URL parameter but not create any other properties from other parameters (this could be a security issue).

[jkguidaven]

@simonktnga8c @travisw Thank you for your feedback. I've implemented changes based on your comments. The PR no longer parses the query parameters and attaches them as properties due to security concerns. Additionally, we explicitly track the ref URL parameter on the Signup page, as discussed with Simon.