Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Iframe #365

Open
sexta13 opened this issue Jan 17, 2022 · 2 comments
Open

Iframe #365

sexta13 opened this issue Jan 17, 2022 · 2 comments
Labels
enhancement New feature or request

Comments

@sexta13
Copy link

sexta13 commented Jan 17, 2022

Can we use this with an Iframe? is there any example? Thanks

@jrolfs
Copy link
Member

jrolfs commented Jan 29, 2022

Hi @sexta13, I'm sorry it's taken me so long to get back to you. This library doesn't explicitly support iframes, but I don't think it would be too hard to add support.

We'd need to update the getDocument method to target the frame, so maybe just adding an options argument that would take a frameSelector...

//                                    ↯ ---------- New API ---------- ↯
const frame = await getDocument(page, { frame: { url: /google\.com/ } })
const input = await getByLabelText(frame, 'search')

The @playwright/test fixture API would be a little trickier... it would depend on the above change, and then maybe provide queries for each frame?

import {test as baseTest} from '@playwright/test'
import {fixturesFor, TestingLibraryFixtures} from '@playwright-testing-library/test/fixture'

// New API
const fixtures = fixturesFor({ google: { url: /google\.com/ }, bing: { url: /bing\.com/ } });

const test = baseTest.extend<TestingLibraryFixtures>(fixtures))
const { expect } = test

// Queries available for each frame... `main` is always available to query `page.mainFrame()`?
test('iframes with search inputs', async ({ queries: { main, google, bing } }) => {
  const inputFromMainFrame = await main.getByLabelText('search');
  const inputFromGoogleFrame = await main.getByLabelText('search');
  const inputFromBingFrame = await main.getByLabelText('search');

  // ...
})

I left links above with where the modifications would need to be made.

Out of curiousity, what's your use case? Would you be querying the main frame as well as an iframe? What do you think of this API?

@sexta13
Copy link
Author

sexta13 commented Jan 29, 2022

Hey,

No problem...
Where I work there's a main application (not an iframe) with a menu that opens different applications, and these are inside iframes (mostly one at a time...)

So I would have to query the main app and the app inside the iframe.

Regarding that API, it seems good to me... As it even enables multiple iframes and so. Good work ;)

Is it expectable to have a new release with this?

Thanks.

@jrolfs jrolfs added the enhancement New feature or request label May 1, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants