From d9504c17542b474638f4b4f44d652043a7c729aa Mon Sep 17 00:00:00 2001 From: Marin Atanasov <8436925+tyxla@users.noreply.github.com> Date: Fri, 2 Sep 2022 12:29:14 +0300 Subject: [PATCH] Post Editor: Refactor `MetaBoxesSection` tests to `@testing-library/react` (#43774) * Post Editor: Refactor MetaBoxesSection tests to @testing-library/react * queryByRole -> getByRole * Add an accessible title to the query --- .../__snapshots__/meta-boxes-section.js.snap | 438 ++++++++++++++++-- .../test/meta-boxes-section.js | 24 +- 2 files changed, 418 insertions(+), 44 deletions(-) diff --git a/packages/edit-post/src/components/preferences-modal/test/__snapshots__/meta-boxes-section.js.snap b/packages/edit-post/src/components/preferences-modal/test/__snapshots__/meta-boxes-section.js.snap index 18cd57ad1252d8..e76e7c106efb0a 100644 --- a/packages/edit-post/src/components/preferences-modal/test/__snapshots__/meta-boxes-section.js.snap +++ b/packages/edit-post/src/components/preferences-modal/test/__snapshots__/meta-boxes-section.js.snap @@ -1,48 +1,416 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`MetaBoxesSection renders a Custom Fields option 1`] = ` -
*+*:not( marquee ) { + margin-left: calc(4px * 3); +} + +.emotion-4>* { + min-width: 0; +} + +
- -
+ +

+ Advanced panels +

+ +
+
+
+
+ + + + + + +
+
+
+
+ `; exports[`MetaBoxesSection renders a Custom Fields option and meta box options 1`] = ` -
*+*:not( marquee ) { + margin-left: calc(4px * 3); +} + +.emotion-4>* { + min-width: 0; +} + +
- - - -
+ +

+ Advanced panels +

+ +
+
+
+
+ + + + + + +
+
+
+
+
+
+
+
+ + + + + + +
+
+
+
+
+
+
+
+ + + + + + +
+
+
+
+ `; exports[`MetaBoxesSection renders meta box options 1`] = ` -
*+*:not( marquee ) { + margin-left: calc(4px * 3); +} + +.emotion-4>* { + min-width: 0; +} + +
- - -
+ +

+ Advanced panels +

+ +
+
+
+
+ + + + + + +
+
+
+
+
+
+
+
+ + + + + + +
+
+
+
+ `; diff --git a/packages/edit-post/src/components/preferences-modal/test/meta-boxes-section.js b/packages/edit-post/src/components/preferences-modal/test/meta-boxes-section.js index b00d2fdffb512c..89d642967efcd8 100644 --- a/packages/edit-post/src/components/preferences-modal/test/meta-boxes-section.js +++ b/packages/edit-post/src/components/preferences-modal/test/meta-boxes-section.js @@ -1,7 +1,7 @@ /** * External dependencies */ -import { shallow } from 'enzyme'; +import { render, screen } from '@testing-library/react'; /** * Internal dependencies @@ -10,7 +10,7 @@ import { MetaBoxesSection } from '../meta-boxes-section'; describe( 'MetaBoxesSection', () => { it( 'does not render if there are no options', () => { - const wrapper = shallow( + render( { ] } /> ); - expect( wrapper.isEmptyRender() ).toBe( true ); + expect( screen.queryByRole( 'group' ) ).not.toBeInTheDocument(); } ); it( 'renders a Custom Fields option', () => { - const wrapper = shallow( + render( { ] } /> ); - expect( wrapper ).toMatchSnapshot(); + expect( + screen.getByRole( 'group', { name: 'Advanced panels' } ) + ).toMatchSnapshot(); } ); it( 'renders meta box options', () => { - const wrapper = shallow( + render( { ] } /> ); - expect( wrapper ).toMatchSnapshot(); + expect( + screen.getByRole( 'group', { name: 'Advanced panels' } ) + ).toMatchSnapshot(); } ); it( 'renders a Custom Fields option and meta box options', () => { - const wrapper = shallow( + render( { ] } /> ); - expect( wrapper ).toMatchSnapshot(); + expect( + screen.getByRole( 'group', { name: 'Advanced panels' } ) + ).toMatchSnapshot(); } ); } );