Debugging Chrome using the Firefox Debugger

Developing across multiple browsers and devices is the main issue developers have when building applications. Wouldn’t it be great to debug your app across desktop, Android, and iOS with one tool? We believe the Web is powerful enough to offer a Mobile Web development solution that meets these needs. Enter an experimental Firefox add-on called […]

Google Chrome DevTools Device Mode

Click the icon marked with the pink-ish circle to open Device Mode. Click the icon marked with the red circle to activate the Media Query Inspector. One can quickly choose a device and also throttle the network using the blue and orange dropdowns at the top. You might have to enable Devtools Experiments in Canary […]

WebIDE – In-browser editing for Firefox

WebIDE helps you create, edit, and test a new Web application right from your browser. It lets you install and test apps on Firefox OS devices and simulators and integrates the Firefox Developer Tools for seamless debugging and inspection across those devices. This is a first step towards debugging across various platforms and devices over […]

Using the DevTools to get first in line to buy Tomorrowland tickets

All Friday night we were busy monitoring the different API-calls from the ticketpage to Paylogic. We found out that the ticket page refreshed every 2 minutes with a delay of 6 seconds to send back the answer. The trick was to refresh the ticket page in your browser at exactly 10h. 57m. 54sec., whereafter the […]

RemoteDebug, an initiative to unify remote debugging across browsers

What if it was possible to use Chrome DevTools to debug Firefox, or use Firefox DevTools to debug Chrome? … The open web follows standards. Our tools should too. RemoteDebug, an initiative to unify remote debugging across browsers → Related: Sublime Web Inspector →

console.snapshot

Output snapshots and screenshots of canvas elements directly in the console of the Chrome Dev Tools var canvas = document.createElement(“canvas”), ctx = canvas.getContext(“2d”); // … //draw // … console.screenshot(canvas, 0.8); //Snapshot it and scale the output to 80% of the original size Resulting output is the image picture above. Also supports creating a snapshot which […]

Become a Javascript Console Power-User

Level up on the Javascript console in the Chrome DevTools. Look at XHR requests, learn console helper functions to monitor events or explore objects better. Paul Irish from the Chrome team gives you a rundown. We all know console.x, but there’s some more stuff to do in the console … sure that $0 shorthand will […]

The Application Cache is no longer a Douchebag

A new command for the Firefox Command Line (part of the Developer Tools) named appcache to manipulate/inspect the appcache. As someone commented on the original post: Somebody has recently pointed out that the appcache is still a douchebag but at least Firefox now has a way to tell us why. The Application Cache is no […]