From e73dcaa332dccca7d1621962fe9f9c78bda33532 Mon Sep 17 00:00:00 2001 From: gaobinlong Date: Tue, 12 Dec 2023 13:41:33 +0800 Subject: [PATCH] Add tests for agent framework traces components (#60) * Add tests for agent framework traces components Signed-off-by: gaobinlong * Modify test snapshot Signed-off-by: gaobinlong * Add more tests Signed-off-by: gaobinlong --------- Signed-off-by: gaobinlong --- .../agent_framework_traces.test.tsx.snap | 129 ++++++++++++++++++ .../agent_framework_traces.test.tsx | 91 ++++++++++++ ...gent_framework_traces_flyout_body.test.tsx | 79 +++++++++++ .../agent_framework_traces_flyout_body.tsx | 1 + 4 files changed, 300 insertions(+) create mode 100644 public/components/__snapshots__/agent_framework_traces.test.tsx.snap create mode 100644 public/components/agent_framework_traces.test.tsx create mode 100644 public/components/agent_framework_traces_flyout_body.test.tsx diff --git a/public/components/__snapshots__/agent_framework_traces.test.tsx.snap b/public/components/__snapshots__/agent_framework_traces.test.tsx.snap new file mode 100644 index 00000000..e543776a --- /dev/null +++ b/public/components/__snapshots__/agent_framework_traces.test.tsx.snap @@ -0,0 +1,129 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` spec renders the component 1`] = ` +HTMLCollection [ +
+
+
+

+ How was this generated +

+ + +

+ Question +

+ + +

+ Result +

+ + +

+ output +

+
+
+
+
+

+ Response +

+
+
+
+
+
+ +
+
+
+
+
+ 
+                  
+                    Input: 
+                    input
+                  
+
+
+
+ 
+                  
+                    Output: 
+                    output
+                  
+
+
+
+
+
+
+
+
+
, +] +`; diff --git a/public/components/agent_framework_traces.test.tsx b/public/components/agent_framework_traces.test.tsx new file mode 100644 index 00000000..77e0280e --- /dev/null +++ b/public/components/agent_framework_traces.test.tsx @@ -0,0 +1,91 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import '@testing-library/jest-dom/extend-expect'; +import { render, screen } from '@testing-library/react'; +import { AgentFrameworkTraces } from './agent_framework_traces'; +import * as GetTraces from '../hooks/use_fetch_agentframework_traces'; + +describe(' spec', () => { + it('renders the component', async () => { + const traces = [ + { + interactionId: 'test_interactionId', + parentInteractionId: 'test_parent_interactionId', + input: 'input', + output: 'output', + createTime: '', + origin: '', + traceNumber: 1, + }, + { + interactionId: 'test_interactionId', + parentInteractionId: 'test_parent_interactionId', + input: 'input', + output: 'output', + createTime: '', + origin: 'CatIndexTool', + traceNumber: 2, + }, + { + interactionId: 'test_interactionId', + parentInteractionId: 'test_parent_interactionId', + input: 'input', + output: '', + createTime: '', + origin: '', + traceNumber: 3, + }, + { + interactionId: 'test_interactionId', + parentInteractionId: 'test_parent_interactionId', + input: '', + output: 'output', + createTime: '', + origin: '', + traceNumber: 4, + }, + ]; + const mockedGetTracesResult = { + loading: false, + data: traces, + }; + + jest.spyOn(GetTraces, 'useFetchAgentFrameworkTraces').mockReturnValue(mockedGetTracesResult); + + render(); + expect(GetTraces.useFetchAgentFrameworkTraces).toBeCalledTimes(1); + expect(document.body.children).toMatchSnapshot(); + }); + + it('no traces available', async () => { + jest.spyOn(GetTraces, 'useFetchAgentFrameworkTraces').mockReturnValue({ + loading: false, + data: [], + }); + render(); + expect(screen.queryByText('Data not available.')).toBeInTheDocument(); + }); + + it('show loading', async () => { + jest.spyOn(GetTraces, 'useFetchAgentFrameworkTraces').mockReturnValue({ + loading: true, + data: [], + }); + render(); + expect(screen.queryByText('Loading...')).toBeInTheDocument(); + }); + + it('show error', async () => { + jest.spyOn(GetTraces, 'useFetchAgentFrameworkTraces').mockReturnValue({ + loading: false, + data: [], + error: new Error('test'), + }); + render(); + expect(screen.queryByText('Error loading details')).toBeInTheDocument(); + }); +}); diff --git a/public/components/agent_framework_traces_flyout_body.test.tsx b/public/components/agent_framework_traces_flyout_body.test.tsx new file mode 100644 index 00000000..0822b8be --- /dev/null +++ b/public/components/agent_framework_traces_flyout_body.test.tsx @@ -0,0 +1,79 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import '@testing-library/jest-dom/extend-expect'; +import { act, waitFor, render, screen, fireEvent } from '@testing-library/react'; +import * as chatContextExports from '../contexts/chat_context'; +import { AgentFrameworkTracesFlyoutBody } from './agent_framework_traces_flyout_body'; +import { TAB_ID } from '../utils/constants'; + +jest.mock('./agent_framework_traces', () => { + return { + AgentFrameworkTraces: () =>
, + }; +}); + +describe(' spec', () => { + it('show back button if traceId exists', async () => { + const onCloseMock = jest.fn(); + jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ + traceId: 'test-trace-Id', + setSelectedTabId: onCloseMock, + }); + render(); + expect(screen.queryAllByLabelText('back')).toHaveLength(1); + act(() => { + fireEvent.click(screen.getByText('Back')); + }); + await waitFor(() => { + expect(onCloseMock).toHaveBeenCalledWith(TAB_ID.CHAT); + }); + }); + + it('no back button if traceId does not exist', async () => { + jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ + traceId: undefined, + }); + render(); + expect(screen.queryAllByLabelText('back')).toHaveLength(0); + }); + + it('fullscreen with opening from chat', async () => { + const onCloseMock = jest.fn(); + jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ + traceId: 'test-trace-id', + flyoutFullScreen: true, + setSelectedTabId: onCloseMock, + preSelectedTabId: TAB_ID.CHAT, + }); + render(); + expect(screen.queryAllByLabelText('close')).toHaveLength(1); + act(() => { + fireEvent.click(screen.queryAllByLabelText('close')[0]); + }); + await waitFor(() => { + expect(onCloseMock).toHaveBeenCalledWith(TAB_ID.CHAT); + }); + }); + + it('fullscreen with opening from history', async () => { + const onCloseMock = jest.fn(); + jest.spyOn(chatContextExports, 'useChatContext').mockReturnValue({ + traceId: 'test-trace-id', + flyoutFullScreen: true, + setSelectedTabId: onCloseMock, + preSelectedTabId: TAB_ID.HISTORY, + }); + render(); + expect(screen.queryAllByLabelText('back')).toHaveLength(1); + act(() => { + fireEvent.click(screen.getByText('Back')); + }); + await waitFor(() => { + expect(onCloseMock).toHaveBeenCalledWith(TAB_ID.HISTORY); + }); + }); +}); diff --git a/public/components/agent_framework_traces_flyout_body.tsx b/public/components/agent_framework_traces_flyout_body.tsx index 3aefdbfd..1dcdc20b 100644 --- a/public/components/agent_framework_traces_flyout_body.tsx +++ b/public/components/agent_framework_traces_flyout_body.tsx @@ -36,6 +36,7 @@ export const AgentFrameworkTracesFlyoutBody: React.FC = () => { {showBack && ( {