1. Useful links: 1.1 (for beginners) JavaScript Classes javascript.info/class - the best way to understand classes in JavaScript is to write one and play with it. 1.2. (for beginners) Playwright official docs - Page Object Pattern playwright.dev/docs/pom 1.3. (for experienced) Private Class methods in Typescript vs. # in JavaScript. stackoverflow.com/a/59641565 1.4. (for experienced) OOP - Class Composition vs. Class Inheritance. 2. (for all) I haven’t covered this on the video, but I’ve updated the “baseUrl” in playwright.config.ts and now I can navigate to the page using “page.goto(‘contact’)” instead of specifying the full url. playwright.dev/docs/test-use-options#basic-options github.com/IlarionHalushka/advanced-playwright-course/commit/6dc2667b38c806038dcf138afa6253853e7c1c83 3. (for all) Examples of Page Objects from a real project github.com/revrepo/revsw-portal/tree/master/test/ui/page_objects . Even though the code style of these Page Objects is outdated, it’s still worth reviewing. This is similar to what you’ll find on real projects. Reading someone else’s code is a very valuable skill.
You can find the code from this Lesson in the following commits github.com/IlarionHalushka/advanced-playwright-course/commits/main/ "tests: add fur store tests with page objects, page components" "feat: add page objects" "feat: add page components"
As i know - the POM design pattern is the main patter which uses AQA industry (composition or inheritance are two different approaches in POM) and actually it is impossible to avoid it in big and complex projects. It is a bit confusing to hear that it is one form the approaches but not the core / main concept??? May be I misunderstood you. Anyway big thanx for the great explanation - keep going pls.)
thanks for lessons! May I ask a question regarding 'await'. why it is passes when I don't put it before string "expect(footerText).toEqual(expect.stringContaining(year));'. When I can do not put 'await'?
Как насчет использовать хук before(each / all) для создания нового экземпляра вместо создания их в каждом тесте (когда на одну спеку приходится несколько тестов) Насчет сложности я бы добавил что это сложнее на маленьких проектах, при большом приложении- становится гораздо проще ориентироваться среди модулей, в сравнении с «кашей». Не говоря о ситуациях где несколько разных приложений с общими модулями.
Thanks. Actually, I've used beforeEach, beforeAll hooks, please check folder "fur-store-lesson-11-page-object-page-component": github.com/IlarionHalushka/advanced-playwright-course/tree/main/tests/fur-store-lesson-11-page-object-page-component 100% agreee - the bigger and more stable the project is the more sense it makes to use POM. But sometimes people overcomplicate the POM and build a test framework monster which is hard to understand for the newcomers. Always depends on the context. Thank you for the addition!!
@@MaheshJoshi_wellington you can find the examples in "pages" and "components" folders: github.com/IlarionHalushka/advanced-playwright-course/tree/main/pages github.com/IlarionHalushka/advanced-playwright-course/tree/main/components
Выходит, я не правильно пом делал, когда в конструкторе находил все элементы локаторы, выносил их в переменные, а потом в тесте их использовал, через геттеры? Нужно было давать больше абстракции?
There is no right or wrong here, I would say that it's just a code style that you prefer. But by default POM Pattern serves not just as locator storage. To be honest, sometimes I prefer not to use the Page Object, Page Component in end-to-end tests. I prefer copy-pasting tests and doing find+replace across the project for locators. As I've mentioned in the video, POM adds complexity to the tests. p.s. imho getters are not needed for POM, accessing class properties directly is fine.
1. Useful links:
1.1 (for beginners) JavaScript Classes javascript.info/class - the best way to understand classes in JavaScript is to write one and play with it.
1.2. (for beginners) Playwright official docs - Page Object Pattern playwright.dev/docs/pom
1.3. (for experienced) Private Class methods in Typescript vs. # in JavaScript. stackoverflow.com/a/59641565
1.4. (for experienced) OOP - Class Composition vs. Class Inheritance.
2. (for all) I haven’t covered this on the video, but I’ve updated the “baseUrl” in playwright.config.ts and now I can navigate to the page using “page.goto(‘contact’)” instead of specifying the full url. playwright.dev/docs/test-use-options#basic-options github.com/IlarionHalushka/advanced-playwright-course/commit/6dc2667b38c806038dcf138afa6253853e7c1c83
3. (for all) Examples of Page Objects from a real project github.com/revrepo/revsw-portal/tree/master/test/ui/page_objects . Even though the code style of these Page Objects is outdated, it’s still worth reviewing. This is similar to what you’ll find on real projects. Reading someone else’s code is a very valuable skill.
Thank you very much!! It was the most difficult video. And now I have to rewrite all my own tests with POM pattern 😰
You can find the code from this Lesson in the following commits github.com/IlarionHalushka/advanced-playwright-course/commits/main/
"tests: add fur store tests with page objects, page components"
"feat: add page objects"
"feat: add page components"
As i know - the POM design pattern is the main patter which uses AQA industry (composition or inheritance are two different approaches in POM) and actually it is impossible to avoid it in big and complex projects. It is a bit confusing to hear that it is one form the approaches but not the core / main concept??? May be I misunderstood you. Anyway big thanx for the great explanation - keep going pls.)
How does VScode autocomplete the entire block of code? Mine only autocompletes the current word. Special extension?
thanks for lessons! May I ask a question regarding 'await'. why it is passes when I don't put it before string "expect(footerText).toEqual(expect.stringContaining(year));'. When I can do not put 'await'?
Как насчет использовать хук before(each / all) для создания нового экземпляра вместо создания их в каждом тесте (когда на одну спеку приходится несколько тестов)
Насчет сложности я бы добавил что это сложнее на маленьких проектах, при большом приложении- становится гораздо проще ориентироваться среди модулей, в сравнении с «кашей». Не говоря о ситуациях где несколько разных приложений с общими модулями.
Thanks. Actually, I've used beforeEach, beforeAll hooks, please check folder "fur-store-lesson-11-page-object-page-component":
github.com/IlarionHalushka/advanced-playwright-course/tree/main/tests/fur-store-lesson-11-page-object-page-component
100% agreee - the bigger and more stable the project is the more sense it makes to use POM. But sometimes people overcomplicate the POM and build a test framework monster which is hard to understand for the newcomers. Always depends on the context.
Thank you for the addition!!
why do we need two times specify 'await'? in the function itself and in the test?
Thanks. That's very useful, Illarion
thanks a lot!
It seems so simple and logical, but when I imagine how much work it involves … 😅
how much work it involves?
- create a Page Object and then Ctrl+C Ctrl+V :)
Иларион обязательно ли нужен хороший ноутбук с 16 гб оперативки или пойдет простой?
good question, for comfortable automation 8 gb would be enough.
VS code
and preferably SSD, not HDD
If you follow this page object model and use typescript as programming for playwright would be similar ?
thanks for the question
not sure if I understood the question correctly but POM is the same no matter which language or test framework you are using
@@IlarionHalushka Thank you I mean using typescript for playwright
@@MaheshJoshi_wellington
you can find the examples in "pages" and "components" folders:
github.com/IlarionHalushka/advanced-playwright-course/tree/main/pages
github.com/IlarionHalushka/advanced-playwright-course/tree/main/components
Thank you
@@IlarionHalushkathank you eagerly waiting for Saturday 😊
Выходит, я не правильно пом делал, когда в конструкторе находил все элементы локаторы, выносил их в переменные, а потом в тесте их использовал, через геттеры? Нужно было давать больше абстракции?
There is no right or wrong here, I would say that it's just a code style that you prefer. But by default POM Pattern serves not just as locator storage.
To be honest, sometimes I prefer not to use the Page Object, Page Component in end-to-end tests. I prefer copy-pasting tests and doing find+replace across the project for locators. As I've mentioned in the video, POM adds complexity to the tests.
p.s. imho getters are not needed for POM, accessing class properties directly is fine.
were you writing tests in java before js/ts?
just curious because not many people in js/ts world use getters :)
@@IlarionHalushka Так я и сейчас пишу в java) Плейрайт и для нее существует. Но видосы твои смотрю и впитываю, тошо они кладезь умной и полезной инфы.
🤜 @@OleksiiVasylenko-r1j
Amazing thank you 👌🏻
thank you!!
После 5-ти часового видео о плэйрайте в джаве от индуса, не могу не заметить, что инглиш у афтара сильно лучше😅
🫡🫡 thanks)
❤❤❤🎉🎉🎉
🤗 🤗 🤗