DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports Events Over 2 million developers have joined DZone. Join Today! Thanks for visiting DZone today,
Edit Profile Manage Email Subscriptions Moderation Admin Console How to Post to DZone Article Submission Guidelines
View Profile
Sign Out
Refcards
Trend Reports
Events
Zones
Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones AWS Cloud
by AWS Developer Relations
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones
AWS Cloud
by AWS Developer Relations

Trending

  • Managing Data Residency, the Demo
  • Step Into Serverless Computing
  • Design Patterns for Microservices: Ambassador, Anti-Corruption Layer, and Backends for Frontends
  • Top Six React Development Tools

Trending

  • Managing Data Residency, the Demo
  • Step Into Serverless Computing
  • Design Patterns for Microservices: Ambassador, Anti-Corruption Layer, and Backends for Frontends
  • Top Six React Development Tools

Analyzer WebDriver - NFR Automation Through Selenium

Analyze a Web Application through selenium automation, to achieve complete testing with a Shift-Left mindset.

Surendran E user avatar by
Surendran E
·
Sep. 30, 20 · Code Snippet
Like (2)
Save
Tweet
Share
3.51K Views

Join the DZone community and get the full member experience.

Join For Free

Today's digital world demands more from all of us. The reality is that manual processes can't sustain a successful website. And without proper visibility into every aspect of your digital presence, errors slip through the cracks, prioritization is impossible, and measuring success is an uphill battle. 

We need a foundation for us to improve our website every day. 

Apart from functional changes we need to enhance content quality, work towards accessibility compliance, drive search engine traffic, meet data privacy requirements, and measure website performance and ROI.

In this below article, we will see how we could measure the NFR side of our application through functional automation with Lighthouse.  

Lighthouse 

Built by Google, Lighthouse is an open-source auditing tool for developers. It works over the chrome-dev-tools and runs a series of audits to measure the web application under test on the following 

  • Performance 
  • Accessibility 
  • SEO
  • Best-Practices
  • PWA (Progressive Web Application)

The Hinge

Lighthouse works as a Chrome/Firefox add-ons or in a CLI mode or as a node application. The hinge here is the "lighthouse launches its very own chrome-debug to test the application". 

The question is "How do I control the browser been launched by the lighthouse with Selenium?"

Merging Selenium With Lighthouse

To create a solution out of this, one needs some fundamental understanding of how lighthouse works. 

lighthouse architecture

Lighthouse Architecture


As could be seen from the diagram, the chrome dev-tools protocol enables us to run the audits, hence we understand the need for chrome debugs here. The later part of converting the audits into meaningful reporting by comparing the standards are done by the lighthouse itself. 

So the bottom line is we need to do the following 

  • Launch Chrome-debug on the command line with specific port enabled.
  • Attach the Selenium WebDriver on the specified port. 
  • Run Lighthouse on CLI to your driver URL.

Let's Code

As part of the pre-requisite, ensure the following are installed

  • Node JS.
    • npm, install -g lighthouse (Install Lighthouse as a node).

Launching Chrome-debug

Shell
 




x


 
1
chrome-debug --port=9222


Ensure using process builder we open a chrome-debug instance on the allowed port. 

Attach Selenium WebDriver 

Java
 




xxxxxxxxxx
1


 
1
ChromeOptions options = new ChromeOptions();
2
options.setExperimentalOption("debuggerAddress", "127.0.0.1:9222");
3
driver = new ChromeDriver(options);
4
driver.manage().window().maximize();
5
driver.get("https://www.google.co.in/");



Run Lighthouse on the desired URL

Shell
 




x


 
1
lighthouse https://www.google.co.in/ --port=9222 --emulated-form-factor=desktop --output=html --output-path=./GoogleHome.html



View Analyzed Page Reports

One could get the analyzed report as shown below 

Snapshot of Lighthouse Report


Summary

Create your own fully automated website checks, performance metrics, industry benchmarks, and automated reporting through functional automation scripts. Shift-Left with Quality Intelligence. 

Web application

Opinions expressed by DZone contributors are their own.

Trending

  • Managing Data Residency, the Demo
  • Step Into Serverless Computing
  • Design Patterns for Microservices: Ambassador, Anti-Corruption Layer, and Backends for Frontends
  • Top Six React Development Tools

Comments

Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 600 Park Offices Drive
  • Suite 300
  • Durham, NC 27709
  • support@dzone.com

Let's be friends: