Skip to content
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

Jump to bottom

[Backport 2.13] add functional test for sidecar #1163

Merged
merged 1 commit into from
Mar 20, 2024
Merged

[Backport 2.13] add functional test for sidecar #1163

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
8 changes: 5 additions & 3 deletions cypress/integration/plugins/dashboards-assistant/chatbot_interaction_trace_spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,9 +82,11 @@ if (Cypress.env('DASHBOARDS_ASSISTANT_ENABLED')) {
});

it('trace page display correctly in fullscreen mode', () => {
cy.get(`.llm-chat-flyout-header`)
.find(`button[aria-label="fullScreen"]`)
.click({ force: true });
// switch to takeover mode for fullscreen
cy.get('[id="sidecarModeIcon"]').click();
cy.get(
'[data-test-subj="sidecar-mode-icon-menu-item-takeover"]'
).click();

// show close button
cy.get(`.llm-chat-flyout .llm-chat-flyout-body`).as('tracePage');
Expand Down
165 changes: 165 additions & 0 deletions cypress/integration/plugins/dashboards-assistant/chatbot_sidecar_spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,165 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/
import { BASE_PATH } from '../../../utils/constants';

if (Cypress.env('DASHBOARDS_ASSISTANT_ENABLED')) {
describe('Assistant sidecar spec', () => {
beforeEach(() => {
// Set welcome screen tracking to false
localStorage.setItem('home:welcome:show', 'false');
// Set new theme modal to false
localStorage.setItem('home:newThemeModal:show', 'false');
});

beforeEach(() => {
// Visit OSD
cy.visit(`${BASE_PATH}/app/home`);

// Common text to wait for to confirm page loaded, give up to 60 seconds for initial load
cy.get(`input[placeholder="Ask question"]`, { timeout: 120000 }).should(
'be.length',
1
);
});

describe('sidecar spec', () => {
it('open sidecar and render normally, support show and hide', () => {
// The header may render multiple times, wait for UI to be stable
cy.wait(5000);

// enable to toggle and open sidecar, OSD will be pushed accordingly.
cy.get(`img[aria-label="toggle chat flyout icon"]`).click();
cy.get('[class~="chatbot-sidecar"]').should('be.visible');
cy.get('[class~="chatbot-sidecar"]').should(
'have.css',
'width',
'460px'
);
//Wrapper and header have related padding style.
cy.get('[class~="app-wrapper"]').should(
'have.css',
'padding-right',
'460px'
);
cy.get('[id="globalHeaderBars"]')
.children()
.should('have.css', 'padding-right', '460px');

// click toggle to call sidecar hide, sidecar will be hidden and paddingSize on header and wrapper will be zero.
cy.get(`img[aria-label="toggle chat flyout icon"]`).click();
cy.get('[class~="chatbot-sidecar"]').should(
'have.css',
'display',
'none'
);
cy.get('[class~="app-wrapper"]').should(
'not.have.attr',
'padding-right'
);
cy.get('[id="globalHeaderBars"]')
.children()
.should('not.have.attr', 'padding-right');

// click toggle to call sidecar show
cy.get(`img[aria-label="toggle chat flyout icon"]`).click();
cy.get('[class~="chatbot-sidecar"]').should('be.visible');
cy.get('[class~="app-wrapper"]').should(
'have.css',
'padding-right',
'460px'
);
cy.get('[id="globalHeaderBars"]')
.children()
.should('have.css', 'padding-right', '460px');
});

it('open sidecar and support to switch docked mode', () => {
// The header may render multiple times, wait for UI to be stable
cy.wait(5000);

// enable to toggle and open sidecar, OSD will be pushed accordingly.
cy.get(`img[aria-label="toggle chat flyout icon"]`).click();
cy.get('[class~="chatbot-sidecar"]').should('be.visible');
cy.get('[class~="app-wrapper"]').should(
'have.css',
'padding-right',
'460px'
);

// switch to docked left
cy.get('[id="sidecarModeIcon"]').click();
cy.get('[data-test-subj="sidecar-mode-icon-menu-item-left"]').click();
cy.get('[class~="app-wrapper"]').should(
'have.css',
'padding-left',
'460px'
);

// switch to docked take over
cy.get('[id="sidecarModeIcon"]').click();
cy.get(
'[data-test-subj="sidecar-mode-icon-menu-item-takeover"]'
).click();
cy.get('[class~="app-wrapper"]').should(
'not.have.attr',
'padding-left'
);
cy.get('[class~="app-wrapper"]').should(
'not.have.attr',
'padding-right'
);
});

it('open sidecar and support resizable', () => {
// The header may render multiple times, wait for UI to be stable
cy.wait(5000);

// enable to toggle and open sidecar, OSD will be pushed accordingly.
cy.get(`img[aria-label="toggle chat flyout icon"]`).click();
// switch to docked left
cy.get('[id="sidecarModeIcon"]').click();
cy.get('[data-test-subj="sidecar-mode-icon-menu-item-left"]').click();
cy.get('[class~="chatbot-sidecar"]').should('be.visible');
cy.get('[class~="chatbot-sidecar"]').should(
'have.css',
'width',
'460px'
);

//drag from left to right
cy.get('[data-test-subj="resizableButton"]').trigger('mousedown', {
clientX: 0,
pageX: 0,
pageY: 0,
});
cy.window().trigger('mousemove', { clientX: 1000, pageX: 0, pageY: 0 });
cy.window().trigger('mouseup', { force: true });
cy.get('[class~="chatbot-sidecar"]').should(
'have.css',
'width',
`${1000 + 460}px`
);

//drag from right to left
cy.get('[data-test-subj="resizableButton"]').trigger('mousedown', {
clientX: 0,
pageX: 0,
pageY: 0,
});
cy.window().trigger('mousemove', {
clientX: -1000,
pageX: 0,
pageY: 0,
});
cy.window().trigger('mouseup', { force: true });
cy.get('[class~="chatbot-sidecar"]').should(
'have.css',
'width',
`${1460 - 1000}px`
);
});
});
});
}
13 changes: 9 additions & 4 deletions cypress/integration/plugins/dashboards-assistant/conversation_history_spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,8 +79,12 @@ if (Cypress.env('DASHBOARDS_ASSISTANT_ENABLED')) {
cy.get('textarea[placeholder="Ask me anything..."]').should('exist');
});

it('should hide back button in fullscreen mode', () => {
cy.get('.llm-chat-flyout button[aria-label="fullScreen"]').click();
it('should hide back button in takeover fullscreen mode', () => {
//switch to takeover mode for fullscreen
cy.get('[id="sidecarModeIcon"]').click();
cy.get(
'[data-test-subj="sidecar-mode-icon-menu-item-takeover"]'
).click();
cy.get('.llm-chat-flyout button[aria-label="history"]').click();

cy.get('.llm-chat-flyout')
Expand All @@ -91,8 +95,9 @@ if (Cypress.env('DASHBOARDS_ASSISTANT_ENABLED')) {
.contains('Back', { timeout: 3000 })
.should('not.exist');

// Back to default mode
cy.get('.llm-chat-flyout button[aria-label="fullScreen"]').click();
// Switch to default docked right mode
cy.get('[id="sidecarModeIcon"]').click();
cy.get('[data-test-subj="sidecar-mode-icon-menu-item-right"]').click();
cy.get('.llm-chat-flyout button[aria-label="history"]').click();
});
});
Expand Down
Loading