1. Build a custom styled button

The blue button to share your devtools is great for internal use, but many teams don’t want to expose an off-brand button on their production site. In fact, for all environments except localhost, the button is actually turned off by default!

We’re left with two options here.

  • Use the CMD / Ctrl + K shortcut to trigger the share workflow.
  • Or build a button into a dedicated place in your product so that users can share their devtools without a shortcut

tldr;

The PlayerZero snippet exposes a function called prompt() on its window object to trigger this flow. You can call it whenever you’d like to make the popup come up.

In fact you could test this by running playerzero.prompt() in the console of your real devtools of an application that has PlayerZero enabled. Depending on your application’s architecture, you can call this function onClick to fit into the share workflow.

Example