How to Debug Remote Browsers

By  on  

It's super frustrating when bugs pop up only in a remote browser. Something about that user, that device, or that environment is different, but I don't know what! And of course, I can't recreate it on my local development machine.

The team at TrackJS came up with a cool way to connect and debug these remote browsers that we call RemoteJS. RemoteJS is a free service where you can attach a simplified JavaScript debugger to a remote browser. The debugger provides a remote console where you can see logs, url, network events, and execute commands. You can even pull a remote screenshot.

To use it, just create a new "debugger channel" for agents to connect to. Connecting the agent is with a JavaScript snippet to attach to the browser and establishes a websocket connection back to the web debugger. You can deploy it conditionally to catch an annoying heisenbug, perhaps activating if the `?debug` querystring is present. You can also execute it directly or as a bookmarklet if you can't do a deploy.

RemoteJS can help make the most frustrating kind of bugs a little less painful. Give it a try!

Todd Gardner

About Todd Gardner

Todd Gardner is a software entrepreneur and developer who has built multiple profitable products. He pushes for simple tools, maintainable software, and balancing complexity with risk. He is the cofounder of TrackJS and Request Metrics, where he helps thousands of developers build faster and more reliable websites. He also produces the PubConf software comedy show.

Recent Features

  • By
    Create a CSS Cube

    CSS cubes really showcase what CSS has become over the years, evolving from simple color and dimension directives to a language capable of creating deep, creative visuals.  Add animation and you've got something really neat.  Unfortunately each CSS cube tutorial I've read is a bit...

  • By
    Designing for Simplicity

    Before we get started, it's worth me spending a brief moment introducing myself to you. My name is Mark (or @integralist if Twitter happens to be your communication tool of choice) and I currently work for BBC News in London England as a principal engineer/tech...

Incredible Demos

  • By
    Check All/None Checkboxes Using MooTools

    There's nothing worse than having to click every checkbox in a list. Why not allow users to click one item and every checkbox becomes checked? Here's how to do just that with MooTools 1.2. The XHTML Note the image with the ucuc ID -- that...

  • By
    Highlight Table Rows, Columns, and Cells Using MooTools 1.2.3

    Row highlighting and individual cell highlighting in tables is pretty simple in every browser that supports :hover on all elements (basically everything except IE6). Column highlighting is a bit more difficult. Luckily MooTools 1.2.3 makes the process easy. The XHTML A normal table. The cells...

Discussion

  1. that’s kind of awesome

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!