Playwright Tutorial: Handling Multiple Tabs using Page Object Model

How to work with multiple Tabs (Pages) in playwright integrating Page Object model into your solution.

Page Object Model video:

Multi-tabbing video:

[davidplews]

Thank you so much. Really awesome and very useful for my particular use case. Much appreciated indeed.

Thank you for the great video. I have a question, is it possible to override the fixture page with the tab page? Because I have like ten more pages that I needs to import a initialize. Otherwise, the first tab I do not need anymore.

[char-frs]

Great content, do you have any idea if it would be possible to open the new tab with a different storage state? For example, I'm logged in to Google, then click an Amazon link that opens in a new tab I'd like the Amazon tab to load with a signed-in state, but don't know how/if it is possible.

[olenamaidenko]

thank you! And I have a question. My test checks "Download file" action. Actually, all files do not have to be downloaded, the browser just opens them in a new tab (only those files that browsers can display are stored there). How can I close an automatically opened browser tab and go to the previous tab?

[olesnikaniuk]

Great guide. What do you think, is there any way to make interactions with second tab using fixtures, just to avoid declarations of the page instances for each test?

[petrlomic]

Thank you for your guides. I have a question regarding a scenario where the new tab is opened after some action on the first page, not directly from context.newPage() statement. I have solved it by adding the context object to the page object and creating a promise waitForEvent('page') in the page object method, but I am not sure if that is the correct approach.