Skip to content

test(atomicGeneratedAnswer): citations with mocks [SFINT-6430] #6563

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 1 commit into
base: test-SFINT-6429-generated-answer-rendering-e2e-tests-with-mocks
Choose a base branch
from
+113 −35
Draft

test(atomicGeneratedAnswer): citations with mocks [SFINT-6430] #6563

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
130 changes: 95 additions & 35 deletions ...s/atomic/src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,53 +2,113 @@

test.describe('atomic-generated-answer', () => {
test.describe('citations', () => {
test.describe('with citation anchoring enabled', () => {
test.beforeEach(async ({generatedAnswer}) => {
await generatedAnswer.load({story: 'default'});
await generatedAnswer.waitForCitations();
test.beforeEach(async ({generatedAnswer}) => {
await generatedAnswer.load({story: 'default'});
await generatedAnswer.waitForCitations();
});

test('should show popover when hovering over citation', async ({
generatedAnswer,
}) => {
await test.step('Verify first citation popover', async () => {
await generatedAnswer.citation.first().hover();

const popover = await generatedAnswer.getCitationPopover(0);
await popover.waitFor({state: 'visible', timeout: 1000});

const text = await popover.textContent();
expect(text).toContain(
'https://coveodemo.atlassian.net/wiki/TV/How To Resolve Netflix Connection With Tivo on XB Family Smart TVs'
);
expect(text).toContain(
'How To Resolve Netflix Connection With Tivo on XB Family Smart TVs'
);
expect(text).toContain(
'Tivo can cause some problems with the Netflix App on your XBR6 Smart TV'
);
});

test('should render citation when available', async ({
generatedAnswer,
}) => {
const citationCount = await generatedAnswer.getCitationCount();
expect(citationCount).toBeGreaterThan(0);
await generatedAnswer.citation.first().screenshot();
await test.step('Verify second citation popover', async () => {
await generatedAnswer.citation.nth(1).hover();

const popover = await generatedAnswer.getCitationPopover(1);
await popover.waitFor({state: 'visible', timeout: 1000});

const text = await popover.textContent();
expect(text).toContain(
'https://coveodemo.atlassian.net/wiki/TV/How To Resolve Netflix Playback Errors on Besttech XB Smart TVs'
);
expect(text).toContain(
'How To Resolve Netflix Playback Errors on Besttech XB Smart TVs'
);
expect(text).toContain(
'the problem by eliminating the router or wireless connectivity problems as a possible cause'
);
});
});

test.describe('citation anchoring', () => {
test.describe('with citation anchoring enabled', () => {
test('should render citation when available', async ({
generatedAnswer,
}) => {
const citationCount = await generatedAnswer.getCitationCount();
expect(citationCount).toBeGreaterThan(0);
await generatedAnswer.citation.first().screenshot();

Check failure on line 57 in packages/atomic/src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts

View workflow job for this annotation

GitHub Actions / Run Playwright tests for Atomic (1, 1)

[chromium] › src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts:52:9 › atomic-generated-answer › citations › citation anchoring › with citation anchoring enabled › should render citation when available 

  1) [chromium] › src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts:52:9 › atomic-generated-answer › citations › citation anchoring › with citation anchoring enabled › should render citation when available 
    Error: locator.screenshot: Element is not attached to the DOM
    Call log:
      - taking element screenshot
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
        - waiting for element to be stable
        - element is not stable
      - retrying scroll into view action
        - waiting for element to be stable


      55 |           const citationCount = await generatedAnswer.getCitationCount();
      56 |           expect(citationCount).toBeGreaterThan(0);
    > 57 |           await generatedAnswer.citation.first().screenshot();
         |                                                  ^
      58 |         });
      59 |
      60 |         test('should navigate to citation URL with text fragment on click', async ({
        at /__w/ui-kit/ui-kit/packages/atomic/src/components/search/atomic-generated-answer/e2e/atomic-generated-answer.e2e.ts:57:50
});

test('should navigate to citation URL with text fragment on click', async ({
generatedAnswer,
}) => {
const citationCount = await generatedAnswer.getCitationCount();

for (let i = 0; i < citationCount; i++) {
const filetype = await generatedAnswer.getCitationFiletype(i);

test('should only append text fragment to HTML citations', async ({
generatedAnswer,
}) => {
const citationCount = await generatedAnswer.getCitationCount();
// Listen for popup event (citations open in new tab with target="_blank")
const popupPromise = generatedAnswer.page.waitForEvent('popup');

for (let i = 0; i < citationCount; i++) {
const filetype = await generatedAnswer.getCitationFiletype(i);
const href = await generatedAnswer.getCitationHref(i);
await generatedAnswer.citation.nth(i).click();

expect(href).toBeTruthy();
const popup = await popupPromise;
const popupUrl = popup.url();

if (filetype === 'html') {
expect(href).toMatch(/#:~:text=/);
} else {
expect(href).not.toMatch(/#:~:text=/);
expect(popupUrl).toBeTruthy();

if (filetype === 'html') {
expect(popupUrl).toMatch(/#:~:text=/);
} else {
expect(popupUrl).not.toMatch(/#:~:text=/);
}

await popup.close();
}
}
});
});
});

test.describe('with citation anchoring disabled', () => {
test.beforeEach(async ({generatedAnswer}) => {
await generatedAnswer.load({story: 'disable-citation-anchoring'});
});
test.describe('with citation anchoring disabled', () => {
test.beforeEach(async ({generatedAnswer}) => {
await generatedAnswer.load({story: 'disable-citation-anchoring'});
});

test('should not have text fragment when citation anchoring is disabled', async ({
generatedAnswer,
}) => {
await generatedAnswer.waitForCitations();

// Listen for popup event (citations open in new tab with target="_blank")
const popupPromise = generatedAnswer.page.waitForEvent('popup');

await generatedAnswer.citation.first().click();

const popup = await popupPromise;
const popupUrl = popup.url();

test('should not have text fragment when citation anchoring is disabled', async ({
generatedAnswer,
}) => {
await generatedAnswer.waitForCitations();
const href = await generatedAnswer.getCitationHref(0);
expect(popupUrl).toBeTruthy();
expect(popupUrl).not.toContain('#:~:text=');

expect(href).toBeTruthy();
expect(href).not.toContain('#:~:text=');
await popup.close();
});
});
});
});
Expand Down
18 changes: 18 additions & 0 deletions packages/atomic/src/components/search/atomic-generated-answer/e2e/page-object.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@ export class GeneratedAnswerPageObject extends BasePageObject<'atomic-generated-
return this.page.locator('atomic-citation [part="citation"]');
}

get citationPopovers() {
return this.page.locator('atomic-citation [part="citation-popover"]');
}

get answerContent() {
return this.page.locator('atomic-generated-answer [part="answer-content"]');
}
Expand Down Expand Up @@ -99,4 +103,18 @@ export class GeneratedAnswerPageObject extends BasePageObject<'atomic-generated-
async getTableTexts(): Promise<string[]> {
return await this.tables.allTextContents();
}

async getCitationPopover(index: number = 0) {
return this.citationPopovers.nth(index);
}

async isCitationPopoverVisible(index: number = 0): Promise<boolean> {
const popover = await this.getCitationPopover(index);
return await popover.isVisible();
}

async getCitationPopoverText(index: number = 0): Promise<string> {
const popover = await this.getCitationPopover(index);
return (await popover.textContent()) || '';
}
}
Loading