Cloudflare's Inspect panel puts logs, network traffic and the final DOM beside Browser Run replays

"Those problems can look identical in a screenshot. They need different repairs," the guide's author wrote ^[4]. There are four of them: a click that never reaches its control, a wrong request, a server error, and a correct response that the page then fails to display ^[5]. The guide gives each observation its own next step ^[14]. If the selected filter never changes, inspect the click target and event handling. If the filter changes but the request asks for read articles, inspect how the selection becomes request parameters. If the request is right and the response is not, inspect the server and the test data. If the response holds the article and the page stays blank, inspect how the app reads and displays it.

Each branch needs a different part of the capture. The first needs the replay itself. The second and third need the network view, which according to the guide carries request details, responses and timing ^[2]. The fourth needs the console log and the DOM ^[1].

The guide describes the DOM view as the page's final structure ^[1]. It shows one state, at the end of the run. For the blank list, the author offers two explanations: the display code expects the wrong response shape, or a second request arrives later and replaces the correct result ^[7]. Both end in the same empty list, so the final DOM cannot tell them apart ^[1]. The author's proposed check is the response handling and the order of state updates ^[7]. Order is a timing question, and the network view records timing ^[2]. By the guide's account, Playwright's Trace Viewer connects actions with snapshots and can narrow inspection to one action's time range ^[8]. The guide does not say whether the Inspect panel can step through page state the same way.

The author is blunt about why to capture a single fresh run. "Mixing a screenshot from yesterday with today's console error can create a persuasive story about two different bugs," the author wrote ^[10]. The rule that follows is to "give AI a connected account of the failure before asking it to repair anything" ^[16]. The suggested prompt asks the tool to walk through the sequence and keep observations separate from explanations ^[17]. The guide also warns that "A successful HTTP status alone does not establish that the returned content is correct" ^[13]. The question the author puts to the tool is "where is the earliest observable mismatch we can actually demonstrate?" ^[15]