-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update cover block min height control to use HeightControl #62509
base: trunk
Are you sure you want to change the base?
Changes from 12 commits
3954943
d00d1d8
52ab3ac
1bf31f6
d72ad60
98a6b58
8dbcb5e
454f736
4549f74
f641ce9
5aa8d5c
7586f2f
1eba102
20112ff
4044d67
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
|
@@ -371,13 +371,12 @@ describe( 'Cover block', () => { | |||||||||||
name: 'Styles', | ||||||||||||
} ) | ||||||||||||
); | ||||||||||||
await userEvent.clear( | ||||||||||||
screen.getByLabelText( 'Minimum height of cover' ) | ||||||||||||
); | ||||||||||||
await userEvent.type( | ||||||||||||
screen.getByLabelText( 'Minimum height of cover' ), | ||||||||||||
'300' | ||||||||||||
); | ||||||||||||
|
||||||||||||
const [ heightControl ] = | ||||||||||||
screen.getAllByLabelText( /Minimum height/ ); | ||||||||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
It is better to use accessible selectors. |
||||||||||||
|
||||||||||||
await userEvent.clear( heightControl ); | ||||||||||||
await userEvent.type( heightControl, '300' ); | ||||||||||||
|
||||||||||||
expect( screen.getByLabelText( 'Block: Cover' ) ).toHaveStyle( | ||||||||||||
'min-height: 300px;' | ||||||||||||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -156,11 +156,11 @@ test.describe( 'Cover', () => { | |
.getByRole( 'tab', { name: 'Styles' } ) | ||
.click(); | ||
|
||
// Ensure there the default value for the minimum height of cover is undefined. | ||
// Ensure there the default value for the Minimum height is undefined. | ||
const defaultHeightValue = await coverBlockEditorSettings | ||
.getByLabel( 'Minimum height of cover' ) | ||
.getByRole( 'slider', { name: 'Minimum height' } ) | ||
.inputValue(); | ||
expect( defaultHeightValue ).toBeFalsy(); | ||
expect( defaultHeightValue ).toEqual( '0' ); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This test is trying to verify that the minimum height is "undefined", but it changes the expected result. I think the actual value being checked is a field for entering a number, not a slider. Can't the following code achieve the same thing without changing the expected result? const defaultHeightValue = await coverBlockEditorSettings
.getByRole( 'spinbutton', { name: 'Minimum height' } )
.inputValue();
expect( defaultHeightValue ).toBeFalsy(); |
||
|
||
// There is no accessible locator for the draggable block resize edge, | ||
// which is he bottom edge of the Cover block. | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'd like to avoid disabling ESLint errors if possible. Can I use logic like the following to deal with this?
This is similar to this part.