{"id":802,"date":"2021-12-14T14:43:39","date_gmt":"2021-12-14T14:43:39","guid":{"rendered":"\/blog\/?p=218"},"modified":"2025-06-12T18:17:24","modified_gmt":"2025-06-12T18:17:24","slug":"evinced-selenium-sdk-sauce-labs","status":"publish","type":"post","link":"https:\/\/www.evinced.com\/blog\/evinced-selenium-sdk-sauce-labs\/","title":{"rendered":"Using our Automation SDK for Selenium with Sauce Labs"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Having worked closely with Selenium for the past 7 years, I love the idea of getting as much value from functional UI tests as possible.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">One way to do that is to add accessibility testing, as well. This allows us to shift a11y testing left discovering issues earlier when they are faster, easier, and cheaper to fix. Add to this the power of the Sauce Labs Selenium grid with its instant scalability and actionable test insights and we have a solution that will help us dramatically improve end user experience for everyone.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Two advantages of the Evinced Selenium SDK <\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The advantages of the Evinced Selenium SDK over other accessibility tools are two fold. First, there is no need alter individual test code!! <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">(Go ahead and read that again.)<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Anyone that has used other a11y Selenium integrations understands the pain of having to add an accessibility scan after every interaction with the page that causes a significant DOM shift. An end to end test might have 10+ scans! Not only does this cause continual maintenance and reliability issues, but every time you add a scan to a test it creates a report that must be managed. This means organizing dozens of reports and wasting time with a mess of duplicate issues. Evinced provides a single detailed report at the conclusion of your tests with all the details you need to understand the issues and fix them quickly.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Additionally, unlike other tools that rely on syntax analysis, our Automation SDK for Selenium uses computer vision to model the UX intent and actions to the actual implantation. This approach allows Evinced to find more critical accessibility issues that were once only found with manual testing.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In this post we will discuss how easy it is to take an existing Selenium test built to run on Sauce Labs and add the Evinced accessibility scanner to pinpoint accessibility issues along the way.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How it all works together<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">So, let\u2019s take a look at our Sauce Labs example test:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><button class=\"copy-code-button\" type=\"button\" aria-label=\"Copy code to clipboard\" aria-live=\"polite\">Copy<\/button><code>import com.evinced.dto.results.Issue;\nimport com.evinced.dto.results.Report;\nimport com.evinced.utils.ChromeOptionsHelper;\nimport com.evinced.EvincedReporter;\nimport io.github.bonigarcia.wdm.WebDriverManager;\nimport org.junit.*;\nimport org.junit.rules.TestName;\nimport org.openqa.selenium.By;\nimport org.openqa.selenium.WebDriver;\nimport org.openqa.selenium.WebElement;\nimport org.openqa.selenium.*;\nimport org.openqa.selenium.chrome.ChromeDriver;\nimport org.openqa.selenium.chrome.ChromeOptions;\nimport org.openqa.selenium.edge.EdgeOptions;\nimport org.openqa.selenium.firefox.FirefoxOptions;\nimport org.openqa.selenium.remote.DesiredCapabilities;\nimport org.openqa.selenium.remote.RemoteWebDriver;\nimport java.net.MalformedURLException;\nimport java.net.URL;\nimport java.rmi.Remote;\nimport java.util.List;\n\npublic class SauceLabsTest {\n    \/\/ Sauce Labs username and access key stored as environmental variables\n    public String sauce_username = System.getenv(\"SAUCE_USERNAME\");\n    public String sauce_accesskey = System.getenv(\"SAUCE_ACCESS_KEY\");\n    \/\/ Test base url\n    public static final String demoPage = \"https:\/\/demo.evinced.com\/\";\n    private WebDriver driver;\n    \n    @Before\n    public void setUp() throws MalformedURLException {\n        \/\/ sauceOtps pass the Sauce Labs specific paramaters \n        MutableCapabilities sauceOpts = new MutableCapabilities();\n        sauceOpts.setCapability(\"username\", sauce_username);\n        sauceOpts.setCapability(\"accessKey\", sauce_accessKey);\n        sauceOpts.setCapability(\"name\", \"Evinced A11y Selenium SDK Demo\");\n        sauceOpts.setCapability(\"screenResolution\", \"2048x1536\");\n        ChromeOptions chromeOpts = new ChromeOptions();\n        chromeOpts.setCapability(\"browserVersion\", \"latest\");\n        chromeOpts.setCapability(\"platformName\", \"macOS 11\");\n        chromeOpts.setCapability(\"sauce:options\", sauceOpts);\n        \/\/ Set the Sauce Labs endpoint as the remote URL location\n        URL sauceURL = new URL(\"https:\/\/ondemand.us-west-1.saucelabs.com\/wd\/hub\");\n        driver = new RemoteWebDriver(sauceURL, chromeOpts);\n    }\n    \n    @After\n    public void tearDown() {\n        driver.quit();\n    }\n    \n    @Test\n    public void evincedTrvlTest() {\n        driver.get(demoPage);\n        \/\/ Click \"Your New Home\" dropdown\n        driver.findElement(By.cssSelector(\"div.filter-container &gt; div:nth-child(1) &gt; div &gt; div.dropdown.line\")).click();\n        \/\/ Click \"Where\" dropdown\n        driver.findElement(By.cssSelector(\"div.filter-container &gt; div:nth-child(2) &gt; div &gt; div.dropdown.line\")).click();\n        \/\/ Click \"When\" date picker\n        driver.findElement(By.cssSelector(\".react-date-picker\")).click();\n        \/\/ Click on the \"Search\" Button\n        driver.findElement(By.className(\"search-btn\")).click();\n        \/\/ Assert we have navigated to the results page\n        Assert.assertEquals(\"Page two | Evinced, Demos site\", driver.getTitle());\n    }\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">The first place we want to take a look at is the <code>@Before<\/code> method. This is where we will want to initiate the EvincedWebDriver class by passing in the <code>RemoteWebDriver<\/code> instance <code>sauceDriver<\/code> that has created a Selenium session on the Sauce Labs cloud. Check out the <a href=\"https:\/\/saucelabs.com\/platform\/platform-configurator#\/\">Sauce Labs platform configurator<\/a> for all the information needed to select a testing environment.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We can then start the Evinced engine using the <code>evStart()<\/code> method. The engine will continuously run in the background tracking all DOM changes and collecting a11y violations as the tests execute.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><button class=\"copy-code-button\" type=\"button\" aria-label=\"Copy code to clipboard\" aria-live=\"polite\">Copy<\/button><code>private EvincedWebDriver driver;\n\n@Before\npublic void setUp() throws MalformedURLException {\n    \/\/ sauceOtps pass the Sauce Labs specific paramaters \n    MutableCapabilities sauceOpts = new MutableCapabilities();\n    sauceOpts.setCapability(\"username\", sauce_username);\n    sauceOpts.setCapability(\"accessKey\", sauce_accessKey);\n    sauceOpts.setCapability(\"name\", \"Evinced A11y Selenium SDK Demo\");\n    sauceOpts.setCapability(\"screenResolution\", \"2048x1536\");\n    ChromeOptions chromeOpts = new ChromeOptions();\n    chromeOpts.setCapability(\"browserVersion\", \"latest\");\n    chromeOpts.setCapability(\"platformName\", \"macOS 11\");\n    chromeOpts.setCapability(\"sauce:options\", sauceOpts);\n    \/\/ Set the Sauce Labs endpoint as the remote URL location\n    URL sauceURL = new URL(\"https:\/\/ondemand.us-west-1.saucelabs.com\/wd\/hub\");\n    sauceDriver = new RemoteWebDriver(sauceURL, chromeOpts);\n    \/\/Pass the sauceDriver instance to the EvincedWebDriver\n    driver = new EvincedWebDriver(sauceDriver);\n    \/\/ Start the Evinced engine continuously scanning for a11y issues\n    driver.evStart();\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">The last thing we need to do is stop the engine and generate the accessibility reports. We can do that in the <code>@After<\/code> method. A <code>Report<\/code> object is created when we stop the Evinced engine using the <code>evStop()<\/code> method. We can then choose to export the accessibility report as a JSON or HTML report (or both!).<\/p>\n\n\n\n<pre class=\"wp-block-code\"><button class=\"copy-code-button\" type=\"button\" aria-label=\"Copy code to clipboard\" aria-live=\"polite\">Copy<\/button><code>@After\npublic void tearDown() {\n    \/\/ Stop the Evinced engine and generate the report object\n    Report report = driver.evStop();\n    \/\/ Export the report - JSON\n    EvincedReporter.writeEvResultsToFile(\"Evinced-Sauce-A11y-JSONReport\", report, EvincedReporter.FileFormat.JSON);\n    \/\/ Export the report - HTML\n    EvincedReporter.writeEvResultsToFile(\"Evinced-Sauce-A11y-HTMLReport\", report, EvincedReporter.FileFormat.HTML);\n    driver.quit();\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">We are now ready to execute our test!<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/12\/Screen-Shot-2021-08-13-at-10.58.52-AM-1024x599.png\" alt=\"Sauce Labs website. The TRVL website is displayed in the video of the test execution. Commands, logs, and metadata options are available.\" class=\"wp-image-219\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Not only do we gain all of the additional insights provided by Sauce Labs such as videos, logs, screenshots, and HAR file to make debugging our functional test quicker and easier, but we also get a detailed Evinced HTML and\/or JSON accessibility report containing all issues found, severity levels, descriptions, effect on end users, and actionable information on how to resolve the issues.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/12\/Screen-Shot-2021-09-02-at-3.17.31-PM-1024x580.png\" alt=\"Evinced html report helps auto-detect accessibility issues. Includes highlighted screenshot, issue type, severity, URL, component ID, WCAG links, css selector, and DOM snippet.\" class=\"wp-image-220\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">For more info on how to auto-detect accessibility issues, check out the <a href=\"https:\/\/www.evinced.com\/products\/CI\/sdk-automation\">Evinced Automation SDK<\/a> and the <a href=\"https:\/\/developer.evinced.com\/sdks-for-web-apps\/selenium-java-sdk\">docs<\/a> for our Selenium implementation, along with the <a href=\"https:\/\/saucelabs.com\">Sauce Labs<\/a> pages.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Having worked closely with Selenium for the past 7 years, I love the idea of getting as much value from functional UI tests as possible. One way to do that is to add accessibility testing, as well. This allows us to shift a11y testing left discovering issues earlier when they are faster, easier, and cheaper [&hellip;]<\/p>\n","protected":false},"author":12,"featured_media":1253,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-802","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-products"],"acf":{"authors_to_show":[924]},"_links":{"self":[{"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/posts\/802","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/comments?post=802"}],"version-history":[{"count":6,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/posts\/802\/revisions"}],"predecessor-version":[{"id":1207,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/posts\/802\/revisions\/1207"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/media\/1253"}],"wp:attachment":[{"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/media?parent=802"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/categories?post=802"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.evinced.com\/blog\/wp-json\/wp\/v2\/tags?post=802"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}