feat(atomic) add happy path test for atomic CRGA component

packages/atomic/src/components/search/atomic-generated-answer/atomic-generated-answer.new.stories.tsx

@@ -90,3 +90,10 @@ export const DisableCitationAnchoring: Story = {
     'disable-citation-anchoring': true,
   },
 };
+
+export const WithoutAnswerConfigurationId: Story = {
+  name: 'Without answer configuration ID',
+  args: {
+    'answer-configuration-id': undefined,
+  },
+};

packages/atomic/src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts

@@ -1,6 +1,86 @@
 import {expect, test} from './fixture';
 
-test.describe('atomic-generated-answer citation', () => {
+const testScenarios = [
+  {
+    name: 'with answer-configuration-id',
+    args: {
+      answerConfigurationId: 'fc581be0-6e61-4039-ab26-a3f2f52f308f',
+    },
+  },
+  {
+    name: 'without answer-configuration-id',
+    args: {
+      answerConfigurationId: undefined,
+    },
+  },
+];
+
+test.describe('atomic-generated-answer - Happy Path', () => {
+  testScenarios.forEach(({name, args}) => {
+    test.describe(name, () => {
+      test.beforeEach(async ({generatedAnswer}) => {
+        await generatedAnswer.load({story: 'default', args});
+        await generatedAnswer.hydrated.first().waitFor({state: 'visible'});
+      });
+
+      test('should complete full user journey: view answer → like → feedback → citations → navigation', async ({
+        generatedAnswer,
+        page,
+      }) => {
+        await test.step('Wait for and verify generated answer text is displayed', async () => {
+          await generatedAnswer.waitForGeneratedText();
+          await expect(generatedAnswer.generatedText).toBeVisible();
+          const textContent = await generatedAnswer.generatedText.textContent();
+          expect(textContent).toBeTruthy();
+          expect(textContent!.length).toBeGreaterThan(0);
+        });
+
+        await test.step('Like the answer', async () => {
+          expect(await generatedAnswer.isLikeButtonActive()).toBe(false);
+          await generatedAnswer.clickLikeButton();
+          expect(await generatedAnswer.isLikeButtonActive()).toBe(true);
+        });
+
+        await test.step('Open and fill feedback modal', async () => {
+          await generatedAnswer.waitForFeedbackModal();
+          expect(await generatedAnswer.isFeedbackModalOpen()).toBe(true);
+
+          await generatedAnswer.fillFeedbackForm({
+            correctTopic: 'yes',
+            hallucinationFree: 'yes',
+            documented: 'yes',
+            readable: 'yes',
+            details: 'This is a great answer!',
+          });
+        });
+
+        await test.step('Submit feedback', async () => {
+          await generatedAnswer.submitFeedback();
+          await generatedAnswer.page.waitForTimeout(500);
+          expect(await generatedAnswer.isFeedbackModalOpen()).toBe(false);
+        });
+
+        await test.step('Verify citations are displayed', async () => {
+          await generatedAnswer.waitForCitations();
+          const citationCount = await generatedAnswer.getCitationCount();
+          expect(citationCount).toBeGreaterThan(0);
+        });
+
+        await test.step('Click on citation and verify navigation', async () => {
+          const firstCitationHref = await generatedAnswer.getCitationHref(0);
+          expect(firstCitationHref).toBeTruthy();
+
+          const navigationPromise = page.waitForURL(/.*/, {timeout: 5000});
+          await generatedAnswer.citation.first().click();
+
+          await expect(navigationPromise).resolves.not.toThrow();
+        });
+      });
+    });
+  });
+});
+
+test.describe('atomic-generated-answer - Citations', () => {
   test.describe('with citation anchoring enabled', () => {
     test.beforeEach(async ({generatedAnswer}) => {
       await generatedAnswer.load({story: 'default'});

packages/atomic/src/components/search/atomic-generated-answer/e2e/page-object.ts

@@ -19,6 +19,34 @@
     return this.page.locator('atomic-citation [part="citation"]');
   }
 
+  get generatedText() {
+    return this.page.locator('atomic-generated-answer [part="generated-text"]');
+  }
+
+  get likeButton() {
+    return this.page
+      .locator('atomic-generated-answer [part="feedback-button"].like')
+      .first();
+  }
+
+  get dislikeButton() {
+    return this.page
+      .locator('atomic-generated-answer [part="feedback-button"].dislike')
+      .first();
+  }
+
+  get feedbackModal() {
+    return this.page.locator('atomic-generated-answer-feedback-modal');
+  }
+
+  get feedbackSubmitButton() {
+    return this.feedbackModal.getByRole('button', {name: /submit/i});
+  }
+
+  get feedbackCancelButton() {
+    return this.feedbackModal.getByRole('button', {name: /cancel/i});
+  }
+
   async waitForCitations() {
     await this.citation.first().waitFor();
   }
@@ -41,4 +69,92 @@
       );
     });
   }
+
+  async waitForGeneratedText() {
+    await this.generatedText.first().waitFor({state: 'visible'});
+  }
+
+  async clickLikeButton() {
+    await this.likeButton.click();
+  }
+
+  async clickDislikeButton() {
+    await this.dislikeButton.click();
+  }
+
+  async isLikeButtonActive(): Promise<boolean> {
+    const ariaPressed = await this.likeButton.getAttribute('aria-pressed');
+    return ariaPressed === 'true';
+  }
+
+  async isDislikeButtonActive(): Promise<boolean> {
+    const ariaPressed = await this.dislikeButton.getAttribute('aria-pressed');
+    return ariaPressed === 'true';
+  }
+
+  async waitForFeedbackModal() {
+    await this.feedbackModal.waitFor({state: 'visible'});
+  }
+
+  async isFeedbackModalOpen(): Promise<boolean> {
+    return await this.feedbackModal.isVisible();
+  }
+
+  async submitFeedback() {
+    await this.feedbackSubmitButton.click();
+  }
+
+  async cancelFeedback() {
+    await this.feedbackCancelButton.click();
+  }
+
+  async fillFeedbackForm(options?: {
+    correctTopic?: 'yes' | 'unknown' | 'no';
+    hallucinationFree?: 'yes' | 'unknown' | 'no';
+    documented?: 'yes' | 'unknown' | 'no';
+    readable?: 'yes' | 'unknown' | 'no';
+    documentUrl?: string;
+    details?: string;
+  }) {
+    const {
+      correctTopic = 'yes',
+      hallucinationFree = 'yes',
+      documented = 'yes',
+      readable = 'yes',
+      documentUrl,
+      details,
+    } = options || {};
+
+    // Click radio buttons for each evaluation question
+    await this.feedbackModal
+      .locator(`.answer-evaluation.correctTopic`)
+      .getByRole('radio', {name: correctTopic})
+      .click();
+
+    await this.feedbackModal
+      .locator(`.answer-evaluation.hallucinationFree`)
+      .getByRole('radio', {name: hallucinationFree})
+      .click();
+
+    await this.feedbackModal
+      .locator(`.answer-evaluation.documented`)
+      .getByRole('radio', {name: documented})
+      .click();
+
+    await this.feedbackModal
+      .locator(`.answer-evaluation.readable`)
+      .getByRole('radio', {name: readable})
+      .click();
+
+    // Fill optional fields if provided
+    if (documentUrl) {
+      await this.feedbackModal
+        .locator('input[placeholder="https://URL"]')
+        .fill(documentUrl);
+    }
+
+    if (details) {
+      await this.feedbackModal.locator('textarea').fill(details);
+    }
+  }
 }