Hi Katalon Community,
I have created a script with a for loop to navigate to some pages stored in a data file (3 pages right now, it can vary), take full page screenshot and save it with the page name + timestamp + file extension. The thing is that two folders are created with the URL of the first page as name and the three files inside it, but the screenshot name of that page, only contains the timestamp and extension.
The code I’m using is the below
def testData = findTestData('SiteURLs')
def rowCount = testData.getRowNumbers()
WebUI.callTestCase(findTestCase('Site/Site login'), [:], FailureHandling.STOP_ON_FAILURE)
WebUI.delay(10)
for (int rowIndex = 1; rowIndex <= rowCount; rowIndex++) {
def url = testData.getValue(1, rowIndex)
WebUI.navigateToUrl(url)
WebUI.enableSmartWait()
def timestamp = new Date().format('yyyyMMdd_HHmmss')
String screenshotName = '/Users/user/Desktop/Screenshot_' + '_' + url + '_' + timestamp + '.png'
WebUI.takeFullPageScreenshot(screenshotName)
WebUI.disableSmartWait()
}
WebUI.callTestCase(findTestCase('Site/Site Close Browser'), [:], FailureHandling.CONTINUE_ON_FAILURE)
Attached is a screenshot of what is being created
I only want the three screenshots to be saved in the desktop with the correct name.
Any help would be appreciated,
Thanks,
Ruben B
1 Like
I am afraid, this is a poor idea.
Let me assume
- the
url variable has value of https://forum.katalon.com/t/how-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp/93884
- the variable
timestamp has value of 20230816_095240
Then the screenshotName variable will have a value
/Users/user/Desctop/Screenshot__https://forum.katalon.com/t/how-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp/93884_20230816_095240.png
Please note that all of slash characters / in the screenshotName variable will be interpreted as the File Path Separator of OS file tree. You should change your design.
Easiest alternative will be changing the variable url to a string literal like PAGE1
`String screenshotName = '/Users/user/Desktop/Screenshot_' + '_' + 'PAGE1' + '_' + timestamp + '.png'`
This design looks silly. But it works.
I guess that the Katalon’s engineer who designed “WebUI.takeFullPageScreenshot()” keyword implicitly assumed that users will name their output PNG files with a string literal like PAGE1.
I guess that the designer didn’t imagin your idea to have the URL information associated with a screenshot image file.
1 Like
If you want to use the URL information engraved in the file path, then you can translate the / characters into other string which is acceptable as a path component (not a File Separator).
You can use URLEncoder class of Java to translate / to %2F. For example,
https://forum.katalon.com/t/how-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp/93884/2
will be encoded into a string
https%3A%2F%2Fforum.katalon.com%2Ft%2Fhow-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp%2F93884%2F2
This encoded string contains no slash characters /. Therefore it can be a valid file path.
This looks OK, doesn’t it?
1 Like
The string “https%3A%2F%2Fforum.katalon.com%2Ft%2Fhow-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp%2F93884%2F2” has a length of 121 characters.
A URL string could be very long. A URL string with param=value pairs would be much longer than you would expect. The encoded URL string could be even longer. It could be as long as 256.
Ultimately you want to construct a path of a screenshot file on the OS file system.
I would remind you that Windows OS has, as default, a limitation. Any full path of a file must be shorter than 256 characters. See the following description by Miscrosoft:
Therefore, your code may fail to write a screenshot file if the origin URL is lengthy. This limit is quite troublesome.
Again, I would tell you, it is a poor idea to engrave URL information as a part of screenshot file path. You should change your design.
Years ago, I wanted to save a screenshot PNG file while associating the origin URL information with the PNG file.
I invented a solution for my own use. I would just let you know the pointer to the documentation of my library “materialstore”:
https://kazurayam.github.io/materialstore-tutorial/#2nd-example-write-a-material-with-associated-metadata
Unfortunately this library is not easy for others to understand and reuse. I could not design it any easier than as is.
Here I inform you of my materialstore library just to show you how difficult it is to implement a useful resolution of the idea (associating a screenshot and the origin URL).
Thanks for all the information and the alternative solutions you shared @kazurayam !
I took a different route, I added a new column to the data test file, added the names I wanted for each and took the value from there.
def testData = findTestData('SiteURLs')
WebUI.callTestCase(findTestCase('Site/Insider login'), [:], FailureHandling.STOP_ON_FAILURE)
WebUI.delay(10)
for (int rowIndex = 1; rowIndex <= testData.getRowNumbers(); rowIndex++) {
String url = testData.getValue(1, rowIndex)
String name = testData.getValue(2, rowIndex)
String timestamp = new Date().format('yyyyMMdd_HHmmss')
WebUI.navigateToUrl(url)
WebUI.enableSmartWait()
String screenshotName = '/Users/user/desktop/Screenshot_' + name + '_' + timestamp + '.png'
WebUI.takeFullPageScreenshot(screenshotName)
WebUI.disableSmartWait()
Let me show you a bit of twist.
My test case
// save screenshot into folder tree derived from the origin URL
import java.nio.file.Files
import java.nio.file.Path
import java.nio.file.Paths
import java.time.LocalDateTime
import java.time.format.DateTimeFormatter
import com.kms.katalon.core.configuration.RunConfiguration
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
String urlStr = "https://forum.katalon.com/t/how-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp/93884?param1=value1¶m2=value2"
URL url = new URL(urlStr)
println "url.protocol = ${url.protocol}"
println "url.host = ${url.host}"
println "url.port = ${url.port}"
println "url.path = ${url.path}"
println "url.query = ${url.query}"
String encodedPath = URLEncoder.encode(url.path, "utf-8")
println "encodedPath = ${encodedPath}"
DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyyMMdd_HHmmss")
LocalDateTime dateTime = LocalDateTime.now()
String timestamp = dateTime.format(formatter)
Path projectDir = Paths.get(RunConfiguration.getProjectDir())
Path screenshotsDir = projectDir.resolve("screenshots")
Files.createDirectories(screenshotsDir)
Path img = screenshotsDir.resolve(url.host)
.resolve(encodedPath)
.resolve(timestamp)
.resolve(url.query + ".png")
Files.createDirectories(img.getParent())
WebUI.openBrowser(urlStr)
WebUI.takeFullPageScreenshot(img.toString())
WebUI.closeBrowser()
Output to the console:
2023-08-18 13:31:09.408 INFO c.k.katalon.core.main.TestCaseExecutor - START Test Cases/saveScreenshotIntoFolderTreeDevivedFromTheOriginURL
url.protocol = https
url.host = forum.katalon.com
url.port = -1
url.path = /t/how-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp/93884
url.query = param1=value1¶m2=value2
encodedPath = %2Ft%2Fhow-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp%2F93884
This code demonstrates how java.net.URL(String urlString) parses a string as URL into a set of syntactical components: protocol, host, port, path, query. Once the given URL is transformed into strings, then you can construct a file path of screenshot images reusing the URL components.
This test case produced a PNG file at the path /screenshots/forum.katalon.com/%2Ft%2Fhow-to-save-a-screenshot-takefullpagescreenshot-with-name-and-timestamp%2F93884/20230818_110347/param1=value1¶m2=value2.png:
This approach might be useful in case you have hundrends of URL to take screenshots of. Less parameters to specify manually, the better.
