Basic Elements
A JSON page object is a tree of elements that map to the DOM of the corresponding page.
If a page has an HTML element that you need in the page object, declare a basic element as an object in an elements array. A basic element must have a name and a selector.
Click DOM Tree Viewer.
<body>
<div class="main">
<h1>Hello, <span class="world">🌍 🌏 🌎</span>!</h1>
</div>
</body>
To test that the Hello World page contains three world emojis, we don't have to model the div or the h1 in JSON. We only need to model the element with a world class.
The page object declares the basic element world, which transforms into the method name getWorld.
A basic element must have a selector, in this case it selects the element with the world class.
To generate the method for test code, use "public": true.
Click Run Test.
Tip: Declare only elements that are required to generate your test API. When you design a page object, the goal is to abstract the DOM and hide it from test code. You don't need to model the whole component in JSON.