Chào các bạn. Hôm nay, chúng ta sẽ tiếp tục thảo luận về chủ đề Scroll To Element trong Katalon. Thế tại sao chúng ta cần phải scroll to element trong automation?
Trong automation, chắc chắn bạn sẽ dùng các hàm Scroll để thực hiện các action. Nếu bạn không dùng scroll, có thể sẽ dẫn đến việc test case bị failed. Lý do là element đó nằm ngoài giới hạn của màn hình, dẫn đến việc nó ko thấy element đó để thực hiện action.
Ví dụ như hình sau, mình có form đăng ký và button Register. Form đăng ký có rất nhiều fields, và button Register sẽ nằm ở cuối page. Lúc này, nếu mình ko scroll xuống, thì sẽ ko thấy button Register, dẫn đến việc button sẽ không click được.
Mình sẽ giới thiệu 1 vài keywords dùng để scroll trong Katalon như bên dưới:
Nội dung
1. [WebUI] Scroll To Element
Keywork này dùng để scroll to element được chỉ định:
Ví dụ: scroll to the position where ‘Make Appointment’ button is exist.
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
import internal.GlobalVariable as GlobalVariable
'Open browser and navigate to demo AUT site.'
WebUI.openBrowser(GlobalVariable.G_SiteURL)
'Scroll to \'Book Appointment\' button'
WebUI.scrollToElement(findTestObject('Page_CuraHomepage/btn_MakeAppointment'), 3)
'Close browser'
WebUI.closeBrowser()2. Using javascript to scroll
Ngoài cách trên, mình có thể dùng java script để scroll to element
Lưu ý: hạn chế dùng javascript trong automation. Với real user, họ chỉ action trên UI mà ko test bằng javascript
Ví dụ 1: Scroll to Element
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject
import org.openqa.selenium.WebElement
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webui.common.WebUiCommonHelper
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
'Open browser'
WebUI.openBrowser('https://getbootstrap.com/docs/5.0/forms/select/')
"Get Test Object"
TestObject testObject = findTestObject('Object Repository/Buoi9/Default_DropDown/ddl_MultiSelect')
"Convert testobject to element"
WebElement element = WebUiCommonHelper.findWebElement(testObject, 30)
"Scroll to element"
WebUI.executeJavaScript("arguments[0].scrollIntoView(true);", Arrays.asList(element))Ví dụ 2: Scroll to Element để cho element đó nằm ở chính giữa màn hình
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject
import org.openqa.selenium.WebElement
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webui.common.WebUiCommonHelper
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
'Open browser'
WebUI.openBrowser('https://getbootstrap.com/docs/5.0/forms/select/')
"Get Test Object"
TestObject testObject = findTestObject('Object Repository/Buoi9/Default_DropDown/ddl_MultiSelect')
"Convert testobject to element"
WebElement element = WebUiCommonHelper.findWebElement(testObject, 30)
"Scroll to element to middle page"
WebUI.executeJavaScript("arguments[0].scrollIntoView({block: 'center'});", Arrays.asList(element))Ví dụ 3: Scroll to bottom of page
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject
import org.openqa.selenium.WebElement
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webui.common.WebUiCommonHelper
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
'Open browser'
WebUI.openBrowser('https://getbootstrap.com/docs/5.0/forms/select/')
"Get Test Object"
TestObject testObject = findTestObject('Object Repository/Buoi9/Default_DropDown/ddl_MultiSelect')
"Convert testobject to element"
WebElement element = WebUiCommonHelper.findWebElement(testObject, 30)
"Scroll to bottom of page"
WebUI.executeJavaScript("window.scrollBy(0,document.body.scrollHeight)", null)Ví dụ 4: Scroll to top of page
import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject
import org.openqa.selenium.WebElement
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webui.common.WebUiCommonHelper
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
'Open browser'
WebUI.openBrowser('https://getbootstrap.com/docs/5.0/forms/select/')
"Get Test Object"
TestObject testObject = findTestObject('Object Repository/Buoi9/Default_DropDown/ddl_MultiSelect')
"Convert testobject to element"
WebElement element = WebUiCommonHelper.findWebElement(testObject, 30)
"Scroll to top of page"
WebUI.executeJavaScript("window.scrollBy(0, -document.body.scrollHeight)", null)3. Kết
Như vậy chúng ta đã tìm hiểu qua cách sử dụng scroll trong Katalon. Cảm ơn các bạn đã theo dõi bài viết của mình. Chúc các bạn thành công. Hẹn gặp lại các bạn ở những chủ đề tiếp theo. Bái bai.