Test the accessibility in a Perfecto desktop browser
This article explains how to use the sample Java utility to test the accessibility in a Perfecto desktop browser.
- Log in to your Perfecto cloud and open the browser in the Manual Testing view.
-
Launch your web application in a desktop Windows browser (Chrome, FireFox, Edge, or Internet Explorer) and navigate to the page you want to test. Ensure the Session Sharing checkbox is enabled.
- In the open browser session, click the copy icon .
-
In the Copy session ID dialog box, click Copy to clipboard.
- In the Java utility, provide the following required details:
- Perfecto Cloud URL: Your cloud URL, for example https://demo.app.perfectomobile.com
User Security Token: Your security token for the Perfecto cloud
To generate a security tokenIn the Perfecto UI at <YourCloud>.app.perfectomobile.com (where YourCloud is your actual cloud name, such as mobilecloud), click your user name and select My security token.
In the My security token form, click Generate Security Token.
Click Copy to clipboard. Then paste it into any scripts that you want to run with Perfecto.
- Click Close.
From the list, select Browser.
To have the utility create a screenshot for each violation that occurs, select the CaptureFailedScreenshot checkbox.
Depending on the number of violations, this may increase the time it takes to generate the report.
Device Session ID: The session ID as copied from the browser in the Perfecto cloud
For more information, see Share a desktop web session with an IDE script.
- Output Folder: The local folder where you want store accessibility reports
Proxy: Select if you need to connect through a proxy to enable the Proxy Host and Proxy Port fields. Then provide the required information.
If your proxy requires credentials, provide them in the User Name and Password fields.
-
Click Run, and then click OK. The utility now runs the script in the background to generate the report.
A progress bar indicates the progress of the execution. In the following image, the opened browser instance shows Axe highlights.
-
Repeat step 5 for each screen you want to test. Make sure to update the Current Screen Name field each time.
Note:With session sharing, accessibility reports will be generated only after closing the browser. You can navigate to the different pages, run accessibility tests with unique screen names, and generate reports when the execution has finished for all pages.
- To generate the accessibility report:
- Close the opened browser.
- Click Generate Report to download the accessibility report.
To confirm that the device is closed, click Yes.
The Java utility automatically downloads the accessibility reports with the values provided in the Current Screen Name field into the given output directory. When the report generation is complete, a confirmation message displays.
-
Navigate to the output folder. For each app screen tested, the folder includes a relevant report.
Each subfolder contains:- The
PerfectoReport.txt
file, which includes a link to the Single Test Report in the Perfecto UI, where you can also download the Assertions report - The
WebAccessibilityReport.pdf
file, also called the Perfecto Assertion report, which includes all assertions -
The
violations.txt
file, which consolidates all violations
- The
-
To download the accessibility report from Perfecto Smart Reporting, navigate to the link included in the
PerfectoReport.txt
file.The following images show a single test report (STR) and consolidated executions in the Report Library.
Sample report
Following is an extract from the sample Axe accessibility report of the Web Expense Tracker Login page with interpretations for Android and iOS, created using the Axe option. The Violations.txt
file created for each execution includes the link to the STR in the Perfecto Report Library along with consolidated validations.
The result interpretation is the same for the Perfecto and Axe options.
Error 1
Impact: critical; Rule ID: image-alt
; Summary: Fix any of the following:
Element does not have an alt attribute
aria-label attribute does not exist or is empty
aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
Element has no title attribute or the title attribute is empty
Element's default semantics were not overridden with role="presentation" Element's default semantics were not overridden with role="none"; Selector: .ion-color-primary.ion-color[color="primary"] > img
HTML: <img _ngcontent-c1="" height="45" src="assets/images/perfecto-logo.png">Error 2
Impact: moderate; Rule ID: landmark-one-main
; Summary: Fix all of the following:
Document does not have a main landmark
; Selector: html
HTML: <html lang="en" class="plt-android plt-phablet plt-mobile md" mode="md">
For information on Axe accessibility rules regarding the reported violations, see this List of Axe 4.1 Rules.