diff --git a/tests/e2e/web/utils/accountInformation.ts b/tests/e2e/web/utils/accountInformation.ts
index 2d2c4134..97281ab9 100644
--- a/tests/e2e/web/utils/accountInformation.ts
+++ b/tests/e2e/web/utils/accountInformation.ts
@@ -252,4 +252,4 @@ export const testAccounts: AccountConfig = {
       },
     }
   },
-}
+}
\ No newline at end of file
diff --git a/web/components/answers/answer-compatibility-question-content.tsx b/web/components/answers/answer-compatibility-question-content.tsx
index 24e65326..e1c43f9d 100644
--- a/web/components/answers/answer-compatibility-question-content.tsx
+++ b/web/components/answers/answer-compatibility-question-content.tsx
@@ -34,6 +34,7 @@ export const IMPORTANCE_CHOICES = {
   Important: 2,
   'Very Important': 3,
 } as const
+} as const
 
 type ImportanceColorsType = {
   [key: number]: string
@@ -165,6 +166,9 @@ export function AnswerCompatibilityQuestionContent(props: {
         <Row className={'gap-2'}>
           <PinQuestionButton questionId={question.id} />
           {shortenedPopularity && (
+        <div data-testid="compatibility-question">{compatibilityQuestion.question}</div>
+        {shortenedPopularity && (
+          <Row className="text-ink-500 select-none items-center text-sm">
             <Tooltip
               text={t(
                 'answers.content.people_answered',
@@ -231,6 +235,7 @@ export function AnswerCompatibilityQuestionContent(props: {
           <ExpandingInput
             className={'w-full'}
             data-testid="compatibility-question-thoughts"
+            data-testid="compatibility-question-thoughts"
             rows={3}
             value={answer.explanation ?? ''}
             onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
@@ -298,6 +303,7 @@ export const SelectAnswer = (props: {
   const {value, setValue, options} = props
   return (
     <RadioGroup
+      data-testid="compatibility-question-your-answer"
       data-testid="compatibility-question-your-answer"
       className={
         'border-ink-300 text-ink-400 bg-canvas-50 inline-flex flex-col gap-2 rounded-md border p-1 text-sm shadow-sm'
@@ -310,6 +316,7 @@ export const SelectAnswer = (props: {
           key={i}
           value={i}
           data-testid={`compatibility-your-answer-${i}`}
+          data-testid={`compatibility-your-answer-${i}`}
           className={({disabled}) =>
             clsx(
               disabled
@@ -336,6 +343,7 @@ export const MultiSelectAnswers = (props: {
 
   return (
     <Col
+      data-testid="compatibility-answers-you-accept"
       data-testid="compatibility-answers-you-accept"
       className={
         'border-ink-300 text-ink-400 bg-canvas-50 inline-flex flex-col gap-2 rounded-md border p-1 text-sm shadow-sm main-font'
@@ -345,6 +353,7 @@ export const MultiSelectAnswers = (props: {
         <button
           key={i}
           data-testid={`compatibility-answers-you-accept-${i}`}
+          data-testid={`compatibility-answers-you-accept-${i}`}
           className={clsx(
             values.includes(i)
               ? 'text-primary-700 bg-primary-100 hover:bg-primary-50'
@@ -366,3 +375,8 @@ export const MultiSelectAnswers = (props: {
 export type ImportanceTuple = {
   [K in keyof typeof IMPORTANCE_CHOICES]: [K, (typeof IMPORTANCE_CHOICES)[K]]
 }[keyof typeof IMPORTANCE_CHOICES]
+
+//Exported types for test files to use when referencing the keys of the choices objects
+export type ImportanceTuple = {
+  [K in keyof typeof IMPORTANCE_CHOICES]: [K, (typeof IMPORTANCE_CHOICES)[K]]
+}[keyof typeof IMPORTANCE_CHOICES]