change: [M3-8390] - Initialize Pendo on Cloud Manager by mjac0bs · Pull Request #10982 · linode/manager

mjac0bs · 2024-09-20T20:42:24Z

Description 📝

This PR adds Pendo to Cloud Manager by adding the Pendo agent script from the CDN and initializing Pendo with some custom configurations.

Changes 🔄

Installs js-sha256
Creates the usePendo hook
- Incorporates Pendo's install script code
- Loads the Pendo Agent from the CDN with loadScript
- Initializes Pendo with some custom configuration
Invokes the hook in App.tsx with the rest of the GlobalListeners

Target release date 🗓️

10/14/24

How to test 🧪

Prerequisites

(How to setup test environment)

To your .env, add the Pendo API Key. This is not a secret key; it will be visible in the browser dev tools, but we also want to be able to stop Pendo from running using an environment variable, which will live elsewhere with our env var configurations. See the internal repo (PR 167) for that change and the API key.

# Pendo:
REACT_APP_PENDO_API_KEY='KEY-GOES-HERE'

Verification steps

(How to verify changes)

We can validate that Pendo is installed by opening the browser console and typing pendo.validateEnvironment(). This should output some data, including your hashed visitor and account id.
We also want to confirm that no sensitive data is sent to Pendo. To do this, filter by pendo in the Network tab of the browser dev tools.
- Then try navigating around Cloud Manager and confirm the following by looking at the normalizedUrl of the requests:
  - No ids are being sent (e.g. when viewing a linode details page, linodes/123 should be truncated to linodes/)
  - No search queries are being sent
  - No username or other account data is being sent (e.g. when visiting the User Profile and User Permissions pages, the url doesn't include the username)
  - No token data is being sent

Example:

As an Author I have considered 🤔

Check all that apply

mjac0bs · 2024-09-20T20:45:42Z

+    // Adapted Pendo install script for readability:
+
+    // Set up Pendo namespace and queue
+    const pendo = (window['pendo'] = window['pendo'] || {});
+    pendo._q = pendo._q || [];
+
+    // Define the methods Pendo uses in a queue
+    const methodNames = [
+      'initialize',
+      'identify',
+      'updateOptions',
+      'pageLoad',
+      'track',
+    ];
+
+    // Enqueue methods and their arguments on the Pendo object
+    methodNames.forEach((_, index) => {
+      (function (method) {
+        pendo[method] =
+          pendo[method] ||
+          function () {
+            pendo._q[method === methodNames[0] ? 'unshift' : 'push'](
+              // eslint-disable-next-line prefer-rest-params
+              [method].concat([].slice.call(arguments, 0))
+            );
+          };
+      })(methodNames[index]);
+    });


All this stuff is a slightly more readable version of the Pendo install script: https://support.pendo.io/hc/en-us/articles/21362607464987-Components-of-the-install-script.

would we need to cite this in our code?

I don't think we need to as far as Pendo is concerned, but it's good context to have, since we set this up in a way that is consistent with our repo, deconstructing a bit to make use of our loadScript function. I added a link to the Pendo doc in a comment in the code so it's not just ephemerally in this PR - good call out.

mjac0bs · 2024-09-20T20:47:17Z

+    loadScript(PENDO_URL, {
+      location: 'head',
+    }).then(() => {
+      window.pendo.initialize({


I left the commented-out sections for reference.

mjac0bs · 2024-09-20T20:50:23Z

+
+declare global {
+  interface Window {
+    pendo: any;


Unfortunately, Pendo docs recommend typing this as any.

github-actions · 2024-09-20T21:07:15Z

Coverage Report: ❌
Base Coverage: 87.22%
Current Coverage: 86.94%

bnussman-akamai

Script initialization looks good. Didn't 👁️ any issues

coliu-akamai

✅ confirmed pendo.validateEnvironment()
✅ confirmed no sensitive data is sent to Pendo

thanks Mariah! 🎉

mjac0bs · 2024-10-07T19:32:53Z

Going to go ahead and merge this because CI was passing last week and today's updates shouldn't have impacted that; CI is just having known issues today.

cypress · 2024-10-07T20:04:26Z

Cloud Manager E2E Run #6633

Run Properties: Failed #6633 • 79177001f8: change: [M3-8390] - Initialize Pendo on Cloud Manager (#10982)

Project	`Cloud Manager E2E`
Run status	`Failed #6633`
Run duration	`29m 06s`
Commit	`79177001f8: change: [M3-8390] - Initialize Pendo on Cloud Manager (#10982)`
Committer	`Mariah Jacobs`
View all properties for this run ↗︎

Test results
Failures	`2`
Flaky	`3`
Pending	`2`
Skipped	`0`
Passing	`423`

Tests for review

linodes/clone-linode.spec.ts • 1 failed test

View Output Video

Test		Artifacts
clone linode > can clone a Linode from Linode details page		`Screenshots` `Video`

placementGroups/delete-placement-groups.spec.ts • 1 failed test

View Output Video

Test		Artifacts
Placement Group deletion > can delete with Linodes assigned when unexpected error show up and retry		`Screenshots` `Video`

linodes/rebuild-linode.spec.ts • 1 flaky test

View Output Video

Test		Artifacts
rebuild linode > cannot rebuild a provisioning linode		`Screenshots` `Video`

images/machine-image-upload.spec.ts • 1 flaky test

View Output Video

Test		Artifacts
machine image > uploads machine image, mock upload canceled failed event		`Screenshots` `Video`

parentChild/account-switching.spec.ts • 1 flaky test

View Output Video

Test		Artifacts
Parent/Child account switching > From Parent to Child > can switch from Parent account user to Proxy account user from Billing page		`Screenshots` `Video`

mjac0bs added 8 commits September 18, 2024 08:23

Save work

8cd45aa

Adapt install script and get usePendo hook working

8290ed6

Clean up logging

134fce5

Add sha256 hashing for ids

60ad3c6

Clean up for readability

bea08df

Merge branch 'develop' into M3-8390-add-pendo

ac3e0bd

Sanitize the URLs

3e06c59

Merge branch 'develop' into M3-8390-add-pendo

6c59532

mjac0bs added Do Not Merge Analytics Relating to Pendo or Adobe Analytics labels Sep 20, 2024

mjac0bs self-assigned this Sep 20, 2024

mjac0bs requested a review from a team as a code owner September 20, 2024 20:42

mjac0bs requested review from bnussman-akamai and coliu-akamai and removed request for a team September 20, 2024 20:42

Add env var to .env.example

82fbd14

mjac0bs commented Sep 20, 2024

View reviewed changes

Added changeset: Add Pendo to Cloud Manager

edf3731

mjac0bs added the Ready for Review label Sep 20, 2024

mjac0bs added 2 commits October 3, 2024 13:39

Make IDs unique in multiple environments

6199769

Merge branch 'develop' into M3-8390-add-pendo

146bc00

mjac0bs removed the Do Not Merge label Oct 4, 2024

bnussman-akamai approved these changes Oct 7, 2024

View reviewed changes

Comment thread packages/manager/src/hooks/usePendo.ts

mjac0bs added 2 commits October 7, 2024 09:58

Merge branch 'develop' into M3-8390-add-pendo

d449ff5

Address feedback: add auth matching to regex

d861b62

mjac0bs added Add'tl Approval Needed Waiting on another approval! and removed Ready for Review labels Oct 7, 2024

coliu-akamai approved these changes Oct 7, 2024

View reviewed changes

coliu-akamai removed the Add'tl Approval Needed Waiting on another approval! label Oct 7, 2024

coliu-akamai added the Approved Multiple approvals and ready to merge! label Oct 7, 2024

Address feedback: reference link in code comment for context

2c0a329

mjac0bs merged commit 7917700 into linode:develop Oct 7, 2024

This was referenced Oct 9, 2024

fix: Better sanitize Pendo URLs #11079

Merged

Release v1.130.0 - release → staging #11087

Merged

fix: Conditionally check for PENDO_API_KEY before Pendo set up #11089

Merged

Release v1.130.0- staging → master #11095

Merged

mjac0bs mentioned this pull request Dec 3, 2024

change: [M3-8961] - Change Pendo sanitized url path string to match UXR request #11361

Merged

4 of 6 tasks

mjac0bs mentioned this pull request Dec 16, 2024

change: [M3-8742] - Update Pendo URL with CNAME #11427

Merged

4 of 8 tasks

Navigation Menu

Repository navigation

change: [M3-8390] - Initialize Pendo on Cloud Manager - #10982

change: [M3-8390] - Initialize Pendo on Cloud Manager#10982
mjac0bs merged 15 commits into
linode:developfrom
mjac0bs:M3-8390-add-pendo

mjac0bs commented Sep 20, 2024 •

edited

Loading

Uh oh!

mjac0bs Sep 20, 2024

Uh oh!

coliu-akamai Oct 7, 2024 •

edited

Loading

Uh oh!

mjac0bs Oct 7, 2024

Uh oh!

mjac0bs Sep 20, 2024

Uh oh!

Uh oh!

mjac0bs Sep 20, 2024

Uh oh!

github-actions Bot commented Sep 20, 2024 •

edited

Loading

Uh oh!

bnussman-akamai left a comment

Uh oh!

Uh oh!

coliu-akamai left a comment

Uh oh!

mjac0bs commented Oct 7, 2024

Uh oh!

cypress Bot commented Oct 7, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

mjac0bs commented Sep 20, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description 📝

Changes 🔄

Target release date 🗓️

How to test 🧪

Prerequisites

Verification steps

As an Author I have considered 🤔

Uh oh!

mjac0bs Sep 20, 2024

Choose a reason for hiding this comment

Uh oh!

coliu-akamai Oct 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mjac0bs Oct 7, 2024

Choose a reason for hiding this comment

Uh oh!

mjac0bs Sep 20, 2024

Choose a reason for hiding this comment

Uh oh!

Uh oh!

mjac0bs Sep 20, 2024

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Sep 20, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

bnussman-akamai left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

coliu-akamai left a comment

Choose a reason for hiding this comment

Uh oh!

mjac0bs commented Oct 7, 2024

Uh oh!

cypress Bot commented Oct 7, 2024

Cloud Manager E2E Run #6633

Tests for review

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

mjac0bs commented Sep 20, 2024 •

edited

Loading

coliu-akamai Oct 7, 2024 •

edited

Loading

github-actions Bot commented Sep 20, 2024 •

edited

Loading