-
Notifications
You must be signed in to change notification settings - Fork 23
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add unit tests for CoreVisualization and ChatFlyout
Signed-off-by: Yulong Ruan <[email protected]>
- Loading branch information
Showing
3 changed files
with
196 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,149 @@ | ||
| /* | ||
| * Copyright OpenSearch Contributors | ||
| * SPDX-License-Identifier: Apache-2.0 | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import { render, screen, fireEvent } from '@testing-library/react'; | ||
|
|
||
| import { ChatFlyout } from './chat_flyout'; | ||
| import * as chatContextExports from './contexts/chat_context'; | ||
| import { TAB_ID } from './utils/constants'; | ||
|
|
||
| jest.mock('./tabs/chat/chat_page', () => ({ | ||
| ChatPage: () => <div aria-label="mock chat page" />, | ||
| })); | ||
|
|
||
| jest.mock('./tabs/chat_window_header', () => ({ | ||
| ChatWindowHeader: () => <div aria-label="mock chat window header" />, | ||
| })); | ||
|
|
||
| jest.mock('./tabs/history/chat_history_page', () => ({ | ||
| ChatHistoryPage: () => <div aria-label="mock chat history page" />, | ||
| })); | ||
|
|
||
| jest.mock('./components/agent_framework_traces_flyout_body', () => ({ | ||
| AgentFrameworkTracesFlyoutBody: () => ( | ||
| <div aria-label="mock agent framework traces flyout body" /> | ||
| ), | ||
| })); | ||
|
|
||
| describe('<ChatFlyout />', () => { | ||
| beforeEach(() => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| selectedTabId: TAB_ID.CHAT, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| jest.resetAllMocks(); | ||
| }); | ||
|
|
||
| it('should only display chat panel when current tab is TAB_ID.CHAT under non-fullscreen mode', () => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| selectedTabId: TAB_ID.CHAT, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
|
|
||
| render( | ||
| <ChatFlyout | ||
| flyoutVisible={true} | ||
| overrideComponent={null} | ||
| flyoutProps={{}} | ||
| flyoutFullScreen={false} | ||
| toggleFlyoutFullScreen={jest.fn()} | ||
| /> | ||
| ); | ||
| expect(screen.getByLabelText('chat panel').classList).not.toContain('llm-chat-hidden'); | ||
| expect(screen.getByLabelText('history panel').classList).toContain('llm-chat-hidden'); | ||
| }); | ||
|
|
||
| it('should only display history panel when current tab is TAB_ID.HISTORY under non-fullscreen mode', () => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| selectedTabId: TAB_ID.HISTORY, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
|
|
||
| render( | ||
| <ChatFlyout | ||
| flyoutVisible={true} | ||
| overrideComponent={null} | ||
| flyoutProps={{}} | ||
| flyoutFullScreen={false} | ||
| toggleFlyoutFullScreen={jest.fn()} | ||
| /> | ||
| ); | ||
| expect(screen.getByLabelText('chat panel').classList).toContain('llm-chat-hidden'); | ||
| expect(screen.getByLabelText('history panel').classList).not.toContain('llm-chat-hidden'); | ||
| }); | ||
|
|
||
| it('should display chat history page', () => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| selectedTabId: TAB_ID.HISTORY, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
|
|
||
| render( | ||
| <ChatFlyout | ||
| flyoutVisible={true} | ||
| overrideComponent={null} | ||
| flyoutProps={{}} | ||
| flyoutFullScreen={false} | ||
| toggleFlyoutFullScreen={jest.fn()} | ||
| /> | ||
| ); | ||
|
|
||
| expect(screen.queryByLabelText('mock chat history page')).toBeInTheDocument(); | ||
| expect( | ||
| screen.queryByLabelText('mock agent framework traces flyout body') | ||
| ).not.toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('should display traces page', () => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| selectedTabId: TAB_ID.TRACE, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
|
|
||
| render( | ||
| <ChatFlyout | ||
| flyoutVisible={true} | ||
| overrideComponent={null} | ||
| flyoutProps={{}} | ||
| flyoutFullScreen={false} | ||
| toggleFlyoutFullScreen={jest.fn()} | ||
| /> | ||
| ); | ||
|
|
||
| expect(screen.queryByLabelText('mock chat history page')).not.toBeInTheDocument(); | ||
| expect(screen.queryByLabelText('mock agent framework traces flyout body')).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('should always display chat panel when in fullscreen mode', () => { | ||
| jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ | ||
| setFlyoutVisible: jest.fn(), | ||
| // current tab is NOT chat | ||
| selectedTabId: TAB_ID.HISTORY, | ||
| traceId: 'chat_trace_id_mock', | ||
| }); | ||
|
|
||
| render( | ||
| <ChatFlyout | ||
| flyoutVisible={true} | ||
| overrideComponent={null} | ||
| flyoutProps={{}} | ||
| flyoutFullScreen={true} // fullscreen | ||
| toggleFlyoutFullScreen={jest.fn()} | ||
| /> | ||
| ); | ||
|
|
||
| expect(screen.getByLabelText('chat panel').classList).not.toContain('llm-chat-hidden'); | ||
| expect(screen.getByLabelText('history panel').classList).not.toContain('llm-chat-hidden'); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| /* | ||
| * Copyright OpenSearch Contributors | ||
| * SPDX-License-Identifier: Apache-2.0 | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import { render, screen, fireEvent, waitFor } from '@testing-library/react'; | ||
|
|
||
| import * as coreContextExports from '../contexts/core_context'; | ||
| import { CoreVisualization } from './core_visualization'; | ||
|
|
||
| describe('<CoreVisualization />', () => { | ||
| beforeEach(() => { | ||
| jest.spyOn(coreContextExports, 'useCore').mockReturnValue({ | ||
| services: { | ||
| uiSettings: { | ||
| get: jest.fn().mockReturnValue('MMM D, YYYY @ HH:mm:ss.SSS'), | ||
| }, | ||
| startDeps: { | ||
| dashboard: { | ||
| DashboardContainerByValueRenderer: () => <div />, | ||
| }, | ||
| }, | ||
| }, | ||
| }); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| jest.resetAllMocks(); | ||
| }); | ||
|
|
||
| it('should display visualization of last 15 minutes by default', () => { | ||
| render( | ||
| <CoreVisualization | ||
| message={{ type: 'output', contentType: 'visualization', content: 'vis_id_mock' }} | ||
| /> | ||
| ); | ||
| expect(screen.queryByText('Last 15 minutes')).toBeInTheDocument(); | ||
| }); | ||
| }); |