Fix: Image Block: Alt and caption written during image upload are discarded #24471
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This issue was already fixed in the past at #16051.
But meanwhile, the component was refactored from a class component to a functional hook based component. The refactoring made the logic not to work as expected.
A function onSelectImage is passed as a callback to the media upload function before the user writes any. If after uploading an image but before the process is completed the user writes a caption and an alt tag the attributes get the new values, but the function still references the empty fields (because when the function was passed to media upload they were empty). This PR solves the issue by using references and hooks to update the references.
Description
I added an image block.
On chrome dev tools I created a network profile with 5 seconds latency and enabled it.
I uploaded an image to the image block.
While the image was uploading (takes 5seconds) I wrote a caption and an alt.
I verified after the upload is complete the attributes I wrote are kept (on master they are ignored).