Skip to content

Add backward compatibility support for lightBlockWrapper in getSaveElement#27189

Merged
talldan merged 1 commit into
masterfrom
fix/double-color-classnames
Nov 25, 2020
Merged

Add backward compatibility support for lightBlockWrapper in getSaveElement#27189
talldan merged 1 commit into
masterfrom
fix/double-color-classnames

Conversation

@talldan
Copy link
Copy Markdown
Contributor

@talldan talldan commented Nov 23, 2020

Description

Fixes #26672

#25642 added support for the apiVersion: 2 block setting which replaces the lightBlockWrapper supports setting.

In some places in that PR, backwards compatibility for lightBlockWrapper was left in place:

But getSaveElement doesn't seem to have that, which causes the duplicate classnames described in #26672:

gutenberg/packages/blocks/src/api/serializer.js

Lines 119 to 123 in 1f0d0f5

if (
isObject( element ) &&
hasFilter( 'blocks.getSaveContent.extraProps' ) &&
! blockType.apiVersion
) {

How has this been tested?

  1. Load the post editor and register the following block by copying the code and running it in your browser console:
wp.blocks.registerBlockType( `example/example-new`, {
    title: wp.i18n.__( 'Example Block (New)', 'example' ),
    description: wp.i18n.__( 'Example Block', 'example' ),
    icon: 'smiley',
    category: 'common',
    example: {},
    supports: {
        html: false,
        lightBlockWrapper: true,
        align: true,
        anchor: true,
        color: {
            link: true
        },
    },
    attributes: {},
    transforms: {},
    variations: [],
    edit: () => {
        return wp.element.createElement( 'div', wp.blockEditor.useBlockProps(), 'Hello World' );
    },
    save: () => {
        return wp.element.createElement( 'div', wp.blockEditor.useBlockProps.save(), 'Hello World' );
    }
} );
  1. Add the new block and set some custom colors
  2. Preview the post and inspect the element created by the block
  3. Confirm it has no duplicate classnames.

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@talldan talldan added [Type] Bug An existing feature does not function as intended [Feature] Blocks Overall functionality of blocks Backport to WP Beta/RC labels Nov 23, 2020
@talldan talldan requested a review from ellatrix as a code owner November 23, 2020 09:17
@talldan talldan self-assigned this Nov 23, 2020
@talldan talldan mentioned this pull request Nov 23, 2020
Closed
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Nov 23, 2020

Size Change: +19 B (0%)

Total Size: 1.2 MB

Filename Size Change
build/blocks/index.js 48.1 kB +19 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.8 kB 0 B
build/api-fetch/index.js 3.42 kB 0 B
build/autop/index.js 2.83 kB 0 B
build/blob/index.js 665 B 0 B
build/block-directory/index.js 8.72 kB 0 B
build/block-directory/style-rtl.css 943 B 0 B
build/block-directory/style.css 942 B 0 B
build/block-editor/index.js 133 kB 0 B
build/block-editor/style-rtl.css 11.3 kB 0 B
build/block-editor/style.css 11.3 kB 0 B
build/block-library/editor-rtl.css 8.96 kB 0 B
build/block-library/editor.css 8.96 kB 0 B
build/block-library/index.js 148 kB 0 B
build/block-library/style-rtl.css 8.23 kB 0 B
build/block-library/style.css 8.23 kB 0 B
build/block-library/theme-rtl.css 792 B 0 B
build/block-library/theme.css 793 B 0 B
build/block-serialization-default-parser/index.js 1.87 kB 0 B
build/block-serialization-spec-parser/index.js 3.06 kB 0 B
build/components/index.js 172 kB 0 B
build/components/style-rtl.css 15.3 kB 0 B
build/components/style.css 15.3 kB 0 B
build/compose/index.js 9.93 kB 0 B
build/core-data/index.js 14.8 kB 0 B
build/data-controls/index.js 827 B 0 B
build/data/index.js 9.71 kB 0 B
build/date/index.js 11.2 kB 0 B
build/deprecated/index.js 769 B 0 B
build/dom-ready/index.js 571 B 0 B
build/dom/index.js 4.92 kB 0 B
build/edit-navigation/index.js 11.2 kB 0 B
build/edit-navigation/style-rtl.css 881 B 0 B
build/edit-navigation/style.css 885 B 0 B
build/edit-post/index.js 306 kB 0 B
build/edit-post/style-rtl.css 6.45 kB 0 B
build/edit-post/style.css 6.44 kB 0 B
build/edit-site/index.js 23.5 kB 0 B
build/edit-site/style-rtl.css 3.86 kB 0 B
build/edit-site/style.css 3.86 kB 0 B
build/edit-widgets/index.js 26.4 kB 0 B
build/edit-widgets/style-rtl.css 3.13 kB 0 B
build/edit-widgets/style.css 3.13 kB 0 B
build/editor/editor-styles-rtl.css 476 B 0 B
build/editor/editor-styles.css 478 B 0 B
build/editor/index.js 43.3 kB 0 B
build/editor/style-rtl.css 3.85 kB 0 B
build/editor/style.css 3.85 kB 0 B
build/element/index.js 4.62 kB 0 B
build/escape-html/index.js 735 B 0 B
build/format-library/index.js 6.86 kB 0 B
build/format-library/style-rtl.css 547 B 0 B
build/format-library/style.css 548 B 0 B
build/hooks/index.js 2.16 kB 0 B
build/html-entities/index.js 623 B 0 B
build/i18n/index.js 3.57 kB 0 B
build/is-shallow-equal/index.js 698 B 0 B
build/keyboard-shortcuts/index.js 2.85 kB 0 B
build/keycodes/index.js 1.94 kB 0 B
build/list-reusable-blocks/index.js 3.1 kB 0 B
build/list-reusable-blocks/style-rtl.css 476 B 0 B
build/list-reusable-blocks/style.css 476 B 0 B
build/media-utils/index.js 5.31 kB 0 B
build/notices/index.js 1.82 kB 0 B
build/nux/index.js 3.42 kB 0 B
build/nux/style-rtl.css 671 B 0 B
build/nux/style.css 668 B 0 B
build/plugins/index.js 2.56 kB 0 B
build/primitives/index.js 1.43 kB 0 B
build/priority-queue/index.js 790 B 0 B
build/redux-routine/index.js 2.84 kB 0 B
build/reusable-blocks/index.js 3.07 kB 0 B
build/rich-text/index.js 13.4 kB 0 B
build/server-side-render/index.js 2.77 kB 0 B
build/shortcode/index.js 1.69 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/url/index.js 4.05 kB 0 B
build/viewport/index.js 1.86 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.22 kB 0 B

compressed-size-action

tellthemachines
tellthemachines approved these changes Nov 25, 2020
View reviewed changes
Copy link
Copy Markdown
Contributor

@tellthemachines tellthemachines left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is working well!

@talldan talldan merged commit 5c530b2 into master Nov 25, 2020
@talldan talldan deleted the fix/double-color-classnames branch November 25, 2020 04:41
@github-actions github-actions Bot added this to the Gutenberg 9.5 milestone Nov 25, 2020
tellthemachines pushed a commit that referenced this pull request Nov 30, 2020
@talldan @tellthemachines
Add backward compatibility support for lightBlockWrapper in getSaveEl…
0e2d119 
…ement (#27189)
@tellthemachines tellthemachines mentioned this pull request Nov 30, 2020
Merged
6 tasks
@youknowriad
Copy link
Copy Markdown
Contributor

youknowriad commented Nov 30, 2020

lightBlockWrapper was never a stable API (you were forced to use __experimentalBlock in addition to it) so I'm really not sure this code is needed.

@youknowriad
Copy link
Copy Markdown
Contributor

youknowriad commented Nov 30, 2020

I guess it's ok for consistency but I wouldn't mind removing all of these fallbacks.

tellthemachines added a commit that referenced this pull request Dec 1, 2020
@tellthemachines @jasmussen
@aaronrobertshaw @ntsekouras @adamsilverstein @youknowriad @draganescu @talldan @ellatrix @noahtallen @apeatling
Backports for 5.6 RC2 (#27366)
70774a1 
* Provide a minimum of code wrapping for the code block. (#26623)

* Block Support: Fix font size style when applying block support (#26762)

* Fix Separator editor styles (#27071)

* Fix the Post author selector for contributors (#26554)

Co-authored-by: Riad Benguella <benguella@gmail.com>

* Align single half width column to left (#27142)

* remove the auto margin for individual column blocks

* update margin values for blocks in blocks to zero insted of auto

* Add backward compatibility support for lightBlockWrapper in getSaveElement (#27189)

* Code block: paste plain text (#27236)

* paste plain text option

* Add e2e test

* Fix crash when null date passed to TimePicker (#27316)

* Fix crash when null date passed.

* Update test

* Fix GH actions "cancel" step (#27025)

* use new syntax for setting env var

* Update package-lock

* Update package-lock again

* Remove the button only option from the UI until it can be wired up to something that works in the front end. (#27379)

* Fix combobox csuggestion list closure when clicking scrollbar (#27367)

Co-authored-by: Joen A <1204802+jasmussen@users.noreply.github.com>
Co-authored-by: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com>
Co-authored-by: Nik Tsekouras <ntsekouras@outlook.com>
Co-authored-by: Adam Silverstein <adamsilverstein@earthboundhosting.com>
Co-authored-by: Riad Benguella <benguella@gmail.com>
Co-authored-by: andrei draganescu <me@andreidraganescu.info>
Co-authored-by: Daniel Richards <daniel.richards@automattic.com>
Co-authored-by: Ella van Durpe <wp@iseulde.com>
Co-authored-by: Noah Allen <noahtallen@gmail.com>
Co-authored-by: Andy Peatling <apeatling@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@tellthemachines tellthemachines tellthemachines approved these changes

@ellatrix ellatrix Awaiting requested review from ellatrix

Assignees

@talldan talldan

Labels

[Feature] Blocks Overall functionality of blocks [Type] Bug An existing feature does not function as intended

Projects

None yet

Milestone

Gutenberg 9.5

Development

Successfully merging this pull request may close these issues.

Duplicate generated classNames when using useBlockProps.save()

3 participants

@talldan @youknowriad @tellthemachines