Skip to content

Commit

Permalink
Rename registered editors callback
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mati365
Mati365 committed Aug 19, 2024
1 parent 1a2be66 commit 6417489
Show file tree
Hide file tree
Showing 4 changed files with 37 additions and 34 deletions.
2 changes: 1 addition & 1 deletion demos/react/ContextDemo.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export default function ContextDemo( props: ContextDemoProps ): JSX.Element {
<CKEditorContext
context={ ClassicEditor.Context as any }
contextWatchdog={ ClassicEditor.ContextWatchdog as any }
onChangeEditorsMap={ editors => {
onWatchInitializedEditors={ editors => {
setState( editors as any );
} }
>
Expand Down
8 changes: 4 additions & 4 deletions src/context/ckeditorcontext.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ const CKEditorContext = <TContext extends Context = Context>( props: Props<TCont
children, config, onReady,
contextWatchdog: ContextWatchdogConstructor,
isLayoutReady = true,
onChangeEditorsMap,
onWatchInitializedEditors,
onError = ( error, details ) => console.error( error, details )
} = props;

Expand Down Expand Up @@ -71,10 +71,10 @@ const CKEditorContext = <TContext extends Context = Context>( props: Props<TCont
}
}, [ currentContextWatchdog ] );

// Listen for the editor initialization and destruction events and call the onChangeEditorsMap function.
// Listen for the editor initialization and destruction events and call the onWatchInitializedEditors function.
useInitializedCKEditorsMap( {
currentContextWatchdog,
onChangeEditorsMap
onWatchInitializedEditors
} );

/**
Expand Down Expand Up @@ -239,7 +239,7 @@ export type ExtractContextWatchdogValueByStatus<S extends ContextWatchdogValueSt
*/
export type Props<TContext extends Context> =
& PropsWithChildren
& Pick<InitializedContextEditorsConfig<TContext>, 'onChangeEditorsMap'>
& Pick<InitializedContextEditorsConfig<TContext>, 'onWatchInitializedEditors'>
& {
id?: string;
isLayoutReady?: boolean;
Expand Down
15 changes: 9 additions & 6 deletions src/context/useInitializedCKEditorsMap.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@ import {
*
* @param config The configuration of the hook.
* @param config.currentContextWatchdog The current context watchdog value.
* @param config.onChangeEditorsMap The function that updates the editors map.
* @param config.onWatchInitializedEditors The function that updates the editors map.
* @example
* ```ts
* useInitializedCKEditorsMap( {
* currentContextWatchdog,
* onChangeEditorsMap: ( editors, context ) => {
* onWatchInitializedEditors: ( editors, context ) => {
* console.log( 'Editors:', editors );
* }
* } );
Expand All @@ -33,11 +33,11 @@ import {
export const useInitializedCKEditorsMap = <TContext extends Context>(
{
currentContextWatchdog,
onChangeEditorsMap
onWatchInitializedEditors
}: InitializedContextEditorsConfig<TContext>
): void => {
// We need to use the safe callback to prevent the stale closure problem.
const onChangeEditorsMapSafe = useRefSafeCallback( onChangeEditorsMap || ( () => {} ) );
const onWatchInitializedEditorsSafe = useRefSafeCallback( onWatchInitializedEditors || ( () => {} ) );

useEffect( () => {
if ( currentContextWatchdog.status !== 'initialized' ) {
Expand Down Expand Up @@ -73,7 +73,7 @@ export const useInitializedCKEditorsMap = <TContext extends Context>(

// The function that is called when the editor status changes.
const onEditorStatusChange = () => {
onChangeEditorsMapSafe(
onWatchInitializedEditorsSafe(
getInitializedContextEditors(),
watchdog
);
Expand Down Expand Up @@ -114,5 +114,8 @@ export type InitializedContextEditorsConfig<TContext extends Context> = {
/**
* The callback called when the editors map changes.
*/
onChangeEditorsMap?: ( editors: InitializedEditorsMap, watchdog: ContextWatchdog<TContext> ) => void;
onWatchInitializedEditors?: (
editors: InitializedEditorsMap,
watchdog: ContextWatchdog<TContext>
) => void;
};
46 changes: 23 additions & 23 deletions tests/context/ckeditorcontext.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -374,16 +374,16 @@ describe( '<CKEditorContext> Component', () => {
} );
} );

describe( '#onChangeEditorsMap', () => {
describe( '#onWatchInitializedEditors', () => {
it( 'should call the callback once in strict mode', async () => {
const onChangeEditorsMapSpy = vi.fn();
const onWatchInitializedEditorsSpy = vi.fn();

component = render(
<StrictMode>
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor editor={ ClassicEditor } />
</CKEditorContext>
Expand All @@ -392,27 +392,27 @@ describe( '<CKEditorContext> Component', () => {

await timeout( 200 );
await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledOnce();
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledOnce();
} );
} );

it( 'should use editor uuid as key in the editors map', async () => {
const onChangeEditorsMapSpy = vi.fn();
const onWatchInitializedEditorsSpy = vi.fn();

component = render(
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor editor={ ClassicEditor } />
</CKEditorContext>
);

await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledOnce();
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledOnce();

const [ editors, watchdog ] = onChangeEditorsMapSpy.mock.lastCall!;
const [ editors, watchdog ] = onWatchInitializedEditorsSpy.mock.lastCall!;
const [ editorId ] = Object.keys( editors );

// Ensure that the editor UUID is returned.
Expand All @@ -425,13 +425,13 @@ describe( '<CKEditorContext> Component', () => {
} );

it( 'should use editorName property passed to the CKEditor component as key in the editors map', async () => {
const onChangeEditorsMapSpy = vi.fn();
const onWatchInitializedEditorsSpy = vi.fn();

component = render(
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor
editor={ ClassicEditor }
Expand All @@ -441,9 +441,9 @@ describe( '<CKEditorContext> Component', () => {
);

await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledOnce();
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledOnce();

const [ editors ] = onChangeEditorsMapSpy.mock.lastCall!;
const [ editors ] = onWatchInitializedEditorsSpy.mock.lastCall!;
const editorId = 'my-editor';

expect( editors ).to.have.property( editorId );
Expand All @@ -452,13 +452,13 @@ describe( '<CKEditorContext> Component', () => {
} );

it( 'should initialized multiple editors and track them', async () => {
const onChangeEditorsMapSpy = vi.fn();
const onWatchInitializedEditorsSpy = vi.fn();

component = render(
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor
editor={ ClassicEditor }
Expand All @@ -472,9 +472,9 @@ describe( '<CKEditorContext> Component', () => {
);

await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledTimes( 2 );
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledTimes( 2 );

const [ editors ] = onChangeEditorsMapSpy.mock.lastCall!;
const [ editors ] = onWatchInitializedEditorsSpy.mock.lastCall!;

expect( Object.keys( editors ) ).to.have.length( 2 );
expect( editors ).to.have.property( 'editor1' );
Expand All @@ -483,13 +483,13 @@ describe( '<CKEditorContext> Component', () => {
} );

it( 'should be possible to forward metadata to the editors map', async () => {
const onChangeEditorsMapSpy = vi.fn();
const onWatchInitializedEditorsSpy = vi.fn();

component = render(
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor
editor={ ClassicEditor }
Expand All @@ -502,9 +502,9 @@ describe( '<CKEditorContext> Component', () => {
);

await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledOnce();
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledOnce();

const [ editors ] = onChangeEditorsMapSpy.mock.lastCall!;
const [ editors ] = onWatchInitializedEditorsSpy.mock.lastCall!;
const editorId = 'editor1';

expect( editors[ editorId ].metadata ).to.deep.equal( {
Expand All @@ -515,15 +515,15 @@ describe( '<CKEditorContext> Component', () => {
} );

it( 'should track only initialized editors', async () => {
const onChangeEditorsMapSpy = vi.fn().mockImplementation( ( editors: any ) => {
const onWatchInitializedEditorsSpy = vi.fn().mockImplementation( ( editors: any ) => {
expect( editors.editor1.instance.state ).to.be.equal( 'ready' );
} );

component = render(
<CKEditorContext
context={ ClassicEditor.Context }
contextWatchdog={ ClassicEditor.ContextWatchdog }
onChangeEditorsMap={ onChangeEditorsMapSpy }
onWatchInitializedEditors={ onWatchInitializedEditorsSpy }
>
<CKEditor
editor={ ClassicEditor }
Expand All @@ -535,7 +535,7 @@ describe( '<CKEditorContext> Component', () => {
);

await waitFor( () => {
expect( onChangeEditorsMapSpy ).toHaveBeenCalledOnce();
expect( onWatchInitializedEditorsSpy ).toHaveBeenCalledOnce();
} );
} );
} );
Expand Down

0 comments on commit 6417489

Please sign in to comment.