How to create a Folder and save the screenshot on the folder created?

@ryan

  1. You want to take a lot of screenshots of URLs during a test case run.
  2. You have to create directories and allocate file names.
  3. You want to record good identification information of each individual screenshots so that you can remember what they were: which URL was the page? which <input> element you manipulated and set what values there? which part of the page you cut and took a screenshot of? full-page screenshot, or element-wise screenshot?
  4. Possibly you would require some kind of “viewer” of the set of stored screenshots.

I know, it is a big task to develop a software that satisfies these requirements. So I would tell you, my “Visual Inspection in Katalon Studio” project can demonstrate a fully-fledged solution for these issues.

See

Here I would quote a portion of the above post as follows:

Sample1: simply visit a URL and scrape

First example. We will write a Test Case in Katalon Studio that visits the Google Search page. We will take screenshots and HTML page sources of the Web page. We will store PNG files and HTML files into the store directory using the materialstore library. We will finally generate a HTML file in which we can view the stored files.

(1) Test Case

You want to newly create a Test Case Test Cases/main/GoogleSearch/scrapeGoogleSearch in your project. Copy and paste the following sample source:

Once you have created the Test Case, you want to run it as usual by clicking the green button run button in Katalon Studio GUI.

(2) The report generated

Once the Test Case finished, a HTML file will be created at store/scrapeGoogleSearch.html . Please open it in any web browser. It renders a view of the stored 6 files. You can see an working example here: pls. click here.

(3) The “store” directory structure

When the Test Case finished, you will find a new directory $projectDir/store is created. In there you will find a tree of directories and files, like this:

$ tree store
store
├── scrapeGoogleSearch
│   └── 20210813_221052
│       ├── index
│       └── objects
│           ├── 01014deef318115a75ac1c3ab0f9844832c81c86.html
│           ├── 02625f7607199d99ca58b803d6fe51b7c94835e7.html
│           ├── 2563a225cb7bcd438ae12a6126b2091eb8e09e7d.png
│           ├── 5c002fbe44438341d3d92832d1e004198153976b.png
│           ├── 8370ecd0081e1fb9ce8aaecb1618ee0fc16b6924.html
│           └── efaed8443417a62faf35ee9d9b858592cd67bbae.png
└── scrapeGoogleSearch.html

(4) The objects/ directory

  • Under the store/scrapeGoogleSearch/yyyyMMdd_hhmmss/objects/ directory, there are 6 files. Among them you will find 3 files with postfix png . These are the screenshot of web pages in PNG image format. Also you will find 3 files with postfix html . These are HTML sources of web pages.
  • The file name comprises with 40 hex-decimal characters appended with extension ( .png , .html ). The hex-decimal string (I call this “ID”) is derived from the file content without compression by SHA1 Secure Hash algorithm.

(5) The index file

  • The store/scrapeGoogleSearch/yyyyMMdd_hhmmss/index file would be interesting. An example of the index file is like this:
8370ecd0081e1fb9ce8aaecb1618ee0fc16b6924	html	{"URL.host":"www.google.com", "URL.path":"/", "URL.protocol":"https"}
2563a225cb7bcd438ae12a6126b2091eb8e09e7d	png	{"URL.host":"www.google.com", "URL.path":"/", "URL.protocol":"https"}
...

The index file is a plain text file. Each lines corresponds to each files stored in the objects directory.

A line of the index file has 3 parts delimited by TAB characters.

<SHA1 Hash value of each file>\t<file type>\t<metadata>

(6) The metadata

In the test Case script, the code created metadata for each objects. Typically a metadata will include information derived from the URL of the source Web Page. For example, an URL

  • http://www.google.com/

will be digested to form a metadata

  • {"URL.host":"www.google.com", "URL.path":"/", "URL.protocol":"https"}

Plus, you can add any key-value pair into the metadata as you like.

In the index file, lines are sorted by the ascending order of metadata text.

The materialstore API restricts that metadata texts in a index file MUST be unique. Your application can not create multiple objects (= multiple lines in the index file) with the same metadata value.

1 Like