What is the best way to disengage a loop of elements within an internship?

In my scenario, the DOM structure is as follows:

<table id="campaigns">
   <tr>
      <th>Name</th>
      <th>Status</th>
   </tr>
   <tr>
      <td>first data</td>
   </tr>
   <tr data-id="1">
      <td>intern test at Fri, 09 Dec 2016 03:12:26 GMT</td>
   </tr>
   <tr data-id="2">
      <td>intern test at Fri, 09 Dec 2016 03:12:26 GMT</td>
   </tr>
   <tr data-id="3">
      <td>intern test at Fri, 09 Dec 2016 03:12:26 GMT edit</td>
   </tr>
   <tr data-id="4">
      <td>another data</td>
   </tr>
   <tr data-id="5">
      <td>next data</td>
   </tr>
</table>

When working with this in intern, I use the following code snippet:

this.remote
     .findAllByXpath("//*[@id='campaigns']/tr"") // get all items from the list
        .then(function (options) {
            return Promise.all(options.map(function (option) {
                return option.getVisibleText()
                    .then(function (text) {
                        if (text.includes("intern test")) { 
                             option.click(); 
                        }
                         return text;
                    })
            }))
         })

My requirement is to click only on the text containing "intern test". However, a problem arises where after clicking the first element, the subsequent ones are also clicked causing stale elements.

How can I modify the code to stop the loop once the first matching element is found?

Any help would be greatly appreciated. Thank you!

Answer №1

You don't have to search through every element to locate the first element that has the text "intern test"

Give this XPath a try with findAllByXpath (I'm not familiar with Javascript - selenium, so please adjust the syntax if needed):

//table[@id='campaigns']/tbody/tr/td[contains(text(),'intern test')]/..

This will give you all the tr elements in the table with the id campaigns that contain the text intern test.

Utilize indexing, such as 0, 1, 2, to target the first, second, and third elements that have the text intern test

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

Is there a JavaScript function available to remove comments from previously commented HTML code?

<div id="div1">bar</div> JQuery function addComment(element){ element.wrap(function() { return '<!--' + this.outerHTML + '"-->'; }); } addComment($('#div1')); Looking for assistance in unc ...

Exploring the integration of angular-ui-select into an angular seed project

I set up a new project using the starter template from https://github.com/angular/angular-seed and now I'm attempting to integrate angular-ui-select for dropdown menus. I've added select.js and select.css files to my index.html as well as install ...

Node.js Axios Returns Bad Request with Status Code 400

I am currently facing an issue while trying to send the results of a nodejs query to an endpoint. Interestingly, I receive a successful response when using Postman with the correct parameters, but encounter errors when attempting to use axios. data: ' ...

Achieving dynamic key assignment when updating with mongoose in NodeJS and Express

With a multitude of keys requiring updates from a single function, I am seeking guidance on how to dynamically set the key for updating. static async updateProfile(req, res, next) { const userId = req.body.userId; // The key requiring an update ...

Obtaining the value of a JavaScript confirm popup in C#.NET

I am trying to implement a javascript confirm popup that returns a value from the code behind. When the user selects the ok button on the confirm popup, certain code will execute, and if they select cancel, different code will run. Is there a way to retri ...

Employing a "cross-domain" approach to serve as a login gateway for a different domain

I need to configure the domain: aaaa.com so that it can host a login form for the website located at domain: cccc.com. It's important to note that I have complete control over the server at cccc.com and have successfully set up CORS on that server. A ...

Need assistance with a coin flip using HTML and Javascript?

After spending hours trying to make the code work with the example provided, I find myself unable to get it functioning correctly. Is there anyone who can assist me in putting all of this together so that it runs smoothly? var result,userchoice; functio ...

Unable to pass an event parameter using my this.handleChange function in react-native

Encountering an issue with the error message "undefined is not an object (evaluating 'event.preventDefault)" It appears that I am unable to pass an event parameter to the handleChange function in my child component, which is being rendered in the par ...

Attempting to replace the checkbox image resulted in no changes

<?php require 'includes/configs.inc.php'; ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title><?php $site_name ?></titl ...

Tips on containing the reach of a function in JavaScript/jQuery

I have a scenario where I have multiple .js files linked on the page, each containing functions with the same name. For example: first.js function DisplayContent(data,$target) // data is string { $target.html('<span>'+ data +'&l ...

Can a callout or indicator be created when a table breaks across columns or pages?

As we develop HTML pages for printing purposes, one specific requirement for tables is to include an indicator like "Continues..." below the table whenever a page or column break occurs. Additionally, in the header of the continuation of the table, we need ...

The metallic material in Substance Painter appears as a dark shade in A-Frame

After exporting an object as gltf from Substance Painter, I am importing it into my A-frame scene. Strangely, the metallic outer material appears dark in my current scene while other materials like plastic appear white and are visible. Despite already ha ...

Place the Material-UI Drawer component beneath the Appbar in the layout

Currently, I am working on developing a single-page application using Material-UI. In this project, I have integrated the use of an AppBar along with a ToolBar and a Drawer. However, I have encountered an issue where the Drawer is overlapping the AppBar an ...

"Resetting the state of a form in AngularJS2: A step-by

Looking to reset the form state from dirty/touched in angular? I am currently delving into the world of angular2 and working on a form with validation. In my journey, I came across this code snippet: <form *ngIf="booleanFlag">..</form> This ...

Extracting names from HTML can be done easily by looking for the "@" symbol that the

My HTML structure looks like this: <table id="table-15244" cellspacing="0" class="comment"><tbody> <tr id="comment-37"> <td style="color: #999" class="NV"> </td> <td class="hidden-mob"> ...

Do AngularJS routes allow the use of special characters in URLs?

Issue at hand: Every time I enter http://localhost:53379 in the browser, it redirects me to http://localhost:53379/#/. Why is the /#/ being added? angular .module('app', ['ngRoute', 'ngStorage']) .config([&apo ...

Is there a way to simultaneously send a file and additional information in Flask?

Below is the code I am using to upload a file to Flask. Client Side: <form id="upload-file" method="post" enctype="multipart/form-data"> <fieldset> <label for="file">Select a file</label> <input name="file8" ...

The elements in Dynamically generated ChartJs do not align with the bottom of the y-axis

I'm experiencing some unusual behavior with bars or risers in a dynamically generated Chartjs chart. They are not starting at point 0 on the y-axis and some of them are not displaying at all. Despite trying various solutions from different sources, i ...

Combine arrays of JSON data within a JSON object using JavaScript

Looking for help with reformatting a JSON response {"result":[["abc","de"],["fgh"],["ij","kl"]]} Interested in transforming the response to: {"result":["abc","de","fgh","ij","kl"]} What's the best way to accomplish this task? ...

Is there a way to incorporate vue samples into an independent HTML document?

Striving to broaden my knowledge of Vue, I set out to create a page with tabs inspired by one of the Vue examples available at . However, an obvious error seems to be eluding me, as I encounter a syntax issue on the line import * as Tabs from 'vue-s ...