This repository was archived by the owner on Nov 8, 2023. It is now read-only.
This repository was archived by the owner on Nov 8, 2023. It is now read-only.
[extension API] messaging flow #143
Closed
Description
https://developer.chrome.com/extensions/devtools has great overview of communicating between the various pieces, but it's still a little incomplete.
One tricky area is passing messages from a contentscript back into a devtools panel.
There's no direct connectivity between the page being inspected and DevTools extension panels -- we usually recommend this flow: DOM messaging from the injected inspected page code to the content script, then extension messaging to send that to the background page and the front-end iframe.
Example: polymer extension message passing via CustomEvent on the window
- https://github.com/PolymerLabs/polymer-devtools-extension/blob/b37837529453a487d0cc6058ac4713686157013f/hostPageHelpers.js#L786-L790
- https://github.com/PolymerLabs/polymer-devtools-extension/blob/b37837529453a487d0cc6058ac4713686157013f/contentScript.js#L7-L16
another option is: buffering events in inspected page and polling them
- Buffering events in the inspected page and then polling from the front-end by using
chrome.devtools.inspectedPage.eval()
. - web tracing framework does this
Activity
[-]devtools extension API messaging flow[/-][+][extension API] messaging flow[/+]paulirish commentedon Jan 6, 2015
covered in real docs thanks to thomas boyt's patch
https://codereview.chromium.org/632793002
zikaari commentedon Oct 24, 2018
Thought I'd share a wrapper I made few months ago: crx-bridge
Comes with ES6 Promises and multiplexed long-lived connections