WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.48k stars 4.18k forks source link

blocks.getBlockDefaultClassName filter is not applied to heading, paragraph and image blocks. #16884

Closed hatsumatsu closed 5 years ago

hatsumatsu commented 5 years ago

Describe the bug The filter blocks.getBlockDefaultClassName does not alter the class attribute of heading, paragraph and image block.

To reproduce Steps to reproduce the behavior:

  1. Add the filter as decribed in the docs
    
    function addBlockCustomClassName( className ) {
    return 'wp-block ' + className;
    }

// Adding the filter wp.hooks.addFilter( 'blocks.getBlockDefaultClassName', 'my-plugin/add-block-custom-class-name', addBlockCustomClassName );


2. Class attribute of blocks like columns, group etc. is altered correctly but paragraph, heading and image blocks are untouched.

**Expected behavior**
All block should be affected by the filter.
youknowriad commented 5 years ago

That's not a bug, these blocks opt-out of the default className.

hatsumatsu commented 5 years ago

@youknowriad okay, but why? In the editor these are treated as and called blocks. Shouldn't it be possible to target all blocks in CSS via a generic class?

Coming from https://github.com/WordPress/gutenberg/issues/6639 it seems that both workarounds to easily target all blocks via one CSS selector don't work.

youknowriad commented 5 years ago

okay, but why? In the editor these are treated as and called blocks

Because they are blocks, a block is not necessary something with a given class. A block can even be multiple DOM elements without any wrapper. A block doesn't map to a DOM element, it's just an entity that wrappes a fragment of content and allows you to edit it visually.

In the case of paragraphs, headings and images we decided to opt-out of these classNames because these blocks are too common and we don't want to pollute the post-content with these.

I hope that answers your questions.

hatsumatsu commented 5 years ago

Okay, thanks for clarifying. Guess the expectations of what the desired markup looks like differ based on different frontend workflows. I was just hoping for a clean BEM-like code style...