Gutenberg-mobile: Post is not updated properly if media upload is completed when the editor is closed

[pinarol]

There are several cases going wrong about this issue and they seem all related with the mediaId replacement mechanism implemented on both iOS and Android.

Android part is here inside src/main/java/org/wordpress/android/ui/posts/PostUtils.java

    public static String replaceMediaFileWithUrlInGutenbergPost(@NonNull String postContent,
                                                 String localMediaId, MediaFile mediaFile) {                                                         String localMediaId, MediaFile mediaFile) {

iOS part is inside GutenbergImgUploadProcessor.swift and GutenbergVideoUploadProcessor.swift

Both implementations are kinda working by coincidence because they are assuming that mediaId is always the fist attribute in block's html. But this can go wrong in so many ways.

Some problematic scenarios:

1. Video upload ( only happening on Android )

• Add video block
• Start a video upload
• Leave the post
• Reopen the post when upload is done
• Result: Video block appears empty:

And the id is still showing the upload id, it should have been equal to remote id:

1. Update media & text alignment during upload and leave the post

This is actually not limited to media & text, this will happen everytime we update the block attributes.

• Add media-text
• Start an image upload

• Change media-text order using the toolbar button:
  

• Leave the post before upload finishes

• Wait until upload is finished
• Reopen the post
• Result: mediaId is wrong and it is still showing the upload id, this is also cauising a red screen on iOS since mediaId is making the block invalid.

Because in this scenario the html of the block looks like this:

<!-- wp:media-text {"mediaPosition":"right","mediaId":-23422105,"mediaType":"image"} -->
....

To Sum Up

We shouldn't trust that mediaId will be the first one in the attribute list and try to replace the id based on that. We need to find a better way to replace download ids with remote ids when the upload is over. We might want to use a kind of html parser. On iOS we can try using HTMLProcessor from Aztec. Not sure if same thing exists on Android.

• On Android the Video case is never handled, that should be fixed as well.

[SergioEstevao]

While this is fixed in iOS now, it needs to be sorted in Android. @marecar3 or @maxme want to give it a go?

[marecar3]

Hey @SergioEstevao I can take a look on this one :)

[SergioEstevao]

@marecar3 on iOS we used HTML/Block text processors classes that are build on top of regex.

More information about those can be seen in this PR: wordpress-mobile/WordPress-iOS#12925

[marecar3]

Thanks, @SergioEstevao, will look at it.

[marecar3]

I can confirm that Android issues are resolved with this PR: https://github.com/wordpress-mobile/WordPress-Android/pull/10999