Skip to content

Instantly share code, notes, and snippets.

@KevinBatdorf
Last active March 22, 2024 20:00
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save KevinBatdorf/fca19e1f3b749b5c57db8158f4850eff to your computer and use it in GitHub Desktop.
Save KevinBatdorf/fca19e1f3b749b5c57db8158f4850eff to your computer and use it in GitHub Desktop.
WordPress check Gutenberg editor is ready
import { select, subscribe } from '@wordpress/data'
export function whenEditorIsReady() {
return new Promise((resolve) => {
const unsubscribe = subscribe(() => {
// This will trigger after the initial render blocking, before the window load event
// This seems currently more reliable than using __unstableIsEditorReady
if (select('core/editor').isCleanNewPost() || select('core/block-editor').getBlockCount() > 0) {
unsubscribe()
resolve()
}
})
})
}
@X-Raym
Copy link

X-Raym commented Feb 14, 2023

@strarsis thx you very much for this more detailed code snippet!

It do return an error though:

```Uncaught SyntaxError: await is only valid in async functions, async generators and modules````

@X-Raym
Copy link

X-Raym commented Feb 14, 2023

Ok I had to replace the last async call with

(async() => {
    await getEditorIframe();
    MyFunction()
  })();

And also

document.querySelector('[name="editor-canvas"]');

by

document.querySelector('.edit-post-header-toolbar__left');

(cause the first one was undefined. I needed the toolbar anyway), cause I use this to print custom infos on the Gutenberg toolbar.

Seems to works with these fixes, many thx!

img

@strarsis
Copy link

🤔 In latest Gutenberg it appears that no iframe element is used anymore.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment