Tag Archives: chrome

Puppeteer – Headless Chrome Node API

Puppeteer is a Node library which provides a high-level API to control headless Chrome over the DevTools Protocol. It can also be configured to use full (non-headless) Chrome. const puppeteer = require(‘puppeteer’); (async () => { const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto(‘https://example.com’); await page.screenshot({path: ‘example.png’}); browser.close(); })(); Puppeteer – […]

Chromeless Playground: Chrome Automation Made Simple

With Chrome 59 came the ability to run a Headless Chrome. Controlling it via code isn’t that easy nor elegant. Enter Chromeless (not be confused with Mozilla’s Chromeless): With Chromeless you can control Chrome (open website, click elements, fill out forms…) using an elegant API. This is useful for integration tests or any other scenario […]

Chrome DevTools’ Command Menu

Something I learnt via Umar Hansa‘s great DevTools Tips is that the Chrome DevTools sport a Command Menu. By hitting SHIFT+CMD+P (same shortcut as Sublime Text’s command menu BTW) you can open it. Thanks to fuzzy matching you can easily access things in it. Chrome DevTools: UI: Command Menu → Umar Hansa’s Twitter Account is […]

Chrome DevTools Tip: Blackboxing Scripts

The Chrome DevTools have this neat feature where you can “blackbox” JavaScript source files. Upon blackboxing a script the debugger will jump over anything contained in that file when stepping in/out/over code, and not pause on any breakpoints also contained in that file. A typical example would be to blackbox the script of the JS […]

Chrome “Go Back With Backspace” Extension

With the release of Chrome 52, the backspace button no longer navigates back when pressing it. Highly annoying, because the navigating back with the backspace button is just very, very handy (it only requires one finger/hand!). “Go Back With Backspace” is the official Google released Chrome Extension that restores this behavior (other – non-Google developed […]

Google Chrome, Firefox Address Bar Spoofing Vulnerability

Turns out one single right-to-left character in a URL can make the omnibox (Address Bar) freak out, and render it wrongly: Placing neutral characters such as “/”, “ا” in filepath causes the URL to be flipped and displayed from Right To Left. In order for the URL to be spoofed the URL must begin with […]

Chrome DevTools Custom Object Formatters

Here’s a little Chrome DevTools gem: it supports the use of custom Object formatters. Object what? Object formatters allow you to control how the value of a JavaScript object appears in Chrome’s console and debugger. Say you’d like to visualize a 2D vector, instead of seeing “just” { x: 1, y: 2} appear when pushing […]