Skip to content

Commit

Permalink
[RNMobile] Fix issue in synced patterns related to missing `getRichTe…
Browse files Browse the repository at this point in the history
…xtValues` private API (#59632)

* Export `getRichTextValues` private API

This module is used in the footnotes logic, which is triggered on changes in the content of a synced pattern.

* Add integration test to cover issue's case
  • Loading branch information
fluiddot committed Mar 8, 2024
1 parent 232d520 commit 81621ef
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 0 deletions.
2 changes: 2 additions & 0 deletions packages/block-editor/src/private-apis.native.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
*/
import * as globalStyles from './components/global-styles';
import { ExperimentalBlockEditorProvider } from './components/provider';
import { getRichTextValues } from './components/rich-text/get-rich-text-values';
import { lock } from './lock-unlock';

/**
Expand All @@ -12,4 +13,5 @@ export const privateApis = {};
lock( privateApis, {
...globalStyles,
ExperimentalBlockEditorProvider,
getRichTextValues,
} );
67 changes: 67 additions & 0 deletions packages/block-library/src/block/test/edit.native.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import {
initializeEditor,
fireEvent,
within,
setupApiFetch,
triggerBlockListLayout,
} from 'test/helpers';

/**
Expand Down Expand Up @@ -42,6 +44,7 @@ const getMockedReusableBlock = ( id ) => ( {
id,
title: { raw: `Reusable block - ${ id }` },
type: 'wp_block',
meta: { footnotes: '' },
} );

beforeAll( () => {
Expand Down Expand Up @@ -187,4 +190,68 @@ describe( 'Synced patterns', () => {
expect( reusableBlock ).toBeDefined();
expect( headingInnerBlock ).toBeDefined();
} );

it( 'renders block after content is updated due to a side effect', async () => {
// We have to use different ids because entities are cached in memory.
const id = 5;
const initialHtml = `<!-- wp:block {"ref":${ id }} /-->`;
const endpoint = `/wp/v2/blocks/${ id }`;
const fetchMedia = {
request: {
path: `/wp/v2/media/1?context=edit`,
},
response: {
source_url: 'https://cldup.com/cXyG__fTLN.jpg',
id: 1,
// We need to include the sizes to trigger the side effect.
media_details: {
sizes: {
large: {
source_url:
'https://cldup.com/cXyG__fTLN.jpg?w=500',
},
},
},
},
};

// Return mocked response for the block endpoint.
fetchRequest.mockImplementation( ( { path } ) => {
let response = {};
if ( path.startsWith( endpoint ) ) {
response = getMockedReusableBlock( id );
}
// Replace content with an Image block to trigger a side effect.
// The side effect will be produced when the `source` attribute is replaced
// with an URL that includes the width query parameter:
// https://cldup.com/cXyG__fTLN.jpg => https://cldup.com/cXyG__fTLN.jpg?w=500
response.content.raw = `<!-- wp:image {"id":1,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://cldup.com/cXyG__fTLN.jpg" alt="" class="wp-image-1"/></figure>
<!-- /wp:image -->`;
return Promise.resolve( response );
} );

const screen = await initializeEditor( {
initialHtml,
} );

const reusableBlock = await screen.findByLabelText(
/Pattern Block\. Row 1/
);

// Mock media fetch requests
setupApiFetch( [ fetchMedia ] );

await triggerBlockListLayout(
within( reusableBlock ).getByTestId( 'block-list-wrapper' )
);

const imageBlock =
await within( reusableBlock ).getByLabelText(
'Image Block. Row 1'
);

expect( reusableBlock ).toBeDefined();
expect( imageBlock ).toBeDefined();
} );
} );

0 comments on commit 81621ef

Please sign in to comment.