Playwright with TS - Create Custom Fixtures

[@sakshirana7881]

Followed the complete Playlist, U have done a great job sir, Thanks a lot!

[@naveen190685]

Short and crisp... Thank you

[@mahensphotography]

Excellent explanation !! Thanks for sharing !

[@ripperx444]

Finally a good video that explains it all!!
In your test there is a page fixture and your own fixture that's passed in. What happens if you have a persistent context and you want all your tests to use the context.page[0] from a fixture that changes the default context behavior.
Can you have one fixture that is composed
Extend....
Context:
Use(context)
Page:
Use (context.page)
Theh in text pass this page ?

[@lamvanbao4774]

very good looking forward to a new part

[@mr.hgorgan1812]

on point, thank you!

[@polyconhousewares1187]

Fixture is not working for me :( How can I solve it??
Error: Requiring @playwright/test second time,

[@QaAutomationAlchemist]

You are using two times playwright library in repo. Check node modules folder, it may be present twice

[@QaAutomationAlchemist]

If you encounter an error when requiring `@playwright/test` twice in your project, it's likely due to a conflict or duplication in the module loading process. Here's how you can troubleshoot and resolve this issue:
1. **Check Module Loading**: Ensure that you're requiring `@playwright/test` only once in your project. Look through your codebase, including all dependencies and test files, to identify any duplicate imports or requires.
2. **Review Package.json**: Check your `package.json` file to see if `@playwright/test` is listed as a dependency or devDependency more than once. If so, remove the duplicate entry and ensure that there's only one instance of `@playwright/test` listed.
3. **Check Node Modules**: Inspect your `node_modules` directory to see if there are multiple instances of the `@playwright/test` module installed. If so, it may indicate that different packages within your project have conflicting dependencies or are using different versions of `@playwright/test`.
4. **Update Dependencies**: Ensure that all dependencies in your project, including `@playwright/test`, are up-to-date. Running `npm update` or `npm outdated` can help identify outdated packages that may be causing conflicts.
5. **Resolve Dependency Conflicts**: If there are conflicting dependencies or versions in your project, you may need to manually resolve them by updating package versions or installing compatible versions of dependencies.
6. **Clear Node Cache**: Sometimes, clearing the Node.js module cache can help resolve issues with duplicate module loading. You can do this by running `npm cache clean --force` or deleting the `node_modules` directory and reinstalling dependencies (`npm install`).
7. **Restart Environment**: After making any changes to your project files or dependencies, restart your development environment (e.g., IDE, terminal, test runner) to ensure that the changes take effect.
By following these steps and carefully inspecting your project setup, you should be able to identify and resolve any issues related to requiring `@playwright/test` twice in your project. If you continue to encounter problems, consider seeking assistance from the Playwright community or checking for known issues in the Playwright GitHub repository or documentation.

[@iburahim786]

How to use the same page instance entire test? mine every test page is closing and opening. Kindly suggest how to handle single page instances like login and use this page instance for subsequent tests without closing the browser. If possible please make some videos and share.

[@QaAutomationAlchemist]

Thanks for your question.
Tests should be atomic nature, means any test should be able to run alone. If you need e2e test, please use POM and try to use reusable methods ( with business level) like addToCart(item) in POM.

[@iburahim786]

@@QaAutomationAlchemist I tried reusable methods using page fixtures and that always closing browser on every test. I am not sure how that will helpful when its more than 300+ test cases. Running time might be increase because of this nature.

[@QaAutomationAlchemist]

@@iburahim786 In Playwright, if you want to prevent the browser from closing at the end of a test fixture (e.g., after running all the tests in a fixture), you can do this by configuring the fixture with the `preserveOutput` option. This option tells Playwright to keep the browser instance alive after the fixture finishes. Here's how you can use it:
```javascript
const { test, expect, fixtures } = require('@playwright/test');
fixtures.fixture('').runWith({ preserveOutput: true });
test('Your Test Case', async ({ fixtureName, page }) => {
// Your test code here
await page.goto('example.com');
// Additional test steps
});
```
By setting `preserveOutput: true`, the browser will not be closed automatically when the test fixture completes. This is particularly useful if you want to share the same browser instance among multiple test cases within a fixture.
Be cautious when using this approach, as it may lead to resource leaks if the browser instances are not properly closed at some point. You should manually close the browser instance when you're done with it, typically in an `afterEach` or `afterAll` hook, depending on your test structure:
```javascript
const { test, expect, fixtures } = require('@playwright/test');
fixtures.fixture('').runWith({ preserveOutput: true });
test('Your Test Case', async ({ fixtureName, page }) => {
// Your test code here
await page.goto('example.com');
// Additional test steps
});
afterAll(async () => {
// Close the browser instance to avoid resource leaks
await browser.close();
});
```
Make sure to handle browser cleanup properly when using `preserveOutput` to maintain a clean testing environment.

[@QaAutomationAlchemist]

@@iburahim786 playwright.dev/python/docs/auth
This explains how to reuse sign in state to avoid multiple login steps

[@mahensphotography]

@@QaAutomationAlchemist Can you make a small video on this.Explanation from you is really awesome! Looking forward !!