My personal website https://leviolson.com
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

24 lines
2.9 KiB

<h1 id="betternetworkpanelachromeextension">Better Network Panel - a Chrome extension</h1>
<blockquote>
<p>"As a Salesforce and Vlocity developer, I'm constantly looking for ways to improve my workflow, speed up my debugging, and find answers fast."</p>
</blockquote>
<h2 id="theproblem">THE PROBLEM</h2>
<p>Over the last couple months, part of my debugging process has involved using the Chrome DevTools "Network" panel to find a specific <code>apexremote</code> call. The search to find one <code>apexremote</code> call out of dozens has been… annoying. </p>
<p>The page loads, several dozen <code>apexremote</code> calls flood the panel, and I start clicking each one, until the correct one (i.e. <code>Request-Body</code> contains "xyz") and I can proceed to look at the Preview.</p>
<p>The issue has only just begun, as I need to inspect the <code>Response</code>, perform some searches for <code>ID</code>s and the like, and although the <code>Response</code> is JSON format, the node in the response I need to search is stringified in a child member. So I must copy the data, parse it somehow, either locally on my machine or on the web (jsoneditoronline.org has been great) and finally perform the searching I need.</p>
<p>And all of the above is done several times a day.</p>
<h2 id="thesolution">THE SOLUTION</h2>
<p><a href="https://chrome.google.com/webstore/detail/better-network-panel/kknnkgpbclaljhfcknhbebhppmkmoaml"><img src="/images/bnpscreenshot.png" alt="BNP for Chrome" /></a></p>
<p>I present to you a <a href="https://chrome.google.com/webstore/detail/better-network-panel/kknnkgpbclaljhfcknhbebhppmkmoaml">Better Network Panel</a>. A Chrome extension that adds a new panel, and offers great features like:</p>
<ul>
<li><strong>Full Search</strong> - Entire request is searchable (i.e. headers, request body, etc…), not just URI</li>
<li><strong>JSON Parsing</strong> - Even nested members that contain stringified JSON are parsed to 3 levels deep</li>
<li><strong>JSON Search</strong> - Incremental searching is available directly in the Preview pane</li>
<li><strong>Regex Search</strong> - Powerfull regex searches can be performed on the Preview pane</li>
<li>More to come</li>
</ul>
<h2 id="opensourcebaby">Open source baby</h2>
<p>View it on <a href="https://github.com/leothelocust/better-network-chrome-panel">GitHub</a></p>
<h2 id="specialthanks">Special Thanks</h2>
<p>A huge thanks and recognition goes to <a href="https://github.com/milton-lai/saml-chrome-panel">Milton Lai</a> and his project SAML Chrome Panel. I started from a fork of his project, but later started fresh as there was a lot of SAML specific code that this project doesn't use/need. The UI is nearly identical, but the code underneath has become fairly different at this point.</p>
<p>The SAML Chrome Panel was a huge help and ispiration! Thank you Milton and contributors to the SAML Chrome Panel project!</p>