RichText: attempt to fix RTL e2e test #23203

ellatrix · 2020-06-16T12:38:33Z

Description

There's an RTL e2e test that is sometimes failing in master, likely caused by the RichText rewrite with hooks.

Failure:

FAIL packages/e2e-tests/specs/editor/various/rtl.test.js (24.339s)
759  RTL
760    ✓ should arrow navigate (4065ms)
761    ✓ should split (3491ms)
762    ✓ should merge backward (3369ms)
763    ✓ should merge forward (3502ms)
764    ✓ should arrow navigate between blocks (3375ms)
765    ✕ should navigate inline boundaries (3298ms)
766
767  ● RTL › should navigate inline boundaries
768
769    expect(received).toMatchSnapshot()
770
771    Snapshot name: `RTL should navigate inline boundaries 1`
772
773    - Snapshot  - 1
774    + Received  + 1
775
776      <!-- wp:paragraph -->
777    - <p><strong>١</strong>٠٢</p>
778    + <p>١<strong>٠٢</strong></p>
779      <!-- /wp:paragraph -->
780
781      115 | 			await page.keyboard.type( ARABIC_ZERO );
782      116 | 
783    > 117 | 			expect( await getEditedPostContent() ).toMatchSnapshot();
784          | 			                                       ^
785      118 | 
786      119 | 			await page.keyboard.press( 'Backspace' );
787      120 | 		}
788
789      at Object.<anonymous> (specs/editor/various/rtl.test.js:117:43)
790          at runMicrotasks (<anonymous>)
791
792  ● RTL › should navigate inline boundaries
793
794    expect(received).toMatchSnapshot()
795
796    Snapshot name: `RTL should navigate inline boundaries 2`
797
798    - Snapshot  - 1
799    + Received  + 1
800
801      <!-- wp:paragraph -->
802    - <p><strong>١٠</strong>٢</p>
803    + <p>١٠<strong>٢</strong></p>
804      <!-- /wp:paragraph -->
805
806      115 | 			await page.keyboard.type( ARABIC_ZERO );
807      116 | 
808    > 117 | 			expect( await getEditedPostContent() ).toMatchSnapshot();
809          | 			                                       ^
810      118 | 
811      119 | 			await page.keyboard.press( 'Backspace' );
812      120 | 		}
813
814      at Object.<anonymous> (specs/editor/various/rtl.test.js:117:43)
815          at runMicrotasks (<anonymous>)
816
817  ● RTL › should navigate inline boundaries
818
819    expect(received).toMatchSnapshot()
820
821    Snapshot name: `RTL should navigate inline boundaries 3`
822
823    - Snapshot  - 1
824    + Received  + 1
825
826      <!-- wp:paragraph -->
827    - <p><strong>٠١</strong>٢</p>
828    + <p>٠١<strong>٢</strong></p>
829      <!-- /wp:paragraph -->
830
831      115 | 			await page.keyboard.type( ARABIC_ZERO );
832      116 | 
833    > 117 | 			expect( await getEditedPostContent() ).toMatchSnapshot();
834          | 			                                       ^
835      118 | 
836      119 | 			await page.keyboard.press( 'Backspace' );
837      120 | 		}
838
839      at Object.<anonymous> (specs/editor/various/rtl.test.js:117:43)
840          at runMicrotasks (<anonymous>)
841
842  ● RTL › should navigate inline boundaries
843
844    expect(received).toMatchSnapshot()
845
846    Snapshot name: `RTL should navigate inline boundaries 4`
847
848    - Snapshot  - 1
849    + Received  + 1
850
851      <!-- wp:paragraph -->
852    - <p>٠<strong>١</strong>٢</p>
853    + <p>١<strong>٢</strong></p>
854      <!-- /wp:paragraph -->
855
856      115 | 			await page.keyboard.type( ARABIC_ZERO );
857      116 | 
858    > 117 | 			expect( await getEditedPostContent() ).toMatchSnapshot();
859          | 			                                       ^
860      118 | 
861      119 | 			await page.keyboard.press( 'Backspace' );
862      120 | 		}
863
864      at Object.<anonymous> (specs/editor/various/rtl.test.js:117:43)
865          at runMicrotasks (<anonymous>)
866
867 › 4 snapshots failed.

How has this been tested?

Screenshots

Types of changes

Checklist:

My code is tested.
My code follows the WordPress code style.
My code follows the accessibility standards.
My code has proper inline documentation.
I've included developer documentation if appropriate.
I've updated all React Native files affected by any refactorings/renamings in this PR.

github-actions · 2020-06-16T12:44:52Z

Size Change: 0 B

Total Size: 1.12 MB

ℹ️ View Unchanged

Filename	Size	Change
`build/a11y/index.js`	1.14 kB	0 B
`build/annotations/index.js`	3.62 kB	0 B
`build/api-fetch/index.js`	3.4 kB	0 B
`build/autop/index.js`	2.83 kB	0 B
`build/blob/index.js`	620 B	0 B
`build/block-directory/index.js`	7.27 kB	0 B
`build/block-directory/style-rtl.css`	955 B	0 B
`build/block-directory/style.css`	955 B	0 B
`build/block-editor/index.js`	106 kB	0 B
`build/block-editor/style-rtl.css`	10.7 kB	0 B
`build/block-editor/style.css`	10.7 kB	0 B
`build/block-library/editor-rtl.css`	7.57 kB	0 B
`build/block-library/editor.css`	7.58 kB	0 B
`build/block-library/index.js`	129 kB	0 B
`build/block-library/style-rtl.css`	8.02 kB	0 B
`build/block-library/style.css`	8.02 kB	0 B
`build/block-library/theme-rtl.css`	749 B	0 B
`build/block-library/theme.css`	751 B	0 B
`build/block-serialization-default-parser/index.js`	1.88 kB	0 B
`build/block-serialization-spec-parser/index.js`	3.1 kB	0 B
`build/blocks/index.js`	48.1 kB	0 B
`build/components/index.js`	195 kB	0 B
`build/components/style-rtl.css`	15.9 kB	0 B
`build/components/style.css`	15.9 kB	0 B
`build/compose/index.js`	9.32 kB	0 B
`build/core-data/index.js`	11.4 kB	0 B
`build/data-controls/index.js`	1.29 kB	0 B
`build/data/index.js`	8.44 kB	0 B
`build/date/index.js`	5.47 kB	0 B
`build/deprecated/index.js`	772 B	0 B
`build/dom-ready/index.js`	568 B	0 B
`build/dom/index.js`	3.17 kB	0 B
`build/edit-navigation/index.js`	8.26 kB	0 B
`build/edit-navigation/style-rtl.css`	1.04 kB	0 B
`build/edit-navigation/style.css`	1.04 kB	0 B
`build/edit-post/index.js`	302 kB	0 B
`build/edit-post/style-rtl.css`	5.6 kB	0 B
`build/edit-post/style.css`	5.6 kB	0 B
`build/edit-site/index.js`	16.6 kB	0 B
`build/edit-site/style-rtl.css`	3.13 kB	0 B
`build/edit-site/style.css`	3.13 kB	0 B
`build/edit-widgets/index.js`	9.34 kB	0 B
`build/edit-widgets/style-rtl.css`	2.54 kB	0 B
`build/edit-widgets/style.css`	2.54 kB	0 B
`build/editor/editor-styles-rtl.css`	486 B	0 B
`build/editor/editor-styles.css`	487 B	0 B
`build/editor/index.js`	44.8 kB	0 B
`build/editor/style-rtl.css`	3.82 kB	0 B
`build/editor/style.css`	3.82 kB	0 B
`build/element/index.js`	4.64 kB	0 B
`build/escape-html/index.js`	733 B	0 B
`build/format-library/index.js`	7.72 kB	0 B
`build/format-library/style-rtl.css`	561 B	0 B
`build/format-library/style.css`	562 B	0 B
`build/hooks/index.js`	2.13 kB	0 B
`build/html-entities/index.js`	622 B	0 B
`build/i18n/index.js`	3.56 kB	0 B
`build/is-shallow-equal/index.js`	710 B	0 B
`build/keyboard-shortcuts/index.js`	2.51 kB	0 B
`build/keycodes/index.js`	1.94 kB	0 B
`build/list-reusable-blocks/index.js`	3.13 kB	0 B
`build/list-reusable-blocks/style-rtl.css`	537 B	0 B
`build/list-reusable-blocks/style.css`	537 B	0 B
`build/media-utils/index.js`	5.29 kB	0 B
`build/notices/index.js`	1.79 kB	0 B
`build/nux/index.js`	3.4 kB	0 B
`build/nux/style-rtl.css`	681 B	0 B
`build/nux/style.css`	676 B	0 B
`build/plugins/index.js`	2.56 kB	0 B
`build/primitives/index.js`	1.5 kB	0 B
`build/priority-queue/index.js`	789 B	0 B
`build/redux-routine/index.js`	2.85 kB	0 B
`build/rich-text/index.js`	14 kB	0 B
`build/server-side-render/index.js`	2.68 kB	0 B
`build/shortcode/index.js`	1.7 kB	0 B
`build/token-list/index.js`	1.28 kB	0 B
`build/url/index.js`	4.06 kB	0 B
`build/viewport/index.js`	1.85 kB	0 B
`build/warning/index.js`	1.14 kB	0 B
`build/wordcount/index.js`	1.17 kB	0 B

_{compressed-size-action}

ellatrix · 2020-06-16T13:44:23Z

packages/e2e-tests/specs/editor/various/rtl.test.js

@@ -104,6 +104,9 @@ describe( 'RTL', () => {
 		await page.evaluate( () => ( document.dir = 'rtl' ) );
 		await page.keyboard.press( 'Enter' );

+		// Wait for rich text editor to load.
+		await page.waitForSelector( '.block-editor-rich-text__editable' );


This is also used here:

gutenberg/packages/e2e-tests/specs/editor/various/rich-text.test.js

Lines 256 to 262 in cb10e2d

it( 'should handle Home and End keys', async () => {

await page.keyboard.press( 'Enter' );

// Wait for rich text editor to load.

await page.waitForSelector( '.block-editor-rich-text__editable' );

await pressKeyWithModifier( 'primary', 'b' );

The reason why this is sometimes needed: caret position is not possible to be set internally upon focus. RichText only knows this information after a small delay. That's ok for typing since that's done by the browser, but it is needed for applying formats.

ellatrix · 2020-06-16T17:34:38Z

There's some other tests failing around block transforms which seems to be unrelated to the RichText change. I cannot see the failure in test failures following the RichTex change.

I've run the e2e test a few times and the RTL failure is gone, so let's merge this as it solves at lease all RTL failures. I'll investigate the remaining separately.

ellatrix · 2020-06-16T17:40:59Z

I also saw the quote failure on another PR: https://travis-ci.com/github/WordPress/gutenberg/jobs/349718433

ItsJonQ · 2020-06-16T18:57:39Z

🙏 Thanks @ellatrix !

ellatrix requested review from etoledom and SergioEstevao as code owners June 16, 2020 12:38

RichText: attempt to fix RTL e2e tests

70789f0

ellatrix force-pushed the fix/rich-text-rtl-e2e-test branch from 8e00a95 to 70789f0 Compare June 16, 2020 13:43

ellatrix requested review from ajitbohra, nerrad, ntwb and talldan as code owners June 16, 2020 13:43

ellatrix commented Jun 16, 2020

View reviewed changes

oxyc mentioned this pull request Jun 16, 2020

Try: Remove canvas padding. #22213

Merged

ellatrix merged commit 140a5e9 into master Jun 16, 2020

ellatrix deleted the fix/rich-text-rtl-e2e-test branch June 16, 2020 17:34

github-actions bot added this to the Gutenberg 8.4 milestone Jun 16, 2020

This was referenced Jun 24, 2020

Release/8.4 #23410

Closed

Bump plugin version to 8.4.0-rc.2 #23412

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

RichText: attempt to fix RTL e2e test #23203

RichText: attempt to fix RTL e2e test #23203

ellatrix commented Jun 16, 2020

github-actions bot commented Jun 16, 2020 •

edited

Loading

ellatrix Jun 16, 2020

ellatrix Jun 16, 2020

ellatrix commented Jun 16, 2020

ellatrix commented Jun 16, 2020

ItsJonQ commented Jun 16, 2020

	it( 'should handle Home and End keys', async () => {
	await page.keyboard.press( 'Enter' );

	// Wait for rich text editor to load.
	await page.waitForSelector( '.block-editor-rich-text__editable' );

	await pressKeyWithModifier( 'primary', 'b' );

RichText: attempt to fix RTL e2e test #23203

RichText: attempt to fix RTL e2e test #23203

Conversation

ellatrix commented Jun 16, 2020

Description

How has this been tested?

Screenshots

Types of changes

Checklist:

github-actions bot commented Jun 16, 2020 • edited Loading

ellatrix Jun 16, 2020

Choose a reason for hiding this comment

ellatrix Jun 16, 2020

Choose a reason for hiding this comment

ellatrix commented Jun 16, 2020

ellatrix commented Jun 16, 2020

ItsJonQ commented Jun 16, 2020

github-actions bot commented Jun 16, 2020 •

edited

Loading