From eec9429b38d902404e6c448f8932ef408cf0cb9a Mon Sep 17 00:00:00 2001 From: Gerardo Pacheco Date: Tue, 11 Oct 2022 12:09:58 +0200 Subject: [PATCH] Mobile - Code block - Migrate from React Test Render to React Native Testing Library (#44833) * Mobile - Code block - Migrate from react-test-render to testing-library/react-native * Mobile - Code block - Check the block is visible --- .../test/__snapshots__/edit.native.js.snap | 13 ++++ .../src/code/test/edit.native.js | 78 +++++++++++-------- 2 files changed, 59 insertions(+), 32 deletions(-) create mode 100644 packages/block-library/src/code/test/__snapshots__/edit.native.js.snap diff --git a/packages/block-library/src/code/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/code/test/__snapshots__/edit.native.js.snap new file mode 100644 index 00000000000000..9b2fc565f56895 --- /dev/null +++ b/packages/block-library/src/code/test/__snapshots__/edit.native.js.snap @@ -0,0 +1,13 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Code renders given text without crashing 1`] = ` +" +
Sample text
+" +`; + +exports[`Code renders without crashing 1`] = ` +" +
+" +`; diff --git a/packages/block-library/src/code/test/edit.native.js b/packages/block-library/src/code/test/edit.native.js index 55529378a2316c..0f693fa2136ce1 100644 --- a/packages/block-library/src/code/test/edit.native.js +++ b/packages/block-library/src/code/test/edit.native.js @@ -1,51 +1,65 @@ /** * External dependencies */ -import renderer from 'react-test-renderer'; -import { TextInput } from 'react-native'; +import { + fireEvent, + getEditorHtml, + initializeEditor, + addBlock, + getBlock, +} from 'test/helpers'; /** * WordPress dependencies */ -import { BlockEdit } from '@wordpress/block-editor'; -import { registerBlockType, unregisterBlockType } from '@wordpress/blocks'; - -/** - * Internal dependencies - */ -import { metadata, settings, name } from '../index'; - -const Code = ( { clientId, ...props } ) => ( - -); +import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks'; +import { registerCoreBlocks } from '@wordpress/block-library'; describe( 'Code', () => { beforeAll( () => { - registerBlockType( name, { - ...metadata, - ...settings, - } ); + // Register all core blocks + registerCoreBlocks(); } ); afterAll( () => { - unregisterBlockType( name ); + // Clean up registered blocks + getBlockTypes().forEach( ( block ) => { + unregisterBlockType( block.name ); + } ); } ); - it( 'renders without crashing', () => { - const component = renderer.create( - - ); - const rendered = component.toJSON(); - expect( rendered ).toBeTruthy(); + it( 'renders without crashing', async () => { + const screen = await initializeEditor(); + + // Add block + await addBlock( screen, 'Code' ); + + // Get block + const codeBlock = await getBlock( screen, 'Code' ); + expect( codeBlock ).toBeVisible(); + + expect( getEditorHtml() ).toMatchSnapshot(); } ); - it( 'renders given text without crashing', () => { - const component = renderer.create( - - ); - const testInstance = component.root; - const textInput = testInstance.findByType( TextInput ); - expect( textInput ).toBeTruthy(); - expect( textInput.props.value ).toBe( 'sample text' ); + it( 'renders given text without crashing', async () => { + const initialHtml = ` +
Sample text
+ `; + + const screen = await initializeEditor( { + initialHtml, + } ); + const { getByDisplayValue } = screen; + + // Get block + const codeBlock = await getBlock( screen, 'Code' ); + expect( codeBlock ).toBeVisible(); + fireEvent.press( codeBlock ); + + // Get initial text + const codeBlockText = getByDisplayValue( 'Sample text' ); + expect( codeBlockText ).toBeVisible(); + + expect( getEditorHtml() ).toMatchSnapshot(); } ); } );