Hello,

I have a field attached to a node, referencing a simple ajax form. The input become smaller each time the user is trying to upload an image. Attached is a video describing the problem, the exported webform and a screenshot with the markup that got duplicated each time the image was uploaded.

Thank you~

CommentFileSizeAuthor
#6 3260300-6.patch934 bytesjrockowitz
#4 3260300-4.patch847 bytesjrockowitz
webform-upload-image.mkv3.15 MBgge
webform.webform.test_upload_image.yml5.1 KBgge
Screenshot-202201251103-1370x805.png169.14 KBgge
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

gge created an issue. See original summary.

gge’s picture

gge CreditAttribution: gge commented

Forgot to mention that the theme is a bootstrap subtheme and Webform Bootstrap module is enabled.

jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented

This issue is identical to #3178033: Textarea multiple inside flexbox broken where the Ajax callback is re-rendering the flexbox wrapper.

The challenge is we don't have control over the ManagedFile element's ajax callback.

jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Status: Active » Needs review
FileSize
3260300-4.patch847 bytes

Here is a POC solution. This issue is related to the file upload being inside a flexbox element and not the Bootstrap theme.

gge’s picture

gge CreditAttribution: gge commented

Thank you very much! The patch is working great!

jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
FileSize
3260300-6.patch934 bytes

I am worried that this patch is going to cause regressions when another element's ajax callback is triggered.

I am moving this logic to WebformManagedFileBase class so we can better track and limit the scope of the problem and solution.

jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Status: Needs review » Reviewed & tested by the community

  • jrockowitz authored 403e057 on 6.1.x 
    Issue #3260300 by jrockowitz, gge: Upload image html markup duplicated

  • jrockowitz authored 403e057 on 6.x 
    Issue #3260300 by jrockowitz, gge: Upload image html markup duplicated
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Status: Reviewed & tested by the community » Fixed

  • jrockowitz authored 403e057 on 6.2.x 
    Issue #3260300 by jrockowitz, gge: Upload image html markup duplicated
drumm’s picture

drumm
he/him
Location NY, US
CreditAttribution: drumm at Drupal Association commented

(updating to fix issue indexing error, please disregard)

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.