Gallery Block: Identical Images Get Duplicated When Moving

[sdixon194]

Description

When adding the same image to a gallery block, moving adjacent images will duplicate that image multiple times.

Step-by-step reproduction instructions

Please list the steps needed to reproduce the bug. For example:

1. Add a gallery block
2. Add two images that are the same next to each other.
3. Try and use the arrows on an adjacent image to move it over.
4. Watch the other image take over the gallery.

Expected behaviour

The images to just swap positions normally.

Actual behaviour

Another image was duplicated instead.

Screenshots or screen recording (optional)

Easier to see with this:

WordPress information

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

Device information

• Operating system: Mac OS 11.2.3
• Browser: Chrome 89.0.4389.114 || Firefox 86.0.1 (

[Mamaduka]

I was able to reproduce the issue.

To add the same image multiple times in a gallery, you'll have to edit the gallery item and select the image.

I guess that this happens because children will have the same key prop.