Media
1 item
Description
Track postMessage traffic in Chrome DevTools across frames. PostMessage Tracker is a developer tool that helps you inspect and debug PostMessages communication between host and iframes. It provides real-time visibility into all incoming and outgoing postMessage events directly in DevTools, making it easier to understand cross-origin communication and troubleshoot integration issues. 𝐇𝐨𝐰 𝐭𝐨 𝐮𝐬𝐞 Install extension Open DevTools (F12) Open the PostMessage Tracker tab Reload page Start inspecting messages ✨ 𝐅𝐞𝐚𝐭𝐮𝐫𝐞𝐬 📡 Track messages – View all sent and received postMessage events in real time 🔍 Powerful filtering – Filter messages by origin, type, or payload content 🧱 Block messages – Suppress handling of selected messages based on origin or data 🕒 Timestamps & metadata – See when messages were sent and where they came from 📋 Readable payloads – Pretty-printed JSON for easy debugging ⏸ Pause & resume – Control message flow while inspecting 🧹 Clear logs – Reset the message list instantly 👨💻 Author Created by Areg Sargsyan 🔗 https://www.linkedin.com/in/areg-sargsyan postmessage debugger iframe debugger devtools extension cross origin iframe microfrontend debugging message inspector window.postMessage iframe communication embedded app debugging frontend debugging tool iframe inspector cross-frame messaging sdk integration debugging