Skip to content

Commit b0d9f6c

Browse files
committed
Forms: E2E test updates for sentence casing Forms UI
PR's with upstream changes: - Sentence case field names Automattic/jetpack#43818 - Sentence case all UI components Automattic/jetpack#43847
1 parent 87d798c commit b0d9f6c

File tree

3 files changed

+39
-39
lines changed

3 files changed

+39
-39
lines changed

packages/calypso-e2e/src/lib/blocks/block-flows/all-form-fields.ts

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export class AllFormFieldsFlow implements BlockFlow {
2626
}
2727

2828
// You add an individual input field...
29-
blockSidebarName = 'Text Input Field';
29+
blockSidebarName = 'Text input field';
3030
// ... but a full Form block is added and marked as selected in the editor!
3131
blockEditorSelector = makeSelectorFromBlockName( 'Form' );
3232

@@ -38,31 +38,31 @@ export class AllFormFieldsFlow implements BlockFlow {
3838
async configure( context: EditorContext ): Promise< void > {
3939
// Determine if we are working with the refactored form fields (released June 2025)
4040
const editorCanvas = await context.editorPage.getEditorCanvas();
41-
const initailBlock = editorCanvas.locator( makeSelectorFromBlockName( 'Text Input Field' ) );
41+
const initailBlock = editorCanvas.locator( makeSelectorFromBlockName( 'Text input field' ) );
4242
const inputChild = initailBlock.locator( '[aria-label="Block: Input"]' );
4343
const isRefactor = ( await inputChild.count() ) > 0;
4444

4545
// Text Input Field is already added by the first step, so let's start by labeling it.
4646
await labelFormFieldBlock( context.addedBlockLocator, {
47-
blockName: 'Text Input Field',
47+
blockName: 'Text input field',
4848
accessibleLabelName: 'Add label…',
49-
labelText: this.addLabelPrefix( 'Text Input Field' ),
49+
labelText: this.addLabelPrefix( 'Text input field' ),
5050
} );
51-
let lastBlockName = 'Text Input Field';
51+
let lastBlockName = 'Text input field';
5252

5353
// Add remaining field blocks, labeling as we go.
5454
const remainingBlocksToAdd = [
55-
[ 'Name Field', 'Add label…' ],
56-
[ 'Email Field', 'Add label…' ],
57-
[ 'Website Field', 'Add label…' ],
58-
[ 'Date Picker', 'Add label…' ],
59-
[ 'Phone Number Field', 'Add label…' ],
60-
[ 'Multi-line Text Field', 'Add label…' ],
55+
[ 'Name field', 'Add label…' ],
56+
[ 'Email field', 'Add label…' ],
57+
[ 'Website field', 'Add label…' ],
58+
[ 'Date picker', 'Add label…' ],
59+
[ 'Phone number field', 'Add label…' ],
60+
[ 'Multi-line text field', 'Add label…' ],
6161
[ 'Checkbox', 'Add label…' ],
62-
[ 'Multiple Choice (Checkbox)', 'Add label' ],
63-
[ 'Single Choice (Radio)', 'Add label' ],
64-
[ 'Dropdown Field', 'Add label' ],
65-
[ 'Terms Consent', 'Add implicit consent message…' ],
62+
[ 'Multiple choice (checkbox)', 'Add label' ],
63+
[ 'Single choice (radio)', 'Add label' ],
64+
[ 'Dropdown field', 'Add label' ],
65+
[ 'Terms consent', 'Add implicit consent message…' ],
6666
];
6767
for ( const [ blockName, accessibleLabelName ] of remainingBlocksToAdd ) {
6868
await this.addFieldBlockToForm( context, blockName, lastBlockName, isRefactor );
@@ -79,8 +79,8 @@ export class AllFormFieldsFlow implements BlockFlow {
7979
const otherBlocksToLabel = isRefactor
8080
? [
8181
[ 'Button', 'Add text…' ],
82-
[ 'Option', 'Add option…', 'Single Choice (Radio)' ],
83-
[ 'Option', 'Add option…', 'Multiple Choice (Checkbox)' ],
82+
[ 'Option', 'Add option…', 'Single choice (radio)' ],
83+
[ 'Option', 'Add option…', 'Multiple choice (checkbox)' ],
8484
]
8585
: [
8686
[ 'Button', 'Add text…' ],
@@ -106,28 +106,28 @@ export class AllFormFieldsFlow implements BlockFlow {
106106
*/
107107
async validateAfterPublish( context: PublishedPostContext ): Promise< void > {
108108
const isRefactor = ( await context.page.locator( '.wp-block-jetpack-input' ).count() ) > 0;
109-
const radioName = isRefactor ? 'Option' : 'Single Choice Option';
110-
const checkboxName = isRefactor ? 'Option' : 'Multiple Choice Option';
109+
const radioName = isRefactor ? 'Option' : 'Single choice option';
110+
const checkboxName = isRefactor ? 'Option' : 'Multiple choice option';
111111

112112
await validatePublishedFormFields( context.page, [
113-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Text Input Field' ) },
114-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name Field' ) },
115-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email Field' ) },
116-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Website Field' ) },
117-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Phone Number Field' ) },
118-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Multi-line Text Field' ) },
113+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Text input field' ) },
114+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name field' ) },
115+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email field' ) },
116+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Website field' ) },
117+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Phone number field' ) },
118+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Multi-line text field' ) },
119119
{ type: 'checkbox', accessibleName: this.addLabelPrefix( 'Checkbox' ) },
120120
{ type: 'radio', accessibleName: this.addLabelPrefix( radioName ) },
121121
{ type: 'checkbox', accessibleName: this.addLabelPrefix( checkboxName ) },
122122
{ type: 'button', accessibleName: this.addLabelPrefix( 'Button' ) },
123123
// Currently broken, sadly! See: https://github.com/Automattic/jetpack/issues/30762
124-
// { type: 'combobox', accessibleName: this.addLabelPrefix( 'Dropdown Field' ) },
124+
// { type: 'combobox', accessibleName: this.addLabelPrefix( 'Dropdown field' ) },
125125
] );
126126

127127
// The terms consent is kind of weird because it's applied to a hidden checkbox, so we validate that here.
128128
await context.page
129129
.getByRole( 'checkbox', {
130-
name: this.addLabelPrefix( 'Terms Consent' ),
130+
name: this.addLabelPrefix( 'Terms consent' ),
131131
includeHidden: true,
132132
} )
133133
.first()

packages/calypso-e2e/src/lib/blocks/block-flows/contact-form.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,14 @@ export class ContactFormFlow implements BlockFlow {
3636
// Name and Email are common fields shared amongst all Form patterns.
3737
// So let's make them unique here!
3838
await labelFormFieldBlock( context.addedBlockLocator, {
39-
blockName: 'Name Field',
39+
blockName: 'Name field',
4040
accessibleLabelName: 'Add label…',
41-
labelText: this.addLabelPrefix( 'Name Field' ),
41+
labelText: this.addLabelPrefix( 'Name field' ),
4242
} );
4343
await labelFormFieldBlock( context.addedBlockLocator, {
44-
blockName: 'Email Field',
44+
blockName: 'Email field',
4545
accessibleLabelName: 'Add label…',
46-
labelText: this.addLabelPrefix( 'Email Field' ),
46+
labelText: this.addLabelPrefix( 'Email field' ),
4747
} );
4848
}
4949

@@ -64,8 +64,8 @@ export class ContactFormFlow implements BlockFlow {
6464
*/
6565
async validateAfterPublish( context: PublishedPostContext ): Promise< void > {
6666
await validatePublishedFormFields( context.page, [
67-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name Field' ) },
68-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email Field' ) },
67+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name field' ) },
68+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email field' ) },
6969
// This is the default label pulled in by the Contact Form pattern.
7070
// It's unique-ish and a good validation of that pattern, so we've left it alone.
7171
{ type: 'textbox', accessibleName: 'Message' },

packages/calypso-e2e/src/lib/blocks/block-flows/form-patterns.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,14 +58,14 @@ export class FormPatternsFlow implements BlockFlow {
5858
// Name and Email are common fields shared amongst all Form patterns.
5959
// So let's make them unique here!
6060
await labelFormFieldBlock( newParentBlockLocator, {
61-
blockName: 'Name Field',
61+
blockName: 'Name field',
6262
accessibleLabelName: 'Add label…',
63-
labelText: this.addLabelPrefix( 'Name Field' ),
63+
labelText: this.addLabelPrefix( 'Name field' ),
6464
} );
6565
await labelFormFieldBlock( newParentBlockLocator, {
66-
blockName: 'Email Field',
66+
blockName: 'Email field',
6767
accessibleLabelName: 'Add label…',
68-
labelText: this.addLabelPrefix( 'Email Field' ),
68+
labelText: this.addLabelPrefix( 'Email field' ),
6969
} );
7070
}
7171

@@ -111,8 +111,8 @@ export class FormPatternsFlow implements BlockFlow {
111111
*/
112112
async validateAfterPublish( context: PublishedPostContext ): Promise< void > {
113113
await validatePublishedFormFields( context.page, [
114-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name Field' ) },
115-
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email Field' ) },
114+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Name field' ) },
115+
{ type: 'textbox', accessibleName: this.addLabelPrefix( 'Email field' ) },
116116
...this.validationData.otherExpectedFields,
117117
] );
118118
}

0 commit comments

Comments
 (0)