atom_reference_field_widget_form_process() assigns the atom dropzone markup to the #field_prefix, wrapped inside a div.
theme_form_element() uses spans to wrap field prefix and suffix.

The result is a div nested inside a span, which is invalid.

CommentFileSizeAuthor
#6 invalid_markup_atom_reference-2708991_2.patch8.26 KBmario_prkos
#5 invalid_markup_atom_reference-2708991.patch3.42 KBmario_prkos
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

ciss created an issue. See original summary.

ciss’s picture

ciss CreditAttribution: ciss as a volunteer commented
Title: Atom reference widget create invalid markup » Atom reference widget creates invalid markup
nagy.balint’s picture

nagy.balint CreditAttribution: nagy.balint commented

Any suggestion on what could be the solution here?

nagy.balint’s picture

nagy.balint CreditAttribution: nagy.balint commented

I guess we would either need to add our classes to the field prefix, or we have to use a phrasing tag instead of the div outlined here: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categori...

mario_prkos’s picture

mario_prkos CreditAttribution: mario_prkos at Agence Inovae commented
FileSize
invalid_markup_atom_reference-2708991.patch3.42 KB

The proposed solution in this patch changes the default theme wrapper function with one custom made in atom reference module. The newly theme wrapper function changes the span element with div which at the end it fixes the markup.

The new created theme function is almost the same as default one except this small change already point out. As the result there will be minimal changes in mark up.

mario_prkos’s picture

mario_prkos CreditAttribution: mario_prkos at Agence Inovae commented
FileSize
invalid_markup_atom_reference-2708991_2.patch8.26 KB

There is possible another solution for this problem. Instead of using the theme function and process function we can add just another element in field that will be contain the place for the atom drop zone. In this approach only widget form functions is modified and javascript that handles the drop zone.