/
Browse all pages

Frames

Inspect same-site iframes like the rest of the page.

A page inside an iframe from the same site is inspected like the rest of the page, with nothing to turn on:

  • Hovering or clicking inside a frame selects the element in it, with its box model drawn where it sits on the page. Distances, units, pinned cards and the side panel's CSS work as usual.
  • Parent and Child cross the edge, from the top of the frame's page out to the frame element and back in.
  • X-Ray and the Design tab's type scale, colours, images, canvases and touch targets read inside it.
  • Keys work while the pointer or focus is in a frame.
  • Distances work across a frame's edge: select an element on the page and hover one inside the frame, or the other way round, and the gap is in the page's pixels. Between two elements inside a frame drawn smaller or larger (with transform: scale()), it is in the frame's own pixels, as its CSS has them. Text edges are measured inside frames too.
  • Copy as names the frame where the format can: Playwright enters it with contentFrame(), Cypress through its body and Testing Library with within; a CSS selector and an XPath are for the frame's own page.
A frame from another site cannot be entered: the browser keeps its page from Nitpique, so it shows as one element. Inside a frame, a rotated or scaled element is outlined on its upright box. The contrast scan and the breakpoint lines look at the top page only.

Questions

Can Nitpique inspect an iframe from another site?

No. The browser keeps its page from Nitpique, so it shows as one element. A frame from the same site is inspected like the rest of the page.

What does not work inside a frame?

Text edges are not measured, and a rotated or scaled element is outlined on its upright box. The contrast scan, breakpoint lines and copied unique selector or locator look at the top page only.