diff --git a/src/app/components/client/csat_survey/CsatSurveyBanner.tsx b/src/app/components/client/csat_survey/CsatSurveyBanner.tsx
index 91b850737bf..5a6cc7651f5 100644
--- a/src/app/components/client/csat_survey/CsatSurveyBanner.tsx
+++ b/src/app/components/client/csat_survey/CsatSurveyBanner.tsx
@@ -4,7 +4,7 @@
 
 "use client";
 
-import { useState } from "react";
+import { RefObject, useState } from "react";
 import { Button } from "../Button";
 import { CloseBtn, OpenInNew } from "../../server/Icons";
 import { useL10n } from "../../../hooks/l10n";
@@ -14,6 +14,7 @@ import { useTelemetry } from "../../../hooks/useTelemetry";
 import styles from "./CsatSurveyBanner.module.scss";
 import { Survey } from "./surveys/csatSurvey";
 import { GleanMetricMap } from "../../../../telemetry/generated/_map";
+import { useViewTelemetry } from "../../../hooks/useViewTelemetry";
 
 const surveyResponses = [
   "very-dissatisfied",
@@ -44,6 +45,7 @@ export const CsatSurveyBanner = ({
   const recordTelemetry = useTelemetry();
   const hasRenderedClientSide = useHasRenderedClientSide();
   const localDismissal = useLocalDismissal(localDismissalId);
+  const refViewTelemetry = useViewTelemetry("csatSurvey", metricKeys);
 
   if (
     !hasRenderedClientSide ||
@@ -68,7 +70,10 @@ export const CsatSurveyBanner = ({
   };
 
   return (
-    <aside className={styles.wrapper}>
+    <aside
+      ref={refViewTelemetry as RefObject<HTMLElement>}
+      className={styles.wrapper}
+    >
       {typeof answer !== "undefined" && hasFollowUpSurveyOptions ? (
         <div className={styles.prompt}>
           <a
diff --git a/src/app/hooks/useViewTelemetry.ts b/src/app/hooks/useViewTelemetry.ts
index fd3bccdb8d3..72ebbd29a20 100644
--- a/src/app/hooks/useViewTelemetry.ts
+++ b/src/app/hooks/useViewTelemetry.ts
@@ -8,7 +8,10 @@ import { GleanMetricMap } from "../../telemetry/generated/_map";
 import { RefObject } from "react";
 
 export function useViewTelemetry<
-  EventModule extends keyof Pick<GleanMetricMap, "ctaButton" | "banner">,
+  EventModule extends keyof Pick<
+    GleanMetricMap,
+    "ctaButton" | "banner" | "csatSurvey"
+  >,
   EventName extends keyof GleanMetricMap[EventModule],
 >(
   eventModule: EventModule,
diff --git a/src/telemetry/metrics.yaml b/src/telemetry/metrics.yaml
index 9a826c3a8fd..58e1a2cfa87 100644
--- a/src/telemetry/metrics.yaml
+++ b/src/telemetry/metrics.yaml
@@ -495,6 +495,37 @@ cta_button:
         type: string
 
 csat_survey:
+  view:
+    type: event
+    description: |
+      A CSAT survey entered the viewport.
+    bugs:
+      - https://bugzilla.mozilla.org/show_bug.cgi?id=1823766
+    data_reviews:
+      - https://bugzilla.mozilla.org/show_bug.cgi?id=1823766
+    data_sensitivity:
+      - interaction
+    notification_emails:
+      - rhelmer@mozilla.com
+    expires: never
+    extra_keys:
+      path:
+        description: The path of the page.
+        type: string
+      survey_id:
+        description: The ID of the survey, or some way to identify which survey entered the viewport.
+      plan_tier:
+        description: Which tier of plan the user is on [Free, Plus]
+        type: string
+      experiment_branch:
+        description: The experiment branch the user is on. [control, treatment]
+        type: string
+      last_scan_date:
+        description: The date on which the user had their last data broker scan. [YYYYMMDD]
+        type: string
+      automated_removal_period:
+        description: The time period since the first automated removal for the user. [initial, 3-months, 6-months, 12-months]
+        type: string
   click:
     type: event
     description: |