Is it recommended for Protractor Page Objects to reveal ElementFinder?

Our team is currently debating whether or not to prohibit the exposure of "ElementFinder" and "ElementArrayFinder" in our Page Objects.

The main point of contention is a quote by Simon Stewart. Page Objects Done Right - selenium conference 2014 (page.7)

If you have WebDriver APIs in your test methods... You're doing it wrong.

According to SeleniumHQ/selenium/PageObjects https://github.com/SeleniumHQ/selenium/wiki/PageObjects

The approach is appropriate for transition functions that return another Page Object or when multiple selections are made on one Page in order to chain these calls.

However, for simpler tasks, there is a lot of unnecessary boilerplate code required to test for the existence of an element and its text.

In my opinion, creating mimic functions of "ElementFinder" doesn't make much sense. It is often faster and more readable to expose the element and use built-in functions of "ElementFinder" such as ".getText()". Do you think it would be better to make the element private and only expose the "getElementText()" function?

What is the best practice - should we prohibit the exposure of "ElementFinder" and "ElementArrayFinder" in Page Objects?

javascriptseleniumprotractor

Answer №1

Our testing approach involves using cucumber to effectively organize our tests into different components:

  • features
  • step definitions
  • helpers
  • page files

All of the logical operations and assertions are contained within the step definitions and helper functions. Step definitions call upon page methods to retrieve screen values, which in turn return plain old Java objects (POJOs). The details related to locating elements are kept within the page files for better organization. This separation of concerns is crucial, as any changes to the page's HTML structure only require modifications in one central location. Breaking this encapsulation can lead to a challenging maintenance scenario.

One common pattern we implement is creating helper classes like OfficeInfo, which store details such as table data for multiple offices. The page method would then return a list of OfficeInfo objects, making the office information independent of how it's presented on the page. This approach allows for easy updates when new table data is introduced, without impacting the existing implementation of OfficeInfo in other parts of the code.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for displaying an image using the image tag in jQuery

I am looking to dynamically append a share button image after every image tag that meets certain criteria. For the code snippet and demonstration, you can visit this fiddler link here. $(document).ready(function() { $("img").each(function() ...

javascriptjqueryhtmlcss

After updating the INNERHTML, the NAV tag content is no longer functional

I am facing an issue with replacing the contents of a NAV tag that contains UL list items. The original HTML within the NAV tag works perfectly fine, but when I replace it with my own HTML - which matches the original word for word - the dropdown functiona ...

javascriptcssinnerhtmlnav

Tips for retaining user input in an input box using HTML and AngularJS

Is there a way to retain a user's input in an input box? This is the current code snippet: <input type="text" ng-model="userText" placeholder="Enter text here"> However, I am looking for a solution that will allow the entered text to persist ...

javascripthtmlangularjs

Display the query results on a separate blade

In my original attempt, I intended to display the results in a modal but later decided to show them in a different blade. My goal is to fetch all comments related to a post using its post_id. However, I encountered the following error: The GET method is no ...

javascriptjqueryhtmllaravelbootstrap-4

Choose elements dynamically based on the function parameter

In the process of developing an Automation Testing framework, a function has been created: public void DoClick(string selectType, string selector) { switch (selectType) { case "ClassName": driver.FindEle ...

c#seleniumvariablestestingreference

Using Java and JXL/JExcel to extract data from spreadsheets

Why is my code only reading the last line of the spreadsheet after opening it? What could be causing this issue? Workbook workbook = Workbook.getWorkbook(new File("C:/promocoes.xls")); //Get number of rows in the sheet Sheet sheet = workbook.getSheet(0); ...

javaseleniumselenium-webdriverjxl

Trouble with Ajax call after transitioning from getJSON to Amcharts

Here is the method for making an AJAX call in a JavaScript file to create a bar graph using Amcharts. The script is located in the bar.js file: plot_graph(); function plot_graph(){ $.ajax({ url:back+"/cool?day=30", type: "GET", dataformat ...

javascriptjqueryajaxamcharts

Is there a way to successfully transfer both the event and props together?

For simplifying my code, I created a function that triggers another desired function when the Enter key is pressed. Here's an example of how it works: const handleKeyDown = (event) => { if (event.key === 'Enter') { event.preventDefa ...

javascriptreactjs

Incorporating a closing screen into a game built with Canvas and jQuery

After following a tutorial on creating a snake game, I decided to work on enhancing it as a side project. Currently, the game has a start screen where players can begin the game by pressing "start." My goal is to implement an end screen that displays the ...

javascriptjqueryhtmlcanvas

How do I access Google Chrome and perform a Google image search within a Node.js/Electron program?

I am currently working on incorporating Google Image search into my Electron-based photo application. My goal is to have users click on a button labeled "Search Google for Image," which will then open up Chrome (if installed) with the local image file in ...

javascriptnode.jsgoogle-chromeelectron

A guide on arranging the JSON array within an AngularJS controller

Can someone assist me with sorting the JSON list provided below in the controller and then displaying it in the view? The orderBy filter only sorts one level, but I need it to sort recursively for all children. Input: R2 -->S4 ------>T5 ------> ...

javascriptjsonangularjs

"Centered in the middle of the screen, an animated

Encountering an issue with this code on Chrome. Clicking on the checkbox causes the text/checkbox to shift in position/padding/margin unexpectedly.. :( View the code on JSFiddle HTML <input id="inp" type="checkbox" /> <div id="cb" class="inp_ch ...

javascriptjqueryhtmlcss

Script tag in NextJS

After numerous attempts, I am still struggling with a specific task on this website. The challenge is to insert a script tag that will embed a contact form and newsletter sign-up form, among others, on specific pages of the site. For instance, the contact ...

javascriptreactjsnext.js

Despite being listed in the entry components, HelloComponent is not actually included in the NgModule

Check out my StackBlitz demo where I am experimenting with dynamically instantiating the HelloComponent using the ReflexiveInjector. The HelloComponent is added to the app modules entryComponents array. Despite this setup, I am still encountering the foll ...

javascriptangulartypescript

Using jQuery to submit data via POST method without having the page reload

I have a link in the footer that, when clicked, jumps to the header with a # in the address bar. Is there a way to prevent this and stay in the footer? Here is the code snippet: <a href="#" class="clickIn" id="1" attrIn="Like"><span style="color ...

javascriptjquerycssajax

Issue encountered when updating npm to version 5.4.2: Unable to locate modules in ./node_modules/react-router-dom

When attempting to update my npm version from 3.10.10 to 5.4.2 and migrate react from 15.3.0 to 16.0, I deleted the node_modules folder and re-ran npm install. However, upon trying to run my application again, I encountered the following error: ERROR in ./ ...

javascriptnode.jsnpmmaterial-uireact-router-dom

Angular 2, the change event is not triggering when a bootstrap checkbox is clicked

Encountering an issue, the (change) function is not triggering in a specific checkbox. <input [(ngModel)]="driver.glasses" name="glasses" type="checkbox" class="make-switch" (change)="changeFunction()" data-on-color="primary" data-off-color="info"&g ...

javascripttwitter-bootstrapangulartypescript

Tips for developing a directive that supplies values for ng-options

I have select elements with the same options throughout the entire app, but they may vary in appearance. For example, selects for a user's birthday (day, month, year). Is it possible to create a directive that can provide values or expressions for ng ...

javascriptangularjsangularjs-directiveng-options

Error: Unable to update Ember Array - Property 'destroy' cannot be read because it is undefined

Is there a way to efficiently update an Ember Array so that changes in the array reflect in the view? Take a look at this simplified code snippet - cacheArr: Em.A([]), count: 1, updateFxn: function() { this.incrementProperty(count); devObj = Embe ...

javascriptember.js

Three.js is currently rendering a blank canvas in pure white

After following the tutorial at , my browser only displays a white window. I attempted separating the files into js and html, but no luck. What I have already tried: experimenting with adding/deleting the nomodule parameter in the script tag utilizing a ...

javascripthtmlthree.js