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

[edit-widgets beta] Fix legacy widgets preview #24861

Merged
merged 5 commits into from
Aug 31, 2020

Conversation

adamziel
Copy link
Contributor

@adamziel adamziel commented Aug 27, 2020

Description

Fixes the problem where previewing an old-style widget in the Block Areas screen results in "Block rendered as empty".

Note that this PR is based on #24855.

How has this been tested?

  1. Follow the instructions posted by @noisysocks in this comment.
  2. Confirm the preview works.

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.

@adamziel adamziel added [Feature] Widgets Screen The block-based screen that replaced widgets.php. [Block] Legacy Widget Affects the Legacy Widget Block - used for displaying Classic Widgets labels Aug 27, 2020
@adamziel adamziel self-assigned this Aug 27, 2020
@adamziel adamziel changed the base branch from master to update/preload-widgets August 27, 2020 13:22
@adamziel adamziel force-pushed the update/fix-legacy-widgets-preview branch from 8a73ecb to 92463cd Compare August 27, 2020 13:26
@github-actions
Copy link

github-actions bot commented Aug 27, 2020

Size Change: +195 B (0%)

Total Size: 1.17 MB

Filename Size Change
build/block-library/index.js 136 kB +124 B (0%)
build/edit-widgets/index.js 12 kB +71 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.67 kB 0 B
build/api-fetch/index.js 3.44 kB 0 B
build/autop/index.js 2.82 kB 0 B
build/blob/index.js 620 B 0 B
build/block-directory/index.js 7.99 kB 0 B
build/block-directory/style-rtl.css 953 B 0 B
build/block-directory/style.css 952 B 0 B
build/block-editor/index.js 126 kB 0 B
build/block-editor/style-rtl.css 10.8 kB 0 B
build/block-editor/style.css 10.8 kB 0 B
build/block-library/editor-rtl.css 8.52 kB 0 B
build/block-library/editor.css 8.52 kB 0 B
build/block-library/style-rtl.css 7.45 kB 0 B
build/block-library/style.css 7.46 kB 0 B
build/block-library/theme-rtl.css 729 B 0 B
build/block-library/theme.css 730 B 0 B
build/block-serialization-default-parser/index.js 1.88 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 47.7 kB 0 B
build/components/index.js 200 kB 0 B
build/components/style-rtl.css 15.7 kB 0 B
build/components/style.css 15.7 kB 0 B
build/compose/index.js 9.67 kB 0 B
build/core-data/index.js 12.3 kB 0 B
build/data-controls/index.js 1.29 kB 0 B
build/data/index.js 8.55 kB 0 B
build/date/index.js 5.38 kB 0 B
build/deprecated/index.js 772 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 4.48 kB 0 B
build/edit-navigation/index.js 11.7 kB 0 B
build/edit-navigation/style-rtl.css 1.16 kB 0 B
build/edit-navigation/style.css 1.16 kB 0 B
build/edit-post/index.js 304 kB 0 B
build/edit-post/style-rtl.css 5.61 kB 0 B
build/edit-post/style.css 5.61 kB 0 B
build/edit-site/index.js 17 kB 0 B
build/edit-site/style-rtl.css 3.06 kB 0 B
build/edit-site/style.css 3.06 kB 0 B
build/edit-widgets/style-rtl.css 2.45 kB 0 B
build/edit-widgets/style.css 2.45 kB 0 B
build/editor/editor-styles-rtl.css 492 B 0 B
build/editor/editor-styles.css 493 B 0 B
build/editor/index.js 45.3 kB 0 B
build/editor/style-rtl.css 3.81 kB 0 B
build/editor/style.css 3.81 kB 0 B
build/element/index.js 4.65 kB 0 B
build/escape-html/index.js 733 B 0 B
build/format-library/index.js 7.71 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.13 kB 0 B
build/html-entities/index.js 621 B 0 B
build/i18n/index.js 3.57 kB 0 B
build/is-shallow-equal/index.js 710 B 0 B
build/keyboard-shortcuts/index.js 2.52 kB 0 B
build/keycodes/index.js 1.94 kB 0 B
build/list-reusable-blocks/index.js 3.12 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.32 kB 0 B
build/notices/index.js 1.79 kB 0 B
build/nux/index.js 3.4 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.41 kB 0 B
build/priority-queue/index.js 789 B 0 B
build/redux-routine/index.js 2.85 kB 0 B
build/rich-text/index.js 13.9 kB 0 B
build/server-side-render/index.js 2.77 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/url/index.js 4.06 kB 0 B
build/viewport/index.js 1.85 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.17 kB 0 B

compressed-size-action

@@ -5,6 +5,9 @@
"widgetClass": {
"type": "string"
},
"id": {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I just removed this attribute in another PR, but without it there's no way to send it over through ServerSideRender. In short - we need to have this attribute, but we shouldn't use it :-) A much better solution would be making the server side rendering API less restrictive - custom arguments would be incredibly helpful (and a great follow-up to this PR).

Copy link
Contributor

Choose a reason for hiding this comment

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

Can we rename it "widgetId" or something like that. "id" is too generic and can potentially be used for something else that works across blocks like HTML ids. or block ids...

Base automatically changed from update/preload-widgets to master August 27, 2020 16:44
Copy link
Contributor

@draganescu draganescu left a comment

Choose a reason for hiding this comment

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

Trying to test this I the error below when trying to add a legacy widget on this branch:

Screenshot 2020-08-27 at 20 03 05

Looking in console the error is:

Uncaught Error: An error occurred while running 'mapSelect': widget is undefined

And the request to index.php?rest_route=%2Fwp%2Fv2%2Ftypes%2Fwidget-areas&context=edit&_locale=user returns 404

Heads up I merged #24855 so this might need a rebase. I hope the above is just my env :O)

Copy link
Member

@noisysocks noisysocks left a comment

Choose a reason for hiding this comment

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

Approach looks good but I can't test as am also getting the error mentioned above 🙂

@@ -273,6 +273,60 @@ public function test_get_items_active_sidebar_with_widgets() {
);
}

/**
*
Copy link
Member

Choose a reason for hiding this comment

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

Write something here.

@@ -28,6 +28,13 @@ export const getWidgets = createRegistrySelector( ( select ) => () => {
);
} );

export const getWidget = createRegistrySelector(
Copy link
Member

Choose a reason for hiding this comment

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

Add a doc comment.

@adamziel adamziel force-pushed the update/fix-legacy-widgets-preview branch from 92463cd to 3e7f0c4 Compare August 28, 2020 15:43
@adamziel
Copy link
Contributor Author

adamziel commented Aug 28, 2020

I rebased, added a few more changes, and it should work fine now.

Trying to test this I the error below when trying to add a legacy widget on this branch:

It turns out one of the other PRs broke it on master :( This PR now fixes that problem.

attributes={ omit( attributes, 'id' ) }
attributes={ {
widgetId,
...omit( attributes, 'id' ),
Copy link
Contributor

Choose a reason for hiding this comment

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

should this be omit id or widgetid?

Copy link
Contributor

@youknowriad youknowriad 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 definitely behaving better than master that said I'm still seeing two issues (potentially separate):

  • When loading a legacy widget block (using the markee example), the placeholder of the legacy widget block is shown instead of the markee one directly.
  • When I make edits and click "preview", the previously saved values are used but not the values I just typed.

@youknowriad youknowriad merged commit 26be8c2 into master Aug 31, 2020
@youknowriad youknowriad deleted the update/fix-legacy-widgets-preview branch August 31, 2020 12:58
@github-actions github-actions bot added this to the Gutenberg 8.9 milestone Aug 31, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Legacy Widget Affects the Legacy Widget Block - used for displaying Classic Widgets [Feature] Widgets Screen The block-based screen that replaced widgets.php.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants