FAQs under this topic:
29. What are tips to work with shadow-root elements?
30. How to close the print dialog box while running the test?
31. Why does Microsoft Authenticator show different landing pages?
32. How to allow popup Download Multiple Files in Chrome?
This is the second part of Automation Testing Solutions. See Part 1 here.
There’s a useful tip to locate any kind of element which is under a shadow DOM with a CSS locator. In order to use a custom CSS locator, you have to add a new attribute named “css” to the Object’s Properties table and activate it.
The condition must be “equals” and the value is a CSS selector string that points to the target element. If you are new to the CSS locator, you can refer to this document for more details CSS Selectors Reference
Please note that in order to use a custom CSS locator, you have to add a new attribute named “css” to the Object’s Properties table and activate it. The Condition must be “equals” and Value is a CSS selector string that points to the target element. If you are new to the CSS locator, you can refer to this document for more details CSS Selectors Reference.
- decrease the “wait for element timeout” in the project settings. However, it could affect other steps too, so try to keep it not too short.
Below is an example to work with shadow DOM elements:
- Access to https://www.ti.com,
- Click on “Ship to” dropdown
- Input a country text
- Select the country after search
- How to identify the objects onin the web page:
We have the following objects to interact with: “Ship To” dropdown, Search box, the returned country option on the Country menu.
When inspecting the elements, we see that these elements are under #shadow-root. Therefore, we named them as follows:
Each element is labeled as Ax_y in which
- x: the order of the element
- y: the parent order
- A1: is the shadow root parent
- A2_1: the “Ship To” dropdown. A2_1 means it is a child under the shadow-root A1.
- A3_1: is also a child under shadow-root A1, but it will be Shadow Root Parent of other element A4
- A4_3: the Search box. A4_3 means it is a child under the shadow-root A3.
A5_1: the returned after search country option on the country menu. A5_1 means it is a child under the shadow-root A1
- Create the objects in KS:
To let KS recognize shadow elements, you need to add an attribute name CSS for the element as below:
You can refer to this document for more details CSS Selectors Reference
- Create a script
- Set time out for the waiting element to a short time such as 3 seconds only to keep KS avoid waiting for the shadow element too long
- Run the script
Here is the project sample:
Unable to close the print dialog box when running the test:
Step 1: From the Project → Settings → Self-healing → WebUI → Enable Self-healing execution with the option “Image” is checked.
Step 2: Capture a screenshot of the element and reduce the image size to 50%. Please refer to this video for more details.
Step 3: Click on the element twice - one for focusing and one for performing the action.
The user has a test script that includes Microsoft authentication steps, other team members run the script and it shows different landing pages as below, that leads the test case to be failed:
- Sign in screen (expected landing page)
- Pick an account
- Verify your identity
This is the expected behavior of Microsoft authentication when launching the normal browser to execute the test. Thus, the best practice for your case is that using a private mode to execute the test, it will help to clear the environment, credentials and show the expected log-in page to input the username and password field. Besides, we may need to add some delay seconds before and after the failed test step so that the page can have enough time to load the element that needs to interact.
Please refer to this documentation to start browsers in private mode: Start browsers in private mode
The user tried to run a test and the popup asking to allow Download Multiple Files cannot be turned off
Use Desire Capability in Project → Settings → Desired Capabilities → WebUI → Chrome:
prefs:-> profile.default_content_setting_values.automatic_downloads : 1.0desi
Katalon Community technical FAQs are about common customer technical issues when using Katalon products. We filter these on our Helpdesk Portal 1 twice every month to help Forum users get an easy approach to the solutions to similar problems.
If you’re paid customers, you can easily submit a ticket to our dedicated Support team.
Want to recommend a topic? - Leave your feedback HERE!