Browser monitors allow you to handle quite complex scenarios when it comes to testing your application,. Sometimes you need to check in your test case if your application is producing PDF and validate the content. Luckily, there is an easy solution for that by utilizing Mozilla's PDF.js library for working with PDF files in JavaScript.
Browser monitors allow you to use JavaScript clickpath events. These events are simply pieces of JavaScript code to be executed in the browser running your browser monitors. Also the code is able to talk back to the synthetic engine using the JavaScript Event API.
In the following "almost self-explaining" 😁 code example below we will:
- Start an asynchronous execution and tell the synthetic engine to wait for the results.
- Load the PDF.js library in the browser.
- Get the link to the PDF from the currently opened application page.
- Load the PDF by PDF.js library.
- Open the first page.
- And finally validate if the page contains expected content.
- We mark the step as failed when something goes bad of course 😀.
api.startAsyncSyntheticEvent();
// Insert PDFJS Library into browser window
var pdfjsTag = document.createElement('script');
pdfjsTag.setAttribute('src', '//mozilla.github.io/pdf.js/build/pdf.mjs');
pdfjsTag.setAttribute('type', 'module');
pdfjsTag.setAttribute('id', 'pdfjslib');
document.head.appendChild(pdfjsTag);
// Wait until the PDFJS library is loaded
pdfjsTag.addEventListener('load', function() {
api.info("PDFJS - Library loaded");
// Get link to PDF document from the page
var url = document.getElementById('pdflink').getAttribute('href');
api.info("PDFJS - Downloading pdf document from " + url);
var pdfjsLib = window['pdfjs-dist/build/pdf'];
pdfjsLib.GlobalWorkerOptions.workersrc='//mozilla.github.io/pdf.js/build/pdf.worker.mjs';
var loadingTask = pdfjsLib.getDocument(url);
loadingTask.promise.then(function(pdf) {
api.info('PDFJS - PDF file loaded');
// Fetch the first page
var pageNumber = 1;
pdf.getPage(pageNumber).then(function(page) {
api.info('PDFJS - Loaded page ' + pageNumber);
page.getTextContent().then(function(textContent) {
var textItems = textContent.items;
var finalString = "";
// Concatenate the string of the item to the final string
for (var i = 0; i < textItems.length; i++) {
var item = textItems[i];
finalString += item.str + " ";
}
api.info('PDFJS - Page text:' + finalString);
// Check if text is present in the PDF page
if (finalString.includes("Hello")) {
api.finish();
} else {
api.fail("Validation error - Text not present in PDF");
}
});
});
}, function(reason) {
// PDF loading error
console.error("Could not open PDF", reason);
api.fail("Could not open PDF (" + reason + ")");
});
});
If you run the test locally, you can see the information messages easily in your browser, which is useful for further troubleshooting and fine-tuning your test scenario:
Event 4
------------------------------------------------------------------------------------
2022-09-19 10:32:56 INFO PDFJS - Library loaded
2022-09-19 10:32:56 INFO PDFJS - Downloading pdf document from https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/examples/learning/helloworld.pdf
2022-09-19 10:32:56 INFO PDFJS - PDF file loaded
2022-09-19 10:32:56 INFO PDFJS - Loaded page 1
2022-09-19 10:32:56 INFO PDFJS - Page text:Hello, world!
Happy PDF validation!
Certified Dynatrace Master | Alanata a.s., Slovakia, Dynatrace Master Partner
