HackBlue

Tools · Web testing tools · 15 / 23

The ZAP HUD on the lab browser

The HUD lays a small ZAP panel over the lab page in the browser, so alert counts and a few tools sit next to Harbor Ledger. The desktop History table remains the record. The overlay is a convenience, and only on the lab origin.

14 min read · practice only with authorization

What the overlay adds

ZAP’s HUD, when your build includes it, draws a panel over the browsed page: alert counts, a way to open the alert list, and shortcuts into tools. You turn it on from the desktop UI and then use the lab browser on http://127.0.0.1:3000. The invoice list should look like itself, with extra chrome at the edges. Those edges are ZAP. The table of invoices is Harbor Ledger.

The overlay is convenient while you click, because you can see a new alert appear after a navigation without alt-tabbing. It is a bad place to take the only screenshot. A screenshot of the page plus the overlay mixes two programs. If you need a picture of the clerk’s screen, turn the HUD off first.

Keep it on the lab origin

The HUD rides in the browser that is using ZAP’s proxy. That browser is the lab browser, the same discipline as Burp’s built-in browser. Do not turn the HUD on in a profile you use for anything else. Do not follow a link off 127.0.0.1:3000 to “see if the HUD follows.” If it follows, you have already left the lab.

Turn the HUD off at the end of the session even though you will also close the browser. A tool that draws on pages should have an obvious off switch, and you should use it. The desktop ZAP window can stay open until you have finished the note.

The record is still History

Selecting an alert in the HUD should correspond to a row in the desktop Alerts tab. That row still has a URL, a confidence, and an evidence snippet. The confirmation step does not change because the pointer was pretty: open History, read the response, write the field list from the alert-reading lesson.

If the HUD and the desktop disagree, believe History’s raw message. Overlays cache counts. The message pane shows the bytes of one exchange. Quote the bytes.

Snippet
On the lab page: invoice titles the clerk sees
In the HUD: alert counts and ZAP shortcuts
In History: GET /invoices and the response headers
In the note: only what History confirmed

Worked case: one alert, reached from the page

With the HUD on, load http://127.0.0.1:3000/invoices as Avery. Open the overlay’s alert list and choose the missing content security policy, or whichever header alert your baseline produced. Without writing anything yet, find the same alert in the desktop tab and the same URL in History. Confirm the header is absent. Then turn the HUD off, reload, and confirm the invoice list is still the invoice list. That last check is how you know you were not describing ZAP’s chrome as if it were the product.

If the HUD is not in your build, do the identical check from the Alerts tab. Say in the note that the overlay was unavailable and the desktop table was the source. The lesson’s point is the split between page, tool chrome, and message log, and you can learn that split without the overlay.

Diagram

The page, the overlay, and the real log

  1. Lab page

    You are looking at http://127.0.0.1:3000/invoices, signed in as Avery.

  2. Overlay

    The HUD draws tools and alert counts on the sides of that page.

  3. Click

    Choosing an alert in the overlay selects the same claim the desktop Alerts tab holds.

  4. History

    You still open the desktop History row to read the request and the response.

Where a fact lives

  • On the page

    Titles, buttons, and the invoice status the script rendered. This is what a clerk sees.

  • In the HUD

    Counts and shortcuts tied to the origin you are on. Useful while you click. Easy to confuse with the page itself.

  • In History

    The request and the response, uncropped. This is what you quote.

HUD limits for this lab
Turn the HUD on only in the lab browser.
Stay on http://127.0.0.1:3000.
Read claims in the desktop History tab before you write them down.
Turn the HUD off before you close the session.

Check yourself

1. You are describing a button on the invoice page. Where must that button come from?

2. The HUD badge shows a number of alerts on http://127.0.0.1:3000. What do you write down?

3. Your ZAP build does not show the HUD. What is the consequence for this lesson?