Accessibility: Spacer Block's width attribute accepts and saves negative value

[yogeshbhutkar]

Description

This was first discovered here #68817 (comment).

The following are some inconsistencies observed in the width control:

1. The width control does not enforce a minimum value, allowing users to set it below 0 using keyboard shortcuts (cmd + arrow keys) or scrolling (cmd + mouse wheel). Negative values for width are not meaningful in this context, and the input should be restricted to a minimum value of 0.

2. It is currently possible to enter a negative width value and save it, which is not consistent with expected behavior.

Other controls, such as the font size and height controls, handle negative values more effectively:

• While users can manually input a negative value, these controls automatically reset the value to 0 when saving or when the input loses focus.
• They also prevent users from decreasing the value below 0 via keyboard shortcuts (cmd + arrow keys) or mouse scrolling (cmd + mouse wheel).

I'm not sure if this was raised earlier elsewhere (couldn't find it), if so, please feel free to close this issue.

Step-by-step reproduction instructions

1. Create a row block.
2. Create a spacer block inside it.
3. Observe, the width can go below 0 using cmd + arrow keys or cmd + mouse wheel.
4. Observe, on setting up the width as a negative value, it does not become 0 on either saving or removing the focus from the input.

Screenshots, screen recording, code snippet

Environment info

• WordPress Version: 6.8-alpha-59361
• Gutenberg Version: Trunk (b771bdd)
• OS: macOS Sequoia

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure