Rise of Shadow DOM - Lets solve it through WebDriver

Shadow DOM is kind of web standard that developers use to encapsulate their custom HTML code and style components so that no other global style components can override their code. It ensures that a component will work in any environment, even if other CSS or JavaScript is run on the page i.e. Shadow DOM hides away the complexity of the components from the rest of the page because it renders separately from main DOM.

Selenium legacy selectors are not able to interact these custom elements under the shadow DOM so we need java script to interact with shadow DOM elements and we also require JavascriptExecutor interface for their execution.

We will also talk about the WebdriverIO tool v5.5.0, which implicitly support Shadow DOM elements.

 
 
 
 

Outline/Structure of the Demonstration

  • What is Shadow DOM?
    • Why developers using it?
    • How it is different from the main DOM and where it renders on browser?
  • How Selenium interact with Shadow DOM?
    • How Selenium differently handle shadow DOM elements?
    • Why we need JavascriptExecutor interface over Selenium WebDriver to execute shadow DOM elements?
  • How WebDriverIO tool v5.5.0 implicitly support Shadow DOM elements?
  • Demonstrate Selenium and WebDriverIO can interact/execute shadow DOM elements.
 
 

Learning Outcome

  • How to do the following things using Selenium and WebdriverIO tools:
    • About Shadow DOM and its different behavior on browser.
    • Find shadow DOM elements
    • Take actions on already found shadow DOM elements
 
 

Target Audience

Test Automation Engineers, UI Developers, Test Architects.

Prerequisites for Attendees

They should know the basics of Selenium and main DOM.

 
 
schedule Submitted 7 months ago

Public Feedback

comment Suggest improvements to the Speaker
  • Sai Krishna
    By Sai Krishna  ~  6 months ago
    reply Reply

     

    Hi Virender,

    Thanks for the submission. Are you going to present the internals of WDIO on Shadow DOM or you would cover what is mentioned here https://webdriver.io/blog/2019/02/22/shadow-dom-support.html. Can you also please give a time breakout for the session?

     

    Cheers!

    • Virender Singh
      By Virender Singh  ~  5 months ago
      reply Reply

      Hi Krishna,

      During my session, First of all, I will present how the shadow DOM is different from the main DOM and how it renders in quarantined mode. And what is the structure of shadow DOM and how it is different from the main DOM.  

      After that, I will be covering the challenges faced by the test automation engineers while automating the shadow DOM with Selenium and present the approach using Selenium while automating the shadow DOM.

      And later I will cover up the internal shadow DOM support by WebDriverIO.

      So I will be breaking the session into three segments:

      #1 Shadow DOM [with rendered HTML snippet] - 10 minutes [with my introduction and get familier with audience]

      #2 Approach using Selenium [with code snippet] - 15 minutes

      #3 Approach using WebdriverIO [with code snippet] - 15 minutes

      #4 Q/A session - 5 minutes

      This is all I am planning to present at selenium conference.

      Cheers!

       

       
       
       
       
       
       
      • Sai Krishna
        By Sai Krishna  ~  5 months ago
        reply Reply

        Thanks for your response Virender.


  • Liked Simon Stewart
    keyboard_arrow_down

    Simon Stewart - Selenium: State of the Union

    Simon Stewart
    Simon Stewart
    Project Lead
    The Selenium Project
    schedule 6 months ago
    Sold Out!
    45 Mins
    Keynote
    Intermediate

    What's the latest in the world of Selenium since the last SeleniumConf? In this talk, we'll cover Selenium 4, how the project is run, how you can participate, reminiscing on the Old Days, and reflect on something that at first doesn't appear to be related to Selenium, yet is intimately related to it.

  • Liked Ivan Krutov
    keyboard_arrow_down

    Ivan Krutov - Master-class: Bulletproof Selenium cluster

    Ivan Krutov
    Ivan Krutov
    Developer
    Aerokube
    schedule 7 months ago
    Sold Out!
    45 Mins
    Demonstration
    Beginner

    Browser tests are known to be the flakiest ones. This is partly because browser infrastructure is complicated to maintain. But the second reason is – mainstream browser automation tools such as Selenium server are far from being efficient.

    During my previous talks I was speaking about Selenoid - a truly efficient replacement of the standard Selenium server. This year I would like to do a live demonstration how to organize a fault-tolerant and easily scalable Selenium cluster using virtual machines in the cloud. I will start by setting up Selenoid and show its powerful features like video recording, live tests debugging, manual testing and many more. Then I will configure Selenoid to send logs and recorded videos to S3-compatible storage. Finally we will run a Ggr load balancer instance allowing to use all running Selenoid nodes and organize a single entry point to the cluster.

  • Liked Vinayaka Mayura G G
    keyboard_arrow_down

    Vinayaka Mayura G G - Search Relevancy Testing: QA in Machine Learning Models

    Vinayaka Mayura G G
    Vinayaka Mayura G G
    QA
    ThoughtWorks
    schedule 7 months ago
    Sold Out!
    45 Mins
    Talk
    Intermediate

    The adoption of Artificial Intelligence is getting more traction, it is in need to enhance QA capabilities to cope up with these skills. Machine Learning is used extensively in retail applications for solving complex problems, one of them is solving the search relevancy. Showing the appropriate results for the user is important for the conversion rate to go high. As Machine Learning poses different challenges such as a Test Oracle, Fairness, Correctness and Robustness to do QA, We may need to follow different approaches and testing techniques to do the QA for Machine Learning models.

    Different Machine learning types such as Supervised and Unsupervised Models have different characteristics and are used for different types of problems. Though these solves different complex problems, Machine learning Models also a unit of software code that needs to be verified as a normal software system. When a Machine learning model is seen as a whole system, it may look complex and unsolvable. We can group them into small modules and verify for quality. Black box and White box testing techniques can be applied to verify the functionality. Data, Feature Engineering and Algorithms are the major part of the Machine Learning model. We will see how we applied different techniques to validate these.

    This talk is focused on viewing the Machine Learning software as a whole and performing the Quality Analysis for it. We look at how different is testing a machine learning model from typical software testing. We will discuss the challenges that came across, the Process involved in building an ML model. We take an example of Search Relevance for an explanation. We will dive into the areas where quality is assessed. The significant factors considered here are measuring Accuracy and Efficiency. We will look into the different black box testing techniques for different Algorithms. Let us also see how traditional testing is different from testing machine learning applications. I will go through different black-box testing techniques with examples following a live demo.

  • Liked Krishnan Mahadevan
    keyboard_arrow_down

    Krishnan Mahadevan - My experiments with Grid

    45 Mins
    Tutorial
    Intermediate

    Everyone starts off with a simple grid setup which involves a hub and one or more nodes.

    This traditional setup is a good start but the moment one starts to get serious with the selenium grid and decide to house their own selenium grid for their local executions, that is when issues start.

    My experiences with the Selenium grid in the past couple of years has led me to get introduced some of the most prevalent problems with maintaining an in-house selenium grid.

    • Nodes get unhooked randomly due to network glitches.
    • Nodes introduce false failures due to memory leaks.
    • Selenium Grid running out of capacity.
    • Nodes require OS upgrades/patches etc.
    • Needing to deal with auto upgrades by browsers (especially chrome and firefox)

    Some of these issues I managed to fix by building a "Self Healing" Grid wherein the nodes automatically get restarted after they have serviced "n" tests. But that still didn’t solve many of these other problems.

    That was when I felt, what if there was an on-demand selenium grid.

    What if the Grid could do the following ?

    • The Grid auto scales itself in terms of the nodes based on the current load.
    • The Grid does not require a lot of infrastructure to support it.
    • The Grid can plug itself into some of the cloud providers or leverage a solution such as Docker so that the nodes can be spun and shutdown at will.

    That was how the idea of "Just Ask" an on-demand grid was born.

    Just-Ask is an on-demand grid. It has no nodes attached to it.

    It’s designed to spin off nodes on demand, run test against the newly spun off node and after test runs to completion, clean-up the node as well. The node can be backed by anything. It could be Docker (or) it could be a VM running on any of the popular clouds.

    The session aspires to walk the audience through with my experiments with the selenium grid, my learnings on the selenium grid internals and how I used all of that knowledge to build my own On Demand Selenium Grid. What better avenue to share these learnings than a Selenium Conference.

    The session will introduce the audience to the grid internals and their concepts such as

    • What is a Selenium Remote Proxy ? What is it used for? What can you do with it?
    • What is a Hub (or) Node level Servlet ? When would you need one ?
    • All of this followed by a quick demo on "Just Ask", the on-demand grid that I have built and open sourced here: https://github.com/rationaleEmotions/just-ask

  • Liked Jesus Sanchez Martinez
    keyboard_arrow_down

    Jesus Sanchez Martinez - Test and monitor one website is not that hard, but what if you need to do it to over 40 websites?

    Jesus Sanchez Martinez
    Jesus Sanchez Martinez
    QA Manager
    Onestic
    schedule 7 months ago
    Sold Out!
    45 Mins
    Talk
    Advanced

    Onestic QA department made and maintained test suites, which was a huge bottleneck in our development process.

    In order to solve it, management bought us an idea: our developers must be able to build their tests using a DSL framework without friction. QA maintain a big library that provides resources to developers. From there, they were free to extend this library in each project. With all of this we have a CI process, a 1 hour execution to monitor our results and of course our bot, SpongeBot.

    SpongeBot can check 40+ e-commerce sites, with 4+ environments, for desktop and mobile platforms always available for developers.

    With this solution we achieve to decentralize the work, add value testing production and the confidence in SpongeBot notifications if something goes wrong.

  • Liked Moshe Milman
    keyboard_arrow_down

    Moshe Milman - Fixing Your Automation Challenges in the Era of CI/CD

    Moshe Milman
    Moshe Milman
    COO & Co-founder
    Applitools
    schedule 7 months ago
    Sold Out!
    45 Mins
    Talk
    Intermediate

    Continuous Delivery is now the holy grail of IT organizations, but most companies are still struggling with the transition into shorter release cycles and faster, more frequent deployments. A key challenge that companies are facing in that transition lies around test automation, and in this talk we will cover these challenges in details and demonstrate how successful companies are addressing it.
    The key takeaways from this session include:
    1) Testability hacks + best practices
    2) Tips for reducing your testing matrix to support the automation speed required for frequent builds/releases
    3) Examples of team structure/architecture from leading companies to support better alignment around automation
    4) Guidelines for picking the right open source tools / frameworks
    5) Learnings/Issues to avoid when designing your automation architecture
  • Liked Amit Rawat
    keyboard_arrow_down

    Amit Rawat - Is Puppeteer better than Selenium

    45 Mins
    Demonstration
    Intermediate

    Puppeteer is a Node js library (developed by Google Chrome team) to control Chrome and Firefox and is getting lot of traction recently because of its amazing capabilities. It has already become so popular that it has got 50K+ stars on Github against Selenium's 15K+ stars.

    In the last Google I/O event, this tool's capability has been showcased and it has been perceived as the next generation Web Test Automation Tool.

    Is Puppeteer better than Selenium? The answer is 'No', and I will cover 'why' in detail during this talk. I will show some live examples to demonstrate that Selenium can also do all those advance things which Puppeteer promises to do.

  • Liked Diego Molina
    keyboard_arrow_down

    Diego Molina - Test Automation is not just coding

    Diego Molina
    Diego Molina
    Sr. Software Engineer
    Sauce Labs
    schedule 7 months ago
    Sold Out!
    45 Mins
    Talk
    Intermediate

    We learn more from our failures than our successes. I want to share one of my failure stories, where I learned that coding is not the most important task in Test Automation.

    A failure taught me that coding is not the most important task in Test Automation. I fixed a bug, added tests, and shipped it to production. After that, a bug report came in showing that the fix created a new bug. I felt bad, I did not understand how that happened. A hotfix solved the issue, but the root cause was not addressed: what did I miss?

    By taking a step back, I understood the situation, it all happened by overseeing basic concepts in testing (like understanding how the system works). The problem was that coding had more priority than creating a test plan. After this, I prioritized tasks better to avoid this situation to happen again.

    This talk shows that testing concepts are more important than ever, in a time where tools promise to do everything, we focus less on what and how to test, and more in using tools to test. It outlines how a test strategy can leverage a continuous testing setup. Finally, it shows that failing is ok, but failing again for the same reasons is not.

  • Liked Sanjay Kumar
    keyboard_arrow_down

    Sanjay Kumar - ChroPath- Smarter way of writing automation script!!

    Sanjay Kumar
    Sanjay Kumar
    ChroPath Creator
    AutonomIQ
    schedule 9 months ago
    Sold Out!
    45 Mins
    Case Study
    Intermediate
    • Want to save 70-80% manual effort of automation script writing!!
    • Wasting time in verifying xpath one by one?
    • Want to complete automation script without wasting much time?
    • Are you still wasting time in writing english manual test cases?
  • Liked Christian Bromann
    keyboard_arrow_down

    Christian Bromann - The Nuts and Bolts of WebdriverIO

    Christian Bromann
    Christian Bromann
    Software Engineer
    Sauce Labs
    schedule 7 months ago
    Sold Out!
    90 Mins
    Workshop
    Beginner

    There are thousands ways if not more to setup your automation testing environment. It is often crucial when it comes to stability and maintainability. While you can build a custom framework that fits your needs there are often already sophisticated setups or frameworks available that get you up and running very quickly.

    WebdriverIO is one of these frameworks that is written in Node.js. It gets you up and running within minutes and allows you to scale up your test suite while maintaining your execution time by running tests in parallel. With its huge project community it is an ideal choice for small as well as big projects that use modern frameworks such as React, Angular or Vue.js.

    In this workshop you will learn everything you need to know to run a successful, stable and maintainable WebdriverIO framework. It starts with an introduction to the project and the basic concepts and will end with a sophisticated framework that includes testing strategies like Frontend Performance Testing as well as complex browser interaction with Puppeteer.

  • Liked Dawid Pacia
    keyboard_arrow_down

    Dawid Pacia - Build your own Internet of Continuously Delivered Things

    Dawid Pacia
    Dawid Pacia
    Test Automation Manager
    Brainly
    schedule 7 months ago
    Sold Out!
    45 Mins
    Case Study
    Intermediate

    It is predicted that till 2025 there will be over 75 billion devices spewing 180 zettabytes of data and generating up to 6 trillion dollars. That enormous increase force companies to introduce a continuous approach to deliver the product as fast as possible and be able to compete on the market.


    The main question is how to test application for end user among so much hardware equipment and ecosystems combining HW, FW, mobile devices and complex backend architecture? Considering all factors and possible obstacles is it for companies a real “A New Hope” for companies or just simply “Mission Impossible”?


    I will take the participants on a journey to the IoT world. It will be a talk about the challenges that any tester will face at some point. I will present the dangers, risks and snares but also good practices and practical approach to mobile E2E test automation for the IoT solutions in CI approach.


    Technical examples will be presented using Python languages and supported by physical devices (mobile phones and IoT equipment).

  • Liked Pallavi ...
    keyboard_arrow_down

    Pallavi ... - Learn Selenium with JavaScript

    480 Mins
    Workshop
    Beginner

    Selenium is a popular open source test automation tool, so popular it has its own conference event which run for 3 whole days across continents and is attended by hundreds of enthusiastic testers, and people wanting to know more about testing and automation. In my little experience of coaching for last 7 years, i feel what english language has done for common man[those from non english speaking countries] in earning bread and butter and giving them an elite status, selenium has done for manual testers.

    Anyone and everyone wants to learn Selenium. The magic of selenium or the flexibility is that it can be learnt with your choice of programming languages. I have taught people Selenium with Java, C#, Python and Ruby largely in past these years. I wish to delve into the world of Javascript now and see what this has to offer to us. So this workshop is for those open minded souls out there who wish to pick up another language and learn, unlearn, relearn selenium with it.

  • Liked Srinivasan Sekar
    keyboard_arrow_down

    Srinivasan Sekar / Sai Krishna - Testing And Observability in an Integrated Microservices environment

    45 Mins
    Case Study
    Intermediate

    Leading-edge applications are dynamic and adaptive in capabilities that require people to use increasingly dexterous tools and supporting infrastructure, including microservices. All of these applications leverage data in new ways. Decoration and tagging of data with intelligent meta-data have become more important than data itself. To keep up with evolving needs, enterprise devs across industries are shifting from traditional app architectures in favor of more fluid architecture for building data-centric applications.

    Microservices break traditionally structured applications into manageable pieces that can be developed and maintained independently. microservices are often decoupled, allowing for updates with little to no downtime, as the other components can continue running.

    Moving to distributed Microservices ecosystem brings its own challenges; Among them is the loss of visibility into the system, and the complex interactions now occurring between services. Monitoring these applications only reports the health of it but Observability provides granular insights about the behavior of the system along with rich content. In this talk, we will cover the difference of Monitoring and Observability, data path engineering challenges, pillars of observability, distributed tracing of various microservices, testing in distributed microservices ecosystem, automated observability, etc.

  • Liked Anton Angelov
    keyboard_arrow_down

    Anton Angelov - Combining Load and Functional Testing- Reusing WebDriver Tests for Load Testing

    Anton Angelov
    Anton Angelov
    CTO
    Automate The Planet
    schedule 7 months ago
    Sold Out!
    45 Mins
    Demonstration
    Advanced

    Typically, industry software testing practice is to separate load testing from functional testing. Different teams with different skills and expertise do their testing at different times, and each evaluates the results against its own criteria.

    Anton Angelov will present to you how you can reuse your functional tests for load testing. We will review the design of a load testing engine that will reuse the same functional tests and at the end of the execution, generate a comprehensive report. We will also talk about how to utilize the new features in Selenium 4.0 in this load testing solution. As part of the reviewed tooling, there will be a discussion about the best possible checks you can do in your coded load testing library and the essential load testing metrics you need to collect during the run.

  • Liked Khyati Sehgal
    keyboard_arrow_down

    Khyati Sehgal / Shubhechchha Rai - Applying software craftsmanship to the evolving world of automation.

    45 Mins
    Demonstration
    Beginner

    Software Craftsmanship is a practice of continuous development and helping others learn the craft. As the world is evolving towards the era of scripting language, we will be sharing our experience of how we have grown as a team of all QA with programming language background to the niche typescript world contributor.
    During this talk, we will be focussing on the shift of existing selenium to the actual implementation of Protractor test API. How and when to use a protractor? When to pick protractor as an automation tool for building a framework.

    By the end of the session, one will be able to understand how can we start working on end to end tests for any JavaScript and TypeScript based application using Protractor, Cucumber framework, and Page Object Model design pattern.

    We will also talk about configuration files, cucumber, typescript, promise handling in protractor.

  • Liked Srinivasu gangam
    keyboard_arrow_down

    Srinivasu gangam - Zero Touch Automation using NLP (Natural language processing) & AI

    Srinivasu gangam
    Srinivasu gangam
    Sr Manager
    Cotiviti India
    schedule 9 months ago
    Sold Out!
    45 Mins
    Demonstration
    Intermediate

    Problem Statement:

    As part of SDLC process:

    1. Is your product quality impacted due to a smaller number of QA resources available in the team?
    2. Are you waiting for QA resources to certify your code every time when you deploy? Is this impacting your product lead time (Speed to Market)?
    3. Is your Product delivery timelines are impacted due to last minute defects identified?
    4. Do you have your QA resources only in one location, but you want to “follow-the-sun” approach for Software delivery across multiple locations?
    5. Do you have manual testers who are not skilled in programming, but you want them to execute automated test scripts w/o any training efforts and automation setup?
    6. Would you like your team more agile and cross functional with Delivery?
    7. Would you like to increase your QA team’s productivity while they invest more time in script development rather than script execution?

    If answer is ‘Yes’ for above questions, "Zero touch automation" is the solution for above challenges that we have been facing part of SDLC.

    Solution: Zero touch automation with cutting-edge technologies

    In this session, I will cover how we solved this problem using innovative solutions, Cutting-edge technologies like NLP (Natural language processing), AI & Cloud solutions.

    You will learn how AI, NLP integrated with core automation components to achieve Zero touch automation.

    This solution is not just revolutionary, it is paradigm shift in test automation to get results to your email with detailed analysis of failure categorization with recommended actions to users.

    I will also cover how E2E automation will be driven with decisions taken by machines based on what user is looking for . There is no manual intervention in this process. NLP and AI play key role to help machines to take decisions.

    We will also cover how we empowered developer/release manager/any team member/Manager to trigger the scripts from their cell phone and get the detailed execution report without having any automation software installed in their computer or Phone.

    We will be demonstrating how the request will be initiated from User, understand the need from user using NLP & AI , Fetching the code from bitbucket to select appropriate automation scripts , running them on Selenoid/docker server , storing results to MongoDB , receiving email with test results and Failure analysis.

    What is the value of zero touch automation?

    1. Enable speed to market: Now that Developers does not need to wait for QA resource, Changes can be certified quickly and ready to push to production. Lead time will be significantly reduced.
    2. Increase quality: Now that test automation is easy and it can run multiple times in each environment, most of the defects will be uncovered and addressed before code goes to production.
    3. Ease of test execution: Test execution will be very easy, no automation or framework setup required from user side. Test execution can be done 24*7.
    4. Productivity: Increase QA team’s Productivity to focus more on script development rather than focusing on script execution and failure analysis .
  • Liked Wim Selles
    keyboard_arrow_down

    Wim Selles - Do you know the dependency of your dependencies dependency?

    Wim Selles
    Wim Selles
    Solution Architect
    Sauce Labs
    schedule 7 months ago
    Sold Out!
    45 Mins
    Case Study
    Beginner

    Nowadays a lot of people are using JavaScript based automation frameworks, and why not? They are the closest language to what your developers are using and it's easy to use. You just

    • Install NodeJS on your local machine
    • npm install this-module
    • npm install that-module,
    • script a test-case
    • npm run test

    And you're done, easy peasy, isn’t it? But when you look at your project you see something called

    • node_modules
    • package.json
    • package-lock.json

    And you hear your developers talk about

    • ES6, ES7
    • TypeScript
    • Polyfills
    • NodeJS LTS, 8, 9, 10, 11, 12, 13 (and counting)
    • Promises, asynchronous behavior
    • ...

    And you are like……………...

    If you recognize yourself in this then this presentation might be useful for you, because during this presentation I will cover NodeJS, the biggest dependency of your dependencies dependency.

  • Liked Arjan Blok
    keyboard_arrow_down

    Arjan Blok - TypeScript: your gateway drug to the JavaScript world

    Arjan Blok
    Arjan Blok
    Test Engineer
    Mendix
    schedule 7 months ago
    Sold Out!
    45 Mins
    Talk
    Intermediate

    A big part of the testing community is using Java based tooling to do automation. Selenium Java bindings and RestAssured are goto testing libraries for a lot of us. Yet most of the applications we are testing nowadays are written in JavaScript; the language of the web. I speak from experience when I say that writing your automation code in the same language as your application under test is written in will bring you a lot of benefits. It creates a common ground for knowledge sharing, problem solving and ultimately: developers willing to write and debug integration tests.

    However, as a tester, programming might not be second nature to you and learning a new untyped language like JavaScript, with all its quirks, can look like a daunting task. Enter TypeScript: a typed superset of JavaScript which will instantly make you feel at home!

  • Liked Vishal Srivastava
    keyboard_arrow_down

    Vishal Srivastava / Khyati Sehgal - Setup Grid Infra with AWS Nodes & Autoscaling of AWS Nodes

    45 Mins
    Demonstration
    Intermediate

    When it comes to creating a project we always search for ideas that are open-source, easily scalable, ready to use.

    We as humans always have a tendency to grow and expand and when it comes to customizable infrastructure it's a big Yes.

    In this talk, we will be focussing on how we can save the cost of actual servers with easily scalable and manageable open-source software using an open-source tool - selenium grid. How we set up the nodes and hub altogether to make cross-browser, multi-platform execution takes place.

  • Liked Khyati Sehgal
    keyboard_arrow_down

    Khyati Sehgal / Shubhechchha Rai - Expanding the aura of automation, when it comes to mobile.

    45 Mins
    Demonstration
    Intermediate

    This talk will answer the questions "Will you be able to run your automation scripts without connecting the USB cable to your device in a limited range?"

    If we have to ask ourselves where is the mobile and when is it required? So the answer would be its 'Everywhere'!!

    It's next to possible to imagine a day without looking at mobile or using apps for that matter- Google, Facebook, Whatsapp, etc.

    When it comes to using it so testing comes hand-in-hand with it. As we develop applications over a mobile device, be it any platform ios, Andriod and windows we shall also think about usability and end-to-end testing.

    In this talk, we will discuss how Appium worked as a bridge between devices and controllers.