Fix: wrong markup when columns input is empty #12954
Conversation
b2c72fd
to
4c76740
Compare
4c76740
to
2ffd523
Compare
| @@ -155,7 +164,7 @@ export const settings = { | |||
| ], | |||
|
|
|||
| edit( { attributes, setAttributes, className } ) { | |||
| const { columns } = attributes; | |||
| const columns = attributes.columns || DEFAULT_NUMBER_OF_COLUMNS; | |||
There was a problem hiding this comment.
Begs the question: Should a block developer ever need to anticipate an attribute value being undefined when its definition includes a default ? Is this something which ought to be handled when setting attributes? Probably a decent amount of overhead included in doing so. Alternatively it could be block specific in only letting the RangeControl's onChange trigger when a valid nextColumns, or provide the defaulting there, or RangeControl provides a fallback value when its input is invalid.
Thoughts?
There was a problem hiding this comment.
Hi @aduth, you are comments are right, given that a block has a default we should not need to anticipate an undefined value.
But setting changing the attribute to the default when an undefined value exists causes some problems. E.g: a user has 3 columns wants to set to two 4 columns, deletes the 3 and in the UI automatically sees a 2 instead of an empty field to write the 3.
This problem is resolved with a PR I created that fixes some behaviors in the RangeControl #12952.
If these changes are merged after the other PR everything will work smoothly.
2ffd523
to
2bd6c95
Compare
2bd6c95
to
c359733
Compare
|
In my tests after the merge of #12952 given the logical changes that happened there, the problem is fixed so I'm closing this PR. |
Description
Depends: #12952
When the columns input field was empty previously we generated invalid markup with
has-undefined-columnsclass. The block also started showing empty in the editor.With this change when the input field is empty the default value for the columns attribute is used and it looks the same as if the user used two columns.
How has this been tested?
Add a columns block.
Write some content.
Make the columns input field empty, and verify no invalid markup is produce and a value of two is used. (previous the block got broken in the editor and invalid markup was produced).