Page Objects Helper | Bondar Academy

Lesson Summary

In this lesson, we explore a useful design pattern for page object design that can help manage shared components across multiple pages in an application. This approach is particularly beneficial when dealing with elements that do not belong to a specific page, such as a toaster notification . Key Concepts Helper Base Class: Instead of copy-pasting code to interact with shared components, create a single helper-base.ts class that contains reusable methods. Method Definition: Define a method, such as asyncGetToasterMessage , in the helper base to handle interactions with the toaster. Extending Classes: Each page object can extend the helper-base class, allowing access to its methods without duplication. Implementation Steps Create the helper-base.ts class and define the necessary methods. In each page object, extend the helper-base class and modify the constructor to use super(page) . Change access modifiers from private to protected for properties in the helper base to ensure they are only accessible by extending classes. Best Practices Keep the helper base class lean and focused only on methods that are highly reusable. Avoid overloading the helper base with unrelated functions; use separate helper functions for tasks like generating test data. Only introduce a helper base when you notice significant code duplication across page objects. By following these guidelines, you can effectively manage your framework and maintain clean, organized code. This approach not only enhances reusability but also simplifies maintenance.