& quot; What is Google ’ sPolymer Project? & quot; This is typically what I hear when I start talking about this brand-new web component technology my company is using to implement a antiphonal web application. The Polymer Project is a library for creating web components, which align with W3C standards and provide a set of feature for create tradition HTML element. It is contrive to do it leisurely and quicker to make tradition HTML elements that employment, like standard DOM component. The Polymer factor can be similar to standard DOM ingredient. It is important to understand that these custom HTML web element do not play nicely with the standard browser examination instrument (a.k.a. Selenium) which is just the reason why we demand to discuss the testing strategy for a Polymer web development project.

testing your elements

The Polymerteam has created a testing fabric calledWeb Component Tester(WCT), which roll aroundMocha, Chai, Sinon, Seleniumand more. The WCT escape test retinue through browsers using Selenium, and also hasbuilt-in Sauce Labs integrationfor remote performance. I would caution you that the Polymer WCT framework is build on top of many third-party tools, and some of these fabric might not be able to fully test custom web component when the browser is using the nativeShadow DOM.

Here is a abbreviated description of custom web components and Shadow DOM:

• Custom Web Componentsenable the author to define and use new case of DOM elements in a document.

• Shadow DOMcombine multiple DOM Tree into one hierarchy and instance how these trees interact with each other within a papers, thus enable better composition of the DOM.

If you are planning to use both Selenium andAppiumfor Polymer web applications, you demand to be aware of Polymer Shadow DOM. Browsers often encapsulate this internally. Polymer custom component are rendered as unreachable in the DOM subtree. Based on my experience, Selenium has skin to site these custom component. It & # x27; s possible to find or build a resolution for third-party testing framework (like Selenium and Appium) to locate custom elements. Polymer usespolyfills (from webcomponents.org) which are lightweight, work well and run on the following back browser versions below:

SUSA automates exploratory testing with persona-driven behavior, catching bugs that scripted automation misses.

source: https: //www.polymer-project.org/1.0/docs/browsers

The test strategy for a Polymer Project slenderly dissent when compared to other front-end tech stacks. This approach heavily center on developing unit tests for web components and executing them across mobile, pad, and desktop browser. Polymer & # x27; scommand-line interface(CLI) tool includes a test runner WCT that provides a comprehensive solution for running a suite of unit tests inside real browsers using Selenium. The CLI tool also has built-in support for Sauce Labs try. The development of unit web components testing allows us to proceed to accomplish against Safari, Chrome, and Firebox browser. It enables the team to add the unit tests to be part of the CI pipeline. It integrates nicely with Mocha and Chai for assertions, and Sinon for mocking.

My cerebration on a testing strategy for Polymer:

• The test pyramid for Polymer Projects needs a solid base of unit tests for web components, since the current Selenium Webdriver and Shadow DOM don & # x27; t play nicely together.

• How can we handle desegregation screen with remote data? The WCT includes the Sinon JS fabric, which allows us to create mock host returning test-set JSON.

• We need some level of automated responsive/adaptive integration screen for components, functional end-to-end testing, and visual checkpoints using Applitools.

Conclusion

It & # x27; s important to understand the behavior of the technology stack before diving head-first into a testing strategy. Don & # x27; t presume your existing machine-controlled testing strategies will work smoothly with the new engineering stack. Take the clip upfront to check your existing or new testing strategy will be reliable, scalable, provide adequate test coverage (examine pyramid), and meet your goals. Before creating an mechanisation strategy, interpret the goals and methods to achieve the task. If the goals and methods are unclear, I commend see out this article aboutmechanisation strategywritten by Paul Grizzaffi (@ pgrizzaffi).

The Polymer Project will not be the final engineering stack to challenge us or remold our automated testing strategy. We need to be proactive and continue to seek ways to move quicker with a mindset focused on quality first.

References:Unit Testing with Web Component Tester - Polycasts # 36 (Video)Polymer Testing Your Elements Testing Polymer Web Components - The Polymer Summit 2015 (Video)

Greg Sypolt (@ gregsypolt) is a Aged Engineer at Gannett – USA Today Network and co-founder of Quality Element. He has spent most of his career working as a developer in test— concentrating on machine-controlled testing for web browsers, APIs, mobile, and more. He is focused on the research, creation, and deployment of automated test strategies, prove model, tools, and uninterrupted integration. He ’ s passionate about # TestAutomation # TestCoverage # ContinuousIntegration and # DevOps.

Products

Global tools

Set up and integrate

Resources

Company