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

Block style previews don't always match final output if block settings are different to those in an example #18424

Open
ddryo opened this issue Nov 11, 2019 · 4 comments
Labels
[Block] Heading [Package] Block library [Type] Enhancement

Comments

@ddryo
Copy link
Contributor

@ddryo ddryo commented Nov 11, 2019

Since the level is set to 2 in the “example” setting of the heading block, H3 and H4 cannot be confirmed on the preview screen of the style panel.

example_setting_of_heading

▼ The following gif image is when the style is changed

bug_demo_heading_preview

@ellatrix ellatrix added [Block] Heading Needs Testing [Package] Block library labels Nov 21, 2019
@ddryo
Copy link
Contributor Author

@ddryo ddryo commented Dec 6, 2019

The same problem can be seen on the style preview screen of the list block.
Since it is forcibly fixed to the ul tag, the style preview of the ol tag cannot be confirmed.

▼ The following gif image is when the style is changed
bug_demo_list_preview

@ddryo
Copy link
Contributor Author

@ddryo ddryo commented Dec 6, 2019

Of course, eliminating the example setting solves this problem, but without the example setting, the preview in the block inserter help menu (.block-editor-inserter__menu-help-panel) cannot be displayed.

I think that there is a problem with the processing method that the "preview screen in the help menu of the block inserter" and the "block style preview screen" refer to the same "example".

I think it would be nice to be able to divide the process well between the two types of preview screens, but I'm not mature enough to come up with a concrete good solution.
I'm sorry, can the core team consider it?

@ddryo
Copy link
Contributor Author

@ddryo ddryo commented Dec 6, 2019

Created a plugin that adds a simple block style to heading and list blocks.

I hope you can use it for verification.

▼ The plugin.
my-guten.zip

@talldan
Copy link
Contributor

@talldan talldan commented May 14, 2020

Hey @ddryo, Thanks for reporting this and sorry that there hasn't been a reply for a while.

What you mention about the previews not updating is by design. They were previously dynamic, but the issue is that a lot of blocks require content to be previewed so the static examples were a way to solve that.

The issue you mentioned with the heading doesn't seem like something the preview could accurately portray. If I remember correctly, the preview is scaled, so increasing the size would probably scale down the preview and it'd look pretty similar.

I see your point in terms of the list block, and probably any block were a setting might change what the block looks like considerably could result in a preview that isn't quite right.

I'll label this as an enhancement, though as you mention it might be something that's difficult to resolve.

@talldan talldan added the [Type] Enhancement label May 14, 2020
@talldan talldan changed the title Only h2 can be confirmed in the heading block style preview Block style previews don't always match final output if block settings are different to those in an example May 14, 2020
@talldan talldan removed the Needs Testing label May 14, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Heading [Package] Block library [Type] Enhancement
Projects
None yet
Development

No branches or pull requests

3 participants