Gutenberg: Storybook playground is broken

Created on 20 Jul 2020  路  8Comments  路  Source: WordPress/gutenberg

Describe the bug
Storybook playground is broken. https://wordpress.github.io/gutenberg/?path=/story/docs-introduction--page I also tried building latest release (at this time https://github.com/WordPress/gutenberg/releases/tag/v8.5.1) locally and I encountered same error.

I am looking at integrating standalone version of gutenberg inside my react based application so I followed the setup from storybook when I encountered this error. I was able to setup this once before and everything worked. I have the project and yarn.lock here if you want to checkout the last version that worked for me.

What can we do to fix this?

To reproduce
Steps to reproduce the behavior:

  1. Go to https://wordpress.github.io/gutenberg/?path=/story/playground-block-editor--default
  2. Click on "Add block" button.
  3. See error Cannot read property 'length' of undefined

Expected behavior
A new block is added inside editor area.

Screenshots
image

Editor version (please complete the following information):

  • This error is happening inside storybook playground released here.

Desktop (please complete the following information):

  • any OS or browser
Good First Issue Storybook [Type] Bug

All 8 comments

Release 8.4.0 works without the error above. Looks like the QuickInserter component broke something after 8.5.0 release.

But on the 8.4.0 release (same setup as reported above) there is another error:
Cannot read property 'createSuccessNotice' of null

image

To reproduce
Steps to reproduce the behavior:

  1. Go to /?path=/story/playground-block-editor--default
  2. Click on "Add block" button.
  3. Select any (except for paragraph) block from tooltip
  4. See error Cannot read property 'createSuccessNotice' of null

@annezazu any interest to fix this sooner then later?

I would be interested to try and fix this by myself. I think its a shame a great project like this breaks in "hello world" like example.

@capJavert I'm afraid I am just helping with triage by adding labels but am not in a place to fix this. If you're game to take this on, that would be lovely. I'll see what I can do to flag this for others though as I agree it would be great to have this fixed.

That's a bummer!!

For some context, I believe it takes a combination of various parts to bootstrap up the Gutenberg editor. The one that exists in the Playground story is a very basic version of it.

It looks like it's breaking at something related to QuickInserter. I'm not sure what's up.

@youknowriad I noticed the same thing happening in AsBlocks as well:
https://github.com/youknowriad/asblocks

Screen Shot 2020-07-30 at 1 53 24 PM

Is this a bug related to the Editor being bootstrapped in an environment outside of WP-Admin?

(Thanks!! <3)

I don't know yet, I created an issue on asblocks too but I have yet to debug it properly.

@youknowriad any success in solving this? Can you link the issue you created for asblocks.

@capJavert Yes, it's actually and easy fix see here https://github.com/youknowriad/asblocks/issues/43#issuecomment-667667349

I think we should solve this in the quick inserter code here and just have default values for these settings.

Was this page helpful?
0 / 5 - 0 ratings