Fix gitlab_ui_checkbox_component when { multiple: true }
What does this MR do and why?
This fix is needed for !80131 (merged) as part of gitlab-org/growth/team-tasks#461 (closed)
When { multiple: true } option is passed to check_box it suffixes the input's id attribute value with checked_value. For example:
-# checked_value = "dog"
= f.check_box(:pets, { multiple: true}, 'dog')
=> <input type="checkbox" id="user_pets_dog" name="user[pets][]" value="dog" />
Previous implementation does not pass in a value parameter to
generic_label so the resulting <label /> has the incorrect for attribute
value. This makes the resulting checkboxes un-checkable since the labels are not properly matched with the right inputs.
= f.gitlab_ui_checkbox_component(:pets, 'Dog', checked_value: 'dog', checkbox_options: { multiple: true})
=> -# input's id and label's for do not match
<input type="checkbox" id="user_pets_dog" name="user[pets][]" value="dog" />
<label for="user_pets">Dog</label>
This MR updates gitlab_ui_checkbox_component such that when { multiple: true } is passed in as one of checkbox_options we pass in checked_value as value param to generic_label to create <label />s with correct for attribute values.
Screenshots or screen recordings
| before | after |
|---|---|
| Screen_Recording_2022-02-09_at_10.16.34_AM | Screen_Recording_2022-02-09_at_10.14.36_AM |
How to set up and validate locally
Numbered steps to set up and validate the change are strongly suggested.
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.