Repository navigation
Label docs conversion links for Fullstory - #7067
Merged
Merged
Conversation
Fullstory showed clicks from the docs only as generated CSS-selector paths, so there was no way to see how many readers leave the docs for pricing, a trial, sales, a product page, or their Cypress Cloud account, or which spot on the page sent them. Each such link now carries a data-fs-element label, "<Surface> - <Action>" (for example "Docs Content - Pricing" or "Docs Footer - Product - Cloud"), plus its utm_medium as a typed data-link-placement property. This follows www.cypress.io's tracking-attribute convention, since both sites and Cloud record into one Fullstory org. The "Docs" surface prefix keeps these labels apart from www.cypress.io's own. - plugins/fullstory-conversion-links.js classifies a link by destination and builds the attributes. docusaurus.config.js uses it for the footer and navbar, and What's New, Btn, and ProductHeading use it in source. - A new client module labels Markdown links where they render, on load and after each route change. It never overwrites an existing label. - Every descendant of a labeled link gets the same attributes, because Fullstory reports a click on nested inline code or an icon under that element rather than the link. - The Osano banner labels now match www.cypress.io's ("Accept All", "Deny All"), so one funnel covers the consent banner on both sites. No trackEvent calls are added, and the docs still never identify visitors. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WUv8r1dRvperh82bP9Tx1B
The client module labeled links two frames after each route change, so a link rendered later went unlabeled. The mobile sidebar drawer, for one, mounts only when opened, so its Free Trial Guide link was never labeled on phones. Labels now come with the markup itself: - A rehype plugin labels Markdown links when the docs are built, so they are in the server-rendered HTML and every client render. - SidebarLink, Icon, and Badge label their own links, alongside Btn, ProductHeading, What's New, and the footer and navbar config. - A pointer-events rule in custom.scss sends clicks on a link's nested elements (inline code, an icon) to the labeled link, so nothing has to copy the label onto them. This is www.cypress.io's other documented fix for the same Fullstory behavior. The client module and the descendant-labeling helper are removed. The e2e spec now checks server-rendered HTML for most links. In the browser it covers the mobile drawer, client-side navigation, and a click on a button's icon, which fails if the pointer-events rule is removed. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WUv8r1dRvperh82bP9Tx1B
cypress-documentation
|
||||||||||||||||||||||||||||||||||||||||
| Project |
cypress-documentation
|
| Branch Review |
fullstory/conversion-links
|
| Run status |
|
| Run duration | 02m 19s |
| Commit |
|
| Committer | Jennifer Shehane |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
|
|
0
|
|
|
0
|
|
|
0
|
|
|
0
|
|
|
443
|
| View all changes introduced in this branch ↗︎ | |
UI Coverage
32.91%
|
|
|---|---|
|
|
738
|
|
|
26
|
Accessibility
98.93%
|
|
|---|---|
|
|
2 critical
5 serious
4 moderate
1 minor
|
|
|
73
|
cypress-documentation
|
||||||||||||||||||||||||||||||||||||||||
| Project |
cypress-documentation
|
| Branch Review |
main
|
| Run status |
|
| Run duration | 02m 06s |
| Commit |
|
| Committer | Jennifer Shehane |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
|
|
0
|
|
|
1
|
|
|
0
|
|
|
0
|
|
|
443
|
| View all changes introduced in this branch ↗︎ | |
UI Coverage
32.82%
|
|
|---|---|
|
|
738
|
|
|
25
|
Accessibility
98.91%
|
|
|---|---|
|
|
2 critical
6 serious
4 moderate
1 minor
|
|
|
152
|
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
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.
Summary
Links in the docs that lead toward a possible sale or an existing Cypress Cloud account now carry a readable Fullstory label naming where on the page the link sits and where it goes. Examples:
Docs Content - Pricing,Docs Footer - Product - Cloud,Docs Sidebar - Free Trial Guide. Each labeled link also records itsutm_medium(its spot on the page) as a typeddata-link-placementproperty. The Osano cookie banner labels now match www.cypress.io's.Why
Fullstory recorded clicks from the docs as generated CSS-selector paths, so there was no way to see how many readers head from the docs to pricing, a trial, sales, a product page, or their Cloud account, or which spot on the page sent them.
docs.cypress.io, www.cypress.io, and Cypress Cloud all record into one Fullstory org, so this follows www.cypress.io's tracking-attribute rules (
.agents/policies/tracking-attributes.mdand the Gotcha section of.agents/architecture/fullstory.mdincypress-io/cypress.io):data-fs-elementlabels. This PR adds notrackEventcalls.Surface - Actionprose. The docs prefix every surface withDocsso their labels stay apart from www.cypress.io's own (Header - Sign Up).data-fs-properties-schemamapsdata-link-placementto a typed string property.The docs still never identify anyone; Cloud alone identifies signed-in users in this org.
What's labeled
plugins/fullstory-conversion-links.jsclassifies a link by destination, ignoring the query string and hash:cloud.cypress.io/logincloud.cypress.io/signupwww.cypress.io/contact/cloud/get-started/free-trial(this site)cloud.cypress.iopath,on.cypress.io/cloud,on.cypress.io/dashboardwww.cypress.io/pricingwww.cypress.io/accessibility,/app,/cloud,/features,/ui-coveragewww.cypress.iolinks withutm_content=Request trialwww.cypress.io/savings-calculatorcypress.ioandwww.cypress.ioare treated the same, since 18 pricing links use the apex domain and it redirects to www.The surface comes from where the link renders:
Docs Content,Docs Navbar,Docs Sidebar(What's New included),Docs Footer, orDocs Announcement.How the labels get there
All labels are in the built HTML, so nothing depends on when a part of the page mounts:
plugins/fullstory-conversion-links-rehype.js, labels them at build time. It never overwrites an existingdata-fs-element.docusaurus.config.js, plusSidebarLink, What's New,Btn,ProductHeading,Icon, andBadge, add the attributes in source.src/css/custom.scss,a[data-link-placement] * { pointer-events: none; }, sends those clicks to the labeled link. That's www.cypress.io's other documented fix for the same behavior.Across the built site, 1,926 links get a label:
No navbar, announcement, or What's New link leads to one of these destinations today, so those surfaces have no labeled links yet.
Osano label changes
These match www.cypress.io's, so one funnel covers the consent banner on both sites. Fullstory funnels built on the old names need repointing.
Cookie Consent - AcceptCookie Consent - Accept AllCookie Consent - RejectCookie Consent - Deny AllCookie Consent - Manage PreferencesCookie Consent - DismissThe footer's
Cookie Consent - Open Preferencesis unchanged.Notes for reviewers
Docs Content - Product - App: on App pages,ProductHeadingrenders an empty link with no badge, so those 221 labeled links have nothing a reader can click. Dropping that link in the component may be worth a follow-up.docusaurus.config.jssays what a future conversion link there needs.on.cypress.io/accessibility-trial,on.cypress.io/ui-coverage-trial(one each)on.cypress.io/accessibility-demo-video(1),on.cypress.io/ui-coverage-demo-video(2)on.cypress.io/dashboard/organizations(1)www.cypress.io/support(338, footer)www.cypress.io/releases/cloud,www.cypress.io/roadmap/cloud, and the barewww.cypress.io(one each)FULLSTORY_ORG_IDand Analytics consent, so a look at a deploy preview would confirm it.Checks run
npm run typecheck: passed.npm run test:plugins: passed, including 51 tests for the classifier and rehype plugin (npm run test:fullstory-conversion-links).npm run buildwithFULLSTORY_ORG_IDunset: passed.cypress/e2e/fullstory_conversion_links.cy.ts6/6 andcypress/e2e/osano.cy.ts4/4, againstnpm run servein Chrome for Testing.pathinstead of the link, so the test catches a regression.a[href]indist/: every one of the 1,926 conversion links carries the expected label in the built HTML..mdxfiles changed, so there were no code examples to run.Generated by Claude Code
Note
Medium Risk
Touches site-wide link rendering and analytics attribution across ~1,900 links; Osano label renames can break existing Fullstory funnels until repointed.
Overview
Adds Fullstory
data-fs-elementlabeling for docs links that point at pricing, trials, Cloud sign-in/up, product pages, and similar conversion destinations, using the sharedDocs <Surface> - <Action>naming convention and a typeddata-link-placementproperty from each link’sutm_medium.Implementation: New
plugins/fullstory-conversion-links.jsclassifies hrefs and emits attributes; a rehype plugin labels Markdown/MDX links at build time;withConversionLabelswraps navbar/footer config; React link surfaces (Badge,Btn,ProductHeading, sidebar, What’s New, etc.) spread the same helper.a[data-link-placement] * { pointer-events: none; }keeps clicks on nested icons/code attributed to the parent link.Osano consent button labels are renamed to match www.cypress.io (
Accept All,Deny All), with Cypress specs asserting exact label strings.Tests: Vitest for the classifier and rehype plugin; new
fullstory_conversion_links.cy.tsfor SSR HTML, client nav, mobile drawer, and click targeting.Reviewed by Cursor Bugbot for commit be68ea5. Bugbot is set up for automated code reviews on this repo. Configure here.