Translated Image in WYSIWYG Should Automatically Update for Translated Pages

[laurelthrash]

Issue Description

It is desired that when you translate a content type in Drupal, that any images embedded on that content type using the WYSIWYG would automatically pull the translation for that image (including when the Spanish image file is different than the English image file). This issue was discovered during Drupal training on 03/31/23.

Of note, it is outlined in our Wiki (https://github.com/NCIOCPL/cgov-digital-platform/wiki/Common-Fields-WYSIWYG#notes-for-translations) that what is occurring now is expected behavior. This change request is to modify the behavior so that Drupal automatically pulls the Spanish version. Items for consideration:

1. How does this impact videos, infographics, content blocks, image carousels, and video carousels?
2. Does this impact any other components not considered above for which we need to address?

ESTIMATE TBD

What's the expected change?

• When an image that has a translation is embedded on a page using the WYSIWYG, the embedded image should automatically update to reflect the Spanish version when the page is translated.

What's the current functionality?

• When an image that has a translation is embedded on a page using the WYSIWYG, the embedded must manually be updated to reflect the Spanish version when the page is translated.
• NOTE: Presently, the WYSIWYG image sometimes works as expected, while other times it does not. We have not yet determined a correlation between when the WYSIWYG works correctly and when it does not.
• NOTE: The Lead and Promotional Images work as expected, automatically displaying the Spanish translation of the image.

Steps to reproduce desired functionality

1. Add English image to the media library
   • Add caption
2. Translate image you created
   • Verify: All English fields copy over
   • Replace caption with new text
   • Replace image file with new image file
3. Add English image to an English Article that does not have a Spanish translation, or create an Article from scratch
   • Embed via the WYSIWYG
   • Set as lead image
4. Publish English Article
5. Translate Article to Spanish
   • Change fields to indicate it is the Spanish translation
6. Publish Spanish page
7. Verify WYSIWYG image and lead image reflect Spanish translation of the original image*
   • Caption should reflect Spanish caption
   • Image should reflect Spanish image

• In the present functionality, the image embedded using the WYSIWYG must be manually updated to reflect the Spanish translation. Meanwhile, the lead image updates automatically to pull the translated image.

What's the updated acceptance criteria?

Additional details / screenshot

• N/A

[navsunka]

• If we click on source in the WYSIWYG editor, we see the attribute data-langcode="en" is coming same in both node versions.
• If we manually change en to es, translated image is coming in the Spanish version as expected.
• Applied patch (https://www.drupal.org/project/entity_embed/issues/3116547) for the Entity Embed module.
• It is rendering translated image in the Spanish version of the node in the FE but when i Edit the node, i still see the english image.

[laurelthrash]

@sarinapadilla @andyvanavery - we will need to define the behavior in the WYSIWYG for all media types (not just images) and will want to pull in @lburack once ACs are created to review/verify. Cc: @kate-mashkina @santwuma

[alinai]

@KateMashkinaNIH , @laurelthrash , @santwuma , @navsunka , The English image is appearing in the WYSIWYG of Spanish translation. The caption also does not get Spanish translation text in the WYSIWYG. Currently, Image credit is the only item that is getting translated in the WYSIWYG of Spanish translation on ODE 545. https://ncigovcdode545.prod.acquia-sites.com/espanol/about-cancer/coping/feelings/test-and-test-article-trans-image

The lead image gets the Spanish image and Spanish Caption and Spanish credit as expected.

The following scenario is failing for WYSIWYG in the Spanish translation:

[santwuma]

Seems fixed from Claro update - no longer an issue. @laurelthrash and @lburack and Lindsay to validate before closing ticket.

[andyvanavery31]

@laurelthrash and @lburack could you please review if this ticket can be closed?

[laurelthrash]

@andyvanavery31 I tested the above on ACSF-dev using the "Steps to reproduce desired functionality" in the description and do not believe this issue is resolved. Cc: @lburack

Steps At step 5, when I translate the Article to Spanish, the image that appears in the WYSIWYG still reflects the English image. However, the word "Caption" is translated to "Fuente." See screenshot:

The lead image automatically pulls the Spanish/translated image information, as desired. See screenshot:

The page results in the following, for both the preview and after the page is published. See screenshot: