Skip to content

Commit 2f899c6

Browse files
cbravobernalcbravobernal
authored
Tests: Add block e2e experiment. (#133)
* Add block e2e experiment * Add some delay
1 parent be909ac commit 2f899c6

File tree

4 files changed

+214
-0
lines changed

4 files changed

+214
-0
lines changed

‎tests/e2e/field-type-text-with-scf-block.spec.ts‎

Lines changed: 165 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,165 @@
1+
/**
2+
* WordPress dependencies
3+
*/
4+
const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
5+
6+
const PLUGIN_SLUG = 'secure-custom-fields';
7+
const TEST_PLUGIN_SLUG = 'scf-test-plugin-get-field-movie-title-block';
8+
const FIELD_GROUP_LABEL = 'Movie Details';
9+
const FIELD_LABEL = 'Movie Title';
10+
11+
test.describe( 'Field Type > Text', () => {
12+
test.beforeAll( async ( { requestUtils } ) => {
13+
await requestUtils.activatePlugin( PLUGIN_SLUG );
14+
await requestUtils.activatePlugin( TEST_PLUGIN_SLUG );
15+
} );
16+
17+
test.afterAll( async ( { requestUtils } ) => {
18+
await requestUtils.deactivatePlugin( PLUGIN_SLUG );
19+
await requestUtils.deactivatePlugin( TEST_PLUGIN_SLUG );
20+
await requestUtils.deleteAllPosts();
21+
} );
22+
23+
test.beforeEach( async ( { page, admin } ) => {
24+
await deleteFieldGroups( page, admin );
25+
} );
26+
27+
test( 'should create a text field for movies, add content to it, and verify it displays on the frontend as a block', async ( {
28+
page,
29+
admin,
30+
editor,
31+
requestUtils,
32+
} ) => {
33+
// Navigate to Field Groups and create new.
34+
await admin.visitAdminPage( 'edit.php', 'post_type=acf-field-group' );
35+
const addNewButton = page.locator( 'a.acf-btn:has-text("Add New")' );
36+
await addNewButton.click();
37+
38+
// Fill field group title.
39+
await page.waitForSelector( '#title' );
40+
await page.fill( '#title', FIELD_GROUP_LABEL );
41+
42+
// Add text field.
43+
const fieldLabel = page.locator(
44+
'input[id^="acf_fields-field_"][id$="-label"]'
45+
);
46+
await fieldLabel.fill( FIELD_LABEL );
47+
// The field name is generated automatically.
48+
49+
// Select field type as text (it's default, but let's be explicit).
50+
const fieldType = page.locator(
51+
'select[id^="acf_fields-field_"][id$="-type"]'
52+
);
53+
await fieldType.selectOption( 'text' );
54+
55+
// Set block in location rules.
56+
await page.selectOption(
57+
'select[id^="acf_field_group-location-group_0-rule_0-param"]',
58+
'block'
59+
);
60+
await page.selectOption(
61+
'select[id^="acf_field_group-location-group_0-rule_0-operator"]',
62+
'=='
63+
);
64+
await page.selectOption(
65+
'select[id^="acf_field_group-location-group_0-rule_0-value"]',
66+
'scf/movie-title-block'
67+
);
68+
69+
// Submit form.
70+
const publishButton = page.locator(
71+
'button.acf-btn.acf-publish[type="submit"]'
72+
);
73+
await publishButton.click();
74+
75+
// Verify success message.
76+
const successNotice = page.locator( '.updated.notice' );
77+
await expect( successNotice ).toBeVisible();
78+
await expect( successNotice ).toContainText( 'Field group published' );
79+
80+
// Verify field group appears in the list.
81+
await admin.visitAdminPage( 'edit.php', 'post_type=acf-field-group' );
82+
const fieldGroupRow = page.locator(
83+
`tr:has-text("${ FIELD_GROUP_LABEL }")`
84+
);
85+
await expect( fieldGroupRow ).toBeVisible();
86+
87+
const post = await requestUtils.createPost( {
88+
title: 'Movie 1',
89+
status: 'publish',
90+
showWelcomeGuide: false,
91+
} );
92+
93+
await admin.editPost( post.id );
94+
95+
await editor.insertBlock( {
96+
name: 'scf/movie-title-block',
97+
} );
98+
99+
await page.waitForSelector(
100+
'.acf-field[data-name="movie_title"] input'
101+
);
102+
await page.fill(
103+
'.acf-field[data-name="movie_title"] input',
104+
'Awesome movie'
105+
);
106+
// Add a blur event to trigger the field's onchange handlers.
107+
await page.click('body', { position: { x: 0, y: 0 } });
108+
109+
// Let's also make sure we give the editor a moment to save the field data.
110+
await page.waitForTimeout(200);
111+
112+
const previewPage = await editor.openPreviewPage();
113+
114+
// Verify the custom field value appears in the preview.
115+
await previewPage.waitForSelector( '#scf-test-block-movie-title' );
116+
await expect(
117+
previewPage.locator( '#scf-test-block-movie-title' )
118+
).toContainText( 'Movie title: Awesome movie' );
119+
} );
120+
} );
121+
122+
/**
123+
* Helper function to delete the field group
124+
*/
125+
async function deleteFieldGroups( page, admin ) {
126+
await admin.visitAdminPage( 'edit.php', 'post_type=acf-field-group' );
127+
128+
// Find and select the field group row
129+
const allFieldGroupsCheckbox = page.locator( 'input#cb-select-all-1' );
130+
131+
if ( await allFieldGroupsCheckbox.isVisible() ) {
132+
await allFieldGroupsCheckbox.check();
133+
// Use bulk actions to trash the field group.
134+
await page.selectOption( '#bulk-action-selector-bottom', 'trash' );
135+
await page.click( '#doaction2' );
136+
137+
// Verify deletion success message.
138+
const deleteMessage = page.locator( '.updated.notice' );
139+
await expect( deleteMessage ).toBeVisible( { timeout: 5000 } );
140+
await expect( deleteMessage ).toContainText( 'moved to the Trash' );
141+
142+
await emptyTrash( page, admin );
143+
}
144+
}
145+
146+
147+
/**
148+
* Helper function to empty trash
149+
*/
150+
async function emptyTrash( page, admin ) {
151+
await admin.visitAdminPage(
152+
'edit.php',
153+
'post_status=trash&post_type=acf-field-group'
154+
);
155+
const emptyTrashButton = page.locator(
156+
'.tablenav.bottom input[name="delete_all"][value="Empty Trash"]'
157+
);
158+
await emptyTrashButton.waitFor( { state: 'visible' } );
159+
await emptyTrashButton.click();
160+
161+
// Verify success notice.
162+
const successNotice = page.locator( '.notice.updated p' );
163+
await expect( successNotice ).toBeVisible();
164+
await expect( successNotice ).toHaveText( /permanently deleted/ );
165+
}

‎tests/e2e/plugins/blocks/scf-movie-title-block/block.json‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"name": "scf/movie-title-block",
3+
"title": "My Test Plugin Movie Title Block",
4+
"description": "A custom block that uses SCF fields.",
5+
"category": "layout",
6+
"icon": "admin-comments",
7+
"keywords": [ "custom", "scf", "block" ],
8+
"acf": {
9+
"mode": "edit",
10+
"renderTemplate": "template.php"
11+
},
12+
"supports": {
13+
"align": true
14+
},
15+
"textdomain": "secure-custom-fields"
16+
}

‎tests/e2e/plugins/blocks/scf-movie-title-block/template.php‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<?php
2+
/**
3+
* Template for the SCF Movie Title Block.
4+
*
5+
* @package scf-test-plugins
6+
*/
7+
8+
// Exit if accessed directly.
9+
if ( ! defined( 'ABSPATH' ) ) {
10+
exit;
11+
}
12+
$movie_title = get_field( 'movie_title' );
13+
14+
?>
15+
<p id="scf-test-block-movie-title">Movie title: <?php echo esc_html( $movie_title ); ?></p>

‎tests/e2e/plugins/scf-test-get-field-scf-block.php‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<?php
2+
/**
3+
* Plugin Name: SCF Test Plugin, Get Field Movie Title Block
4+
* Plugin URI: https://github.com/WordPress/secure-custom-fields
5+
* Author: SCF Team
6+
*
7+
* @package scf-test-plugins
8+
*/
9+
10+
/**
11+
* Registers a custom block type for testing.
12+
*
13+
* @return void
14+
*/
15+
function scf_test_register_acf_blocks() {
16+
register_block_type( __DIR__ . '/blocks/scf-movie-title-block' );
17+
}
18+
add_action( 'init', 'scf_test_register_acf_blocks' );

0 commit comments

Comments
 (0)