The bug
When you have multiple variation you can switch between them and AJAX will update the variation fields to reflect the values present in that variation. If there is a field that has no value for a variation then a container is created as a placeholder so AJAX has a target element to replace when the variation is changed.
This container is a DIV element, which has an implicit line break.
If some of your variation fields are intended to be displayed in an inline row of elements this breaks it by causing a line break anywhere there is no value for a field. Think like a set of badges or icons on a product to denote various characteristics of the product without taking up a bunch of space.
The solution
The code should use a SPAN to create a placeholder for ajax replacement of fields. SPAN elements are intended for this use case and will have no impact on layout or page semantics.
Issue fork commerce-3447691
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #3
rhovlandMerge request added. Change is very simple.
Since it appears container elements with no content are 0 height divs this should not affect anyone's layout that was relying on line spacing of empty divs.
Comment #4
rhovlandTests are now passing
Comment #5
jsacksick commentedThe change is simple and looks straighforward, however the last time this code was touched, regressions were introduced (See #3120117: ProductVariationFieldRenderer's AJAXifiying breaks lazy_built fields (such as flags)), so a bit concerned that this change might introduce regressions somehow.
Comment #7
jsacksick commentedWent ahead and merged this... Let's see if anything breaks...