Compose Method
To compose several actions into a single method, declare them in a compose array. They execute in the order they're declared.
The loginForm page object composes three actions into a login() method.
- Clear and set a username.
- Clear and set a password.
- Click the Log In button.
First, model the basic elements the way you would in any page object.
Because our form is inside a web component, we enclose the elements in a shadow object. Don't forget to set the correct type for each basic element so that it can access basic actions in test code. User input fields are editable, and the button is clickable. We set "public": true to get the element and assert its value, but it isn't required to compose a method.
Next, declare a methods array at the root of the page object.
Within methods, declare an object with name and compose properties. The name becomes the name of the method. The value isn't transformed into a getter. If the name is login, the test calls login().
Add each action as an object in a compose array. Each object must have an element property and an apply property. The value of element must match the value of the basic element's name property. The value of apply is the method that operates on the element.
For a basic element, apply can be any basic action that the element supports. In the loginForm page object, we apply clearAndType to both input elements. To pass parameters to an applied method, declare an args array. Each element in an args array must have a name and type property.
Tip: For a custom element, the value of apply can be any of its public methods.
Call the compose method from the page object root. Our test code calls the compose method, login(), from loginFormRoot. The actions execute in the sequence declared in the page object.
Click Run Test.