From b6c29df0a0b731c9379b5e2d020d1e216503cf3f Mon Sep 17 00:00:00 2001
From: Jorg Are <jorg2all@yahoo.com>
Date: Wed, 21 May 2025 13:45:19 +0100
Subject: [PATCH] chore: add identifiers to some upgrade links/buttons (#1686)

---
 src/course-home/outline-tab/widgets/CourseDates.jsx           | 2 +-
 .../progress-tab/grades/course-grade/CourseGradeHeader.jsx    | 4 ++--
 .../suggested-schedule-messaging/UpgradeToCompleteAlert.jsx   | 2 +-
 .../suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx | 2 +-
 src/courseware/course/course-exit/Footnote.jsx                | 2 +-
 src/courseware/course/course-exit/UpgradeFootnote.jsx         | 1 +
 6 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/course-home/outline-tab/widgets/CourseDates.jsx b/src/course-home/outline-tab/widgets/CourseDates.jsx
index 2ae3b459..fa28a643 100644
--- a/src/course-home/outline-tab/widgets/CourseDates.jsx
+++ b/src/course-home/outline-tab/widgets/CourseDates.jsx
@@ -39,7 +39,7 @@ const CourseDates = () => {
             />
           ))}
         </ol>
-        <a className="font-weight-bold ml-4 pl-1 small" href={datesTabLink}>
+        <a id="dates-tab-link" className="font-weight-bold ml-4 pl-1 small" href={datesTabLink}>
           {intl.formatMessage(messages.allDates)}
         </a>
       </div>
diff --git a/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx b/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx
index 87db4e73..f6e036de 100644
--- a/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx
+++ b/src/course-home/progress-tab/grades/course-grade/CourseGradeHeader.jsx
@@ -48,7 +48,7 @@ const CourseGradeHeader = () => {
     previewText = intl.formatMessage(messages.courseGradePreviewUpgradeDeadlinePassedBody);
   }
   return (
-    <div className="row w-100 m-0 p-4 rounded-top bg-primary-500 text-white">
+    <div id="grade-course-header" className="row w-100 m-0 p-4 rounded-top bg-primary-500 text-white">
       <div className={`col-12 ${verifiedMode ? 'col-md-9' : ''} p-0`}>
         <div className="row w-100 m-0 p-0">
           <div className="col-1 p-0">
@@ -71,7 +71,7 @@ const CourseGradeHeader = () => {
       </div>
       {verifiedMode && (
         <div className="col-12 col-md-3 mt-3 mt-md-0 p-0 align-self-center text-right">
-          <Button variant="brand" size="sm" href={verifiedMode.upgradeUrl} onClick={logUpgradeButtonClick}>
+          <Button id="upgrade-button" variant="brand" size="sm" href={verifiedMode.upgradeUrl} onClick={logUpgradeButtonClick}>
             {intl.formatMessage(messages.courseGradePreviewUpgradeButton)}
           </Button>
         </div>
diff --git a/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx b/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx
index 10f5731f..b74099ed 100644
--- a/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx
+++ b/src/course-home/suggested-schedule-messaging/UpgradeToCompleteAlert.jsx
@@ -34,7 +34,7 @@ const UpgradeToCompleteAlert = ({ logUpgradeLinkClick }) => {
   }
 
   return (
-    <Alert className="bg-light-200">
+    <Alert id="upgrade-complete-alert" className="bg-light-200">
       <Row className="w-100 m-0">
         <Col xs={12} md={9} className="small p-0 pr-md-2">
           <Alert.Heading>{intl.formatMessage(messages.upgradeToCompleteHeader)}</Alert.Heading>
diff --git a/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx b/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx
index 25bedd3e..7878e469 100644
--- a/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx
+++ b/src/course-home/suggested-schedule-messaging/UpgradeToShiftDatesAlert.jsx
@@ -36,7 +36,7 @@ const UpgradeToShiftDatesAlert = ({ logUpgradeLinkClick, model }) => {
   }
 
   return (
-    <Alert className="bg-light-200">
+    <Alert id="upgrade-shift-dates-alert" className="bg-light-200">
       <Row className="w-100 m-0">
         <Col xs={12} md={9} className="small p-0 pr-md-2">
           <strong>{intl.formatMessage(messages.missedDeadlines)}</strong>
diff --git a/src/courseware/course/course-exit/Footnote.jsx b/src/courseware/course/course-exit/Footnote.jsx
index 85317548..33a13e32 100644
--- a/src/courseware/course/course-exit/Footnote.jsx
+++ b/src/courseware/course/course-exit/Footnote.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 const Footnote = ({ icon, text }) => (
-  <div className="row w-100 mx-0 my-4 justify-content-center">
+  <div id="celebration-footnote-wrapper" className="row w-100 mx-0 my-4 justify-content-center">
     <p className="text-gray-700">
       <FontAwesomeIcon icon={icon} style={{ width: '20px' }} />&nbsp;
       {text}
diff --git a/src/courseware/course/course-exit/UpgradeFootnote.jsx b/src/courseware/course/course-exit/UpgradeFootnote.jsx
index 552f133f..ca2e8db5 100644
--- a/src/courseware/course/course-exit/UpgradeFootnote.jsx
+++ b/src/courseware/course/course-exit/UpgradeFootnote.jsx
@@ -20,6 +20,7 @@ const UpgradeFootnote = ({ deadline, href }) => {
 
   const upgradeLink = (
     <Hyperlink
+      id="upgrade-link"
       style={{ textDecoration: 'underline' }}
       destination={href}
       className="text-reset"