Migrated button markup causing rendering problems

Description

I have a somewhat old block buttons/button markup that looks like this:

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"align":"center"} -->
<div class="wp-block-button aligncenter"><a class="wp-block-button__link">Contact</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

Upon upgrading to the latest Gutenberg, I noticed some unexpected rendering behavior upon reloading one of my posts:

1. The button did not respect its align property unless it was set to right;
2. If I added new buttons, they wouldn't align horizontally with the old ones;
3. The rendering / DOM structure looks broken (see the screencast below).

I tried to debug this and I suspect there's something fishy in one of the deprecations. I'm not entirely sure how they work, but it seems that the culprit is somewhere around here (might be wrong!).

Step-by-step reproduction instructions

1. Create a new post or page;
2. Change to the code editor and paste the following block markup: https://gist.github.com/fullofcaffeine/8e42e3491549c177f66f78697d5aa997
3. Go back to the visual editor
4. Notice that even though the "align" attribute is set to "center", the button still aligns to the left.
5. Go back to the code editor
6. Change the value of the "align" attribute in {"align":"center"} to "right". Exit the code editor;
7. Notice how now it aligns to the right 🤔
8. Change the alignment back to center or left (or paste the code over again to start from scratch);
9. Now try adding other buttons alongside this one;
10. Notice how they don't horizontally align :/

Expected behavior

I expect the old markup to correctly deprecate and migrate to a newer version that matches the latest and doesn't cause any rendering problems. This can be problematic as buttons stop respecting the previous align setting and end up breaking the layout.

Actual behavior

Something is wrong somewhere in the deprecation/migration pipeline that generates an inconsistent markup and ends up causing rendering issues as I described above.

Screenshots or screen recording (optional)

https://user-images.githubusercontent.com/81248/107714831-8efefd00-6c93-11eb-9681-0a6b51694bba.mp4

WordPress information

• WordPress version: 5.7-beta2-50285
• Gutenberg version: 10.0.0-rc.1
• Are all plugins except Gutenberg deactivated? Yes
• Are you using a default theme (e.g. Twenty Twenty-One)? Yes

Device information

• Device: Desktop
• Operating system: Ubuntu Linux 18.04
• Browser: Firefox 86.0b8 (64-bit)