Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Buttons in Quote block toolbar randomly shift position #4024

Closed
bradyvercher opened this issue Dec 15, 2017 · 3 comments
Closed

Buttons in Quote block toolbar randomly shift position #4024

bradyvercher opened this issue Dec 15, 2017 · 3 comments
Labels
Good First Issue An issue that's suitable for someone looking to contribute for the first time [Type] Bug An existing feature does not function as intended
Milestone

Comments

@bradyvercher
Copy link
Contributor

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

quote-block

@danielbachhuber danielbachhuber added [Type] Bug An existing feature does not function as intended Good First Issue An issue that's suitable for someone looking to contribute for the first time labels Jan 23, 2018
@danielbachhuber
Copy link
Member

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

image

image

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

@rahulsprajapati
Copy link
Contributor

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.

screen shot 2018-01-24 at 5 36 43 pm

When we focus on another text in the block.

screen shot 2018-01-24 at 5 37 16 pm

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
Copy link
Member

mtias commented Mar 6, 2018

This is fixed for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Good First Issue An issue that's suitable for someone looking to contribute for the first time [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

5 participants