I'm working on a plugin with Gutenberg integration. I registered a plugin in React, and my sidebar is showing and working fine. But I need to perform an action each time my sidebar is showing up.

I noticed that functions Render, componentDidUpdate, componentDidMount are not called when I switch the sidebar (for example I open Rank Math sidebar, and then I return to my sidebar). So using those are not good for me.

I'm looking for some kind of event listener that will be executed when I reopen my sidebar. I'm new to React, so I'm not sure if I can use useState hook in some way to do this?

Furthermore, I also field at looking for any built-in events in Gutenberg in documentation, so not sure if there is any ready solution.

  • 1
    There isn’t an event. That’s not really how React or the block editor works. What sort of thing do you need to happen when switching tabs. Knowing that would help inform the appropriate solution. Jul 14, 2022 at 16:10
  • @JacobPeattie I need to put dynamic content using iframe into the sidebar. Currently, I can load it properly, but when I change the sidebar and then return to my sidebar, the dynamically loaded content is gone. So my idea was to catch the event when sidebar is loaded and insert content then.
    – mWin
    Jul 15, 2022 at 7:18

1 Answer 1


For everyone who is looking for a solution:

The issue was that I wanted to use React. Component as I was sure it is required by WordPress. But Functional Component is also accepted, and in this case instead of componentDidMount you can use useEffect hook, which is executed each time sidebar is loaded and do the job perfectly.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.