Inspector and Developer Panel
Unscored tasks with hints and instant feedback. Practice results never become credentials.
Short lesson
Ctrl/Cmd+Shift+T reopen tab, tab groups for contexts, DevTools: Elements to inspect, Network (Fetch/XHR) to find API calls, Application for storage and cookies.
Open the inspector and select the product title element. Enter its tag name.
Sign up to practiseOn the product page: (1) find the hidden form field and enter its value; (2) the price is loaded by an API — enter the request URL path (starting /api/) and the price value; (3) copy a CSS selector that matches only the price element.
Sign up to practiseHide the annoying promo banner using DevTools (e.g. display: none on that element), then capture a node screenshot of the product section (main#product).
Sign up to practiseRead the value of the localStorage key “theme” (enter it), then emulate an iPhone-size device.
Sign up to practiseCapture the page's network activity as a HAR file for the developers, and enter the number of requests that went to a third-party domain.
Sign up to practise