Ckeditors are rendered as hidden during tests when testing with react testing libraries

[M-Ravilal]

I am getting the ckeditor rendered as hidden during tests using react testing library. Here is the sample code of the component and test structure
Component setup:

<RichTextEditor
name='choice'
onChange={(event) => choiceChange(event)}
onReady={(editor) => {
setChoiceEditor(editor);
choiceEditorRef.current = editor;
}}
initData={choice}
readOnly={editData?.InUse}
/>

Test setup:
let isEdit = true;
const isTranslateActionType = false;
const renderMultipleChoiceScreen = async () =>
waitFor(() =>
expect(() => {
render(

);
}).not.toThrowError()
);

describe('MultipleChoice', () => {
afterEach(cleanup);

it('should render with all fields in Edit Mode, Select Line', async ()
=> {
await renderMultipleChoiceScreen();

const btnSelect = document.getElementById('select-question');
expect(btnSelect).toBeInTheDocument();
userEvent.click(btnSelect);

const btnReset = document.getElementById('reset');
expect(btnReset).toBeInTheDocument();
userEvent.click(btnReset);

userEvent.click(btnSelect);

const btnUpdate = document.getElementById('update');
expect(btnUpdate).toBeInTheDocument();
expect(btnUpdate).toBeDisabled();

});

tried this way
// CKEDITORS - renders as hidden during tests
expect( document.querySelectorAll('div[style*="display: none"]').length ).toBe(4); expect( document.querySelectorAll('div[style*="visibility: hidden"]').length ).toBe(4);

this works but unable to set the value and test the updated value

• CKEditor version: 3.1.0
• Installed CKEditor plugins: ckeditor4-react

[M-Ravilal]

@Comandeer @jacekbogdanski , can you please help?