-
Notifications
You must be signed in to change notification settings - Fork 67
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[RTE] Add tests for Rich Text Editor (#4813)
* Add test for handleBeforePasteEvent * TableEdit Test * Add test for chat composite * Fix chat composite test * Rename ChatAdapter to ChatComposite in test file * Clean up * Clean up * Clean up * Add cc * CC * Update test description * Add empty test for CC * Add test for false value
- Loading branch information
Showing
4 changed files
with
155 additions
and
31 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
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
109 changes: 109 additions & 0 deletions
109
packages/react-composites/src/composites/ChatComposite/ChatComposite.test.tsx
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,109 @@ | ||
| // Copyright (c) Microsoft Corporation. | ||
| // Licensed under the MIT License. | ||
|
|
||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import { ChatAdapter, ChatAdapterState } from './adapter/ChatAdapter'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import { registerIcons } from '@fluentui/react'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import { render, screen } from '@testing-library/react'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import '@testing-library/jest-dom'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import { COMPOSITE_LOCALE_ZH_TW } from '../localization/locales/zh-TW/CompositeLocale'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import { ChatComposite } from './ChatComposite'; | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| import React from 'react'; | ||
|
|
||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| function createMockChatAdapter(): ChatAdapter { | ||
| const chatAdapter = {} as ChatAdapter; | ||
| chatAdapter.onStateChange = jest.fn(); | ||
| chatAdapter.offStateChange = jest.fn(); | ||
| chatAdapter.fetchInitialData = jest.fn(); | ||
| chatAdapter.loadPreviousChatMessages = jest.fn(); | ||
| chatAdapter.getState = jest.fn( | ||
| (): ChatAdapterState => ({ | ||
| userId: { kind: 'communicationUser', communicationUserId: 'test' }, | ||
| displayName: 'test', | ||
| thread: { | ||
| chatMessages: {}, | ||
| participants: {}, | ||
| threadId: 'test', | ||
| readReceipts: [], | ||
| typingIndicators: [], | ||
| latestReadTime: new Date() | ||
| }, | ||
| latestErrors: {}, | ||
| error: undefined | ||
| }) | ||
| ); | ||
| return chatAdapter; | ||
| } | ||
|
|
||
| // Mock the richTextSendBoxWrapper component as it's lazy loaded in ChatComposite | ||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| function MockedRichTextSendBoxWrapper(): JSX.Element { | ||
| return <div id="richTextSendBoxWrapper">Mocked RichTextSendboxWrapper</div>; | ||
| } | ||
|
|
||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| jest.mock('../common/RichTextSendBoxWrapper', () => { | ||
| return { | ||
| RichTextSendBoxWrapper: MockedRichTextSendBoxWrapper | ||
| }; | ||
| }); | ||
|
|
||
| /* @conditional-compile-remove(rich-text-editor-composite-support) */ | ||
| describe('ChatComposite', () => { | ||
| beforeEach(() => { | ||
| // Register icons used in ChatComposite to avoid warnings | ||
| registerIcons({ | ||
| icons: { | ||
| chevrondown: <></> | ||
| } | ||
| }); | ||
| }); | ||
|
|
||
| test('Chat Composite should show RichTextSendBoxWrapper if it is enabled', async () => { | ||
| const mockBaseCompositeProps = { | ||
| fluentTheme: {}, | ||
| icons: {}, | ||
| locale: COMPOSITE_LOCALE_ZH_TW, | ||
| rtl: true, | ||
| onFetchAvatarPersonaData: jest.fn(), | ||
| options: { | ||
| richTextEditor: true | ||
| } | ||
| }; | ||
|
|
||
| const mockChatAdapter = createMockChatAdapter(); | ||
|
|
||
| render(<ChatComposite adapter={mockChatAdapter} {...mockBaseCompositeProps} />); | ||
| expect(await screen.findByText(/Mocked RichTextSendboxWrapper/)).toBeVisible(); | ||
| }); | ||
|
|
||
| test('Chat Composite should not show RichTextSendBoxWrapper if it is not enabled', async () => { | ||
| const mockBaseCompositeProps = { | ||
| fluentTheme: {}, | ||
| icons: {}, | ||
| locale: COMPOSITE_LOCALE_ZH_TW, | ||
| rtl: true, | ||
| onFetchAvatarPersonaData: jest.fn(), | ||
| options: { | ||
| richTextEditor: false | ||
| } | ||
| }; | ||
|
|
||
| const mockChatAdapter = createMockChatAdapter(); | ||
|
|
||
| render(<ChatComposite adapter={mockChatAdapter} {...mockBaseCompositeProps} />); | ||
| expect(screen.findByText(/Mocked RichTextSendboxWrapper/)).rejects.toThrow(); | ||
| }); | ||
| }); | ||
|
|
||
| // Remove when rich-text-editor-composite-support is GA | ||
| describe('Empty Test', () => { | ||
| test.skip('Empty test for Conditional Compile case where no tests are included', (done) => done()); | ||
| }); |