> ## Documentation Index
> Fetch the complete documentation index at: https://checkly-422f444a-mintlify-98a58ea2.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# How to Handle iFrames in Playwright

> Access and interact with iframe content in Playwright using frameLocator to query elements inside a frame as if you were in the page context.

<Tip>
  If you're using Playwright for end-to-end testing, you should check out [Playwright Check Suites](/detect/synthetic-monitoring/playwright-checks/overview) and start testing in production.
</Tip>

Playwright enables us to access and interact with iframes.

## Locate an iframe and its elements

To access iframe elements, locate the iframe and query the DOM elements as if you're in the page context.

```ts iframe-access.spec.ts theme={null}
import { test } from '@playwright/test'

test('access iframe content', async ({ page }) => {
  await page.goto('https://your-page-with-an-iframe.com')
  const header = await page.frameLocator('iframe').locator('h1')
  console.log(await header.innerText())
})

```

<div className="sign-up-cta">
  <div className="sign-up-cta-title">
    Bugs don't stop at CI/CD. Why would Playwright? <img src="https://mintcdn.com/checkly-422f444a-mintlify-98a58ea2/LP_Fp0jCdwjVlGan/images/icons/playwright.svg?fit=max&auto=format&n=LP_Fp0jCdwjVlGan&q=85&s=dbac73e860bdab7065b4cc7921957b03" alt="Playwright logo" noZoom width="256" height="192" data-path="images/icons/playwright.svg" />
  </div>

  <div className="sign-up-cta-body">
    <a href="https://app.checklyhq.com/signup" target="_blank">Sign up</a> and start using Playwright for end-to-end monitoring with Checkly.
  </div>
</div>

## Further reading

1. [Playwright's "Frames documentation"](https://playwright.dev/docs/frames)