Skip to content

Commit 1a6d79c

Browse files
pavanpatil1pavanpatil1
authored
Migrate rtl test case to it's playwright version (#41495)
* Migrate rtl test case * Fix conflicts * Addressed review feedbacks * Addressed review feedback * Addressed remaining feedbacks * Addressed review feedback * Solved styleint issue * Addressed review feedbacks * Remove unused code * Fix styleint issue * Fixed CI issue Co-authored-by: pavanpatil1 <=>
1 parent f6f0cea commit 1a6d79c

6 files changed

+89
-100
lines changed

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

-63
This file was deleted.

‎test/e2e/specs/editor/various/__snapshots__/RTL-should-navigate-inline-boundaries-1-chromium.txt

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<!-- wp:paragraph -->
2+
<p><strong>١</strong>٠٢</p>
3+
<!-- /wp:paragraph -->

‎test/e2e/specs/editor/various/__snapshots__/RTL-should-navigate-inline-boundaries-2-chromium.txt

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<!-- wp:paragraph -->
2+
<p><strong>١٠</strong>٢</p>
3+
<!-- /wp:paragraph -->

‎test/e2e/specs/editor/various/__snapshots__/RTL-should-navigate-inline-boundaries-3-chromium.txt

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<!-- wp:paragraph -->
2+
<p><strong>٠١</strong>٢</p>
3+
<!-- /wp:paragraph -->

‎test/e2e/specs/editor/various/__snapshots__/RTL-should-navigate-inline-boundaries-4-chromium.txt

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<!-- wp:paragraph -->
2+
<p>٠<strong>١</strong>٢</p>
3+
<!-- /wp:paragraph -->

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

+77-37
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,31 @@
11
/**
22
* WordPress dependencies
33
*/
4-
import {
5-
createNewPost,
6-
getEditedPostContent,
7-
pressKeyWithModifier,
8-
activatePlugin,
9-
deactivatePlugin,
10-
} from '@wordpress/e2e-test-utils';
4+
const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
115

126
// Avoid using three, as it looks too much like two with some fonts.
137
const ARABIC_ZERO = '٠';
148
const ARABIC_ONE = '١';
159
const ARABIC_TWO = '٢';
1610

17-
describe( 'RTL', () => {
18-
beforeAll( async () => {
19-
await activatePlugin( 'gutenberg-test-plugin-activate-rtl' );
11+
test.describe( 'RTL', () => {
12+
test.beforeAll( async ( { requestUtils } ) => {
13+
await requestUtils.activatePlugin(
14+
'gutenberg-test-plugin-activate-rtl'
15+
);
2016
} );
2117

22-
beforeEach( async () => {
23-
await createNewPost();
18+
test.beforeEach( async ( { admin } ) => {
19+
await admin.createNewPost();
2420
} );
2521

26-
afterAll( async () => {
27-
await deactivatePlugin( 'gutenberg-test-plugin-activate-rtl' );
22+
test.afterAll( async ( { requestUtils } ) => {
23+
await requestUtils.deactivatePlugin(
24+
'gutenberg-test-plugin-activate-rtl'
25+
);
2826
} );
2927

30-
it( 'should arrow navigate', async () => {
28+
test( 'should arrow navigate', async ( { editor, page } ) => {
3129
await page.keyboard.press( 'Enter' );
3230

3331
// We need at least three characters as arrow navigation *from* the
@@ -41,21 +39,38 @@ describe( 'RTL', () => {
4139

4240
// Expect: ARABIC_ZERO + ARABIC_ONE + ARABIC_TWO (<p>٠١٢</p>).
4341
// N.b.: HTML is LTR, so direction will be reversed!
44-
expect( await getEditedPostContent() ).toMatchSnapshot();
42+
43+
// Check the content.
44+
const content = await editor.getEditedPostContent();
45+
expect( content ).toBe(
46+
`<!-- wp:paragraph -->
47+
<p>٠١٢</p>
48+
<!-- /wp:paragraph -->`
49+
);
4550
} );
4651

47-
it( 'should split', async () => {
52+
test( 'should split', async ( { editor, page } ) => {
4853
await page.keyboard.press( 'Enter' );
4954

5055
await page.keyboard.type( ARABIC_ZERO );
5156
await page.keyboard.type( ARABIC_ONE );
5257
await page.keyboard.press( 'ArrowRight' );
5358
await page.keyboard.press( 'Enter' );
5459

55-
expect( await getEditedPostContent() ).toMatchSnapshot();
60+
// Check the content.
61+
const content = await editor.getEditedPostContent();
62+
expect( content ).toBe(
63+
`<!-- wp:paragraph -->
64+
<p>٠</p>
65+
<!-- /wp:paragraph -->
66+
67+
<!-- wp:paragraph -->
68+
<p>١</p>
69+
<!-- /wp:paragraph -->`
70+
);
5671
} );
5772

58-
it( 'should merge backward', async () => {
73+
test( 'should merge backward', async ( { editor, page } ) => {
5974
await page.keyboard.press( 'Enter' );
6075

6176
await page.keyboard.type( ARABIC_ZERO );
@@ -64,10 +79,16 @@ describe( 'RTL', () => {
6479
await page.keyboard.press( 'ArrowRight' );
6580
await page.keyboard.press( 'Backspace' );
6681

67-
expect( await getEditedPostContent() ).toMatchSnapshot();
82+
// Check the content.
83+
const content = await editor.getEditedPostContent();
84+
expect( content ).toBe(
85+
`<!-- wp:paragraph -->
86+
<p>٠١</p>
87+
<!-- /wp:paragraph -->`
88+
);
6889
} );
6990

70-
it( 'should merge forward', async () => {
91+
test( 'should merge forward', async ( { editor, page } ) => {
7192
await page.keyboard.press( 'Enter' );
7293

7394
await page.keyboard.type( ARABIC_ZERO );
@@ -77,51 +98,70 @@ describe( 'RTL', () => {
7798
await page.keyboard.press( 'ArrowRight' );
7899
await page.keyboard.press( 'Delete' );
79100

80-
expect( await getEditedPostContent() ).toMatchSnapshot();
101+
// Check the content.
102+
const content = await editor.getEditedPostContent();
103+
expect( content ).toBe(
104+
`<!-- wp:paragraph -->
105+
<p>٠١</p>
106+
<!-- /wp:paragraph -->`
107+
);
81108
} );
82109

83-
it( 'should arrow navigate between blocks', async () => {
110+
test( 'should arrow navigate between blocks', async ( {
111+
editor,
112+
page,
113+
} ) => {
84114
await page.keyboard.press( 'Enter' );
85115

86116
await page.keyboard.type( ARABIC_ZERO );
87117
await page.keyboard.press( 'Enter' );
88118
await page.keyboard.type( ARABIC_ONE );
89-
await pressKeyWithModifier( 'shift', 'Enter' );
119+
await page.keyboard.press( 'Shift+Enter' );
90120
await page.keyboard.type( ARABIC_TWO );
91121
await page.keyboard.press( 'ArrowRight' );
92122
await page.keyboard.press( 'ArrowRight' );
93123
await page.keyboard.press( 'ArrowRight' );
94124

95125
// Move to the previous block with two lines in the current block.
96126
await page.keyboard.press( 'ArrowRight' );
97-
await pressKeyWithModifier( 'shift', 'Enter' );
127+
await page.keyboard.press( 'Shift+Enter' );
98128
await page.keyboard.type( ARABIC_ONE );
99129

100130
// Move to the next block with two lines in the current block.
101131
await page.keyboard.press( 'ArrowLeft' );
102132
await page.keyboard.type( ARABIC_ZERO );
103-
await pressKeyWithModifier( 'shift', 'Enter' );
104-
105-
expect( await getEditedPostContent() ).toMatchSnapshot();
133+
await page.keyboard.press( 'Shift+Enter' );
134+
135+
// Check the content.
136+
const content = await editor.getEditedPostContent();
137+
expect( content ).toBe(
138+
`<!-- wp:paragraph -->
139+
<p>٠<br>١</p>
140+
<!-- /wp:paragraph -->
141+
142+
<!-- wp:paragraph -->
143+
<p>٠<br>١<br>٢</p>
144+
<!-- /wp:paragraph -->`
145+
);
106146
} );
107147

108-
it( 'should navigate inline boundaries', async () => {
109-
await page.keyboard.press( 'Enter' );
110-
111-
// Wait for rich text editor to load.
112-
await page.waitForSelector( '.block-editor-rich-text__editable' );
113-
114-
await pressKeyWithModifier( 'primary', 'b' );
148+
test( 'should navigate inline boundaries', async ( {
149+
editor,
150+
page,
151+
pageUtils,
152+
} ) => {
153+
await page.click( 'role=button[name="Add default block"i]' );
154+
await pageUtils.pressKeyWithModifier( 'primary', 'b' );
115155
await page.keyboard.type( ARABIC_ONE );
116-
await pressKeyWithModifier( 'primary', 'b' );
156+
await pageUtils.pressKeyWithModifier( 'primary', 'b' );
117157
await page.keyboard.type( ARABIC_TWO );
118158

119159
// Insert a character at each boundary position.
120160
for ( let i = 4; i > 0; i-- ) {
121161
await page.keyboard.press( 'ArrowRight' );
122162
await page.keyboard.type( ARABIC_ZERO );
123163

124-
expect( await getEditedPostContent() ).toMatchSnapshot();
164+
expect( await editor.getEditedPostContent() ).toMatchSnapshot();
125165

126166
await page.keyboard.press( 'Backspace' );
127167
}

0 commit comments

Comments
 (0)