Buttons in Quote block toolbar randomly shift position

[bradyvercher]

Issue Overview

When working with the Quote block, the buttons in the toolbar randomly shift position depending on which field is focused.

Steps to Reproduce (for bugs)

1. Insert a quote block
2. View the position of the buttons in the toolbar
3. Focus the citation field (the buttons shift position)
4. Deselect the block and reselect it (the buttons shift again)

Expected Behavior

I expect the buttons to always appear in the same order.

Screenshots / Video

[danielbachhuber]

Weird! It looks like the "randomness" is that the initial toolbar is different than the focused one:

I'm not sure where this variation is located though.

[rahulsprajapati]

yes, this seems like the way we are appending components-toolbar into editor-block-toolbar. The initial toolbar ( when we select the blog ) and when we try to focus on editor toolbar is adding different way.

The initial toolbar and when we transform into another block.

When we focus on another text in the block.

I think this is located in block-toolbar component. Still couldn't find the place where this switch the position yet.
https://github.com/WordPress/gutenberg/blob/master/editor/components/block-toolbar/index.js#L24-L27

and rendered with "Formatting.Toolbar" fill
https://github.com/WordPress/gutenberg/blob/master/blocks/editable/index.js#L866

[mtias]

This is fixed for me.