I have a grid panel created with ExtJS that contains over 20 rows of data. My goal is to use WebdriverIO as the test driver to search through each row for an icon indicating active mode.
How can I write a script that searches each row until it finds the first instance of the active icon? (Please note: The grid being tested is located on alegra.com).
Here's an image showing the HTML structure:
If you're struggling to figure out the exact method without knowing the specific locator being used, one approach could be to retrieve a list of rows, filter them, and then select the first matching element.
public static get rows() { return browser.elements('#someTableId > table > tbody > tr'); }
public static getFirstMatch() {
return this.rows.value.filter((row: WebdriverIO.Element) =>
browser.elementIdElement(row.ELEMENT, 'someLocator').value)[0];
}
This is my approach
let action_type = 'delete';
it('Deleting an invoice', function(){
//populating the grid elements array
let elements = browser.getAttribute('#gridInvoices #gridview-1047-table tbody tr .action-icons img:nth-child(7)','class');
//Find the first matching element with type
let row_num = elements.indexOf(action_type);
if(row_num === -1){
throw new Error('No active buttons of type "Delete" were found in the entire grid' )
}else{
$$('#gridInvoices #gridview-1047-table tbody tr')[row_num].click('.action-icons [title="Eliminar"]');
browser.click('=Yes')
};
});
Looking for advice on enhancing a UI component that receives an object containing various data types such as string, int, boolean, arrays, and objects, and displays them all. Below is an example of the object. PS: The object can also be found in the codesa ...
Whenever I attempt to poll the URL, I receive a response saying "The response is plain." What steps should I take in order to extract just the URL or obtain the complete data in JSON format? HTTP/1.1 201 Created Cache-Control: private Content-Type: appli ...
According to my form.json file, I have a form that needs validation and a simulated submission. Firstly, I need to address this issue: fnPtr is not a function Next, I want to submit the form to a mocked API endpoint that will return true or false. Can I ...
function displayContent(a) { var content = $("#" + a).html().trim(); alert(content); $('#temstoredivid').append( "<div class='maincover' id='maincov1'>" + " <div class='subcover' id='sub ...
Looking for a way to dynamically update the color of a Circle element in your SVG when it is clicked? You can achieve this by using jQuery's .css() method in conjunction with the data-* attribute. CHECK OUT AN EXAMPLE: STYLING IN CSS svg { height ...
My program's ajax functionality was running smoothly with jquery version 1.7, but when I updated to version 3.3.1, the ajax part stopped working. I made sure to attach the ajax portion of my code after updating the jQuery version. In the PHP file, I s ...
Currently, I am working on a webpage that includes notifications along with options to mark them as read individually or all at once. However, when attempting to use my loop function to mark all notifications as read, I noticed an issue. let markAllAsRead ...
I'm currently using Ruby on Rails 6 and I've encountered an issue while attempting to move a custom JavaScript file to an external file. I find that the JavaScript code works fine when it is within the erb file, but not when moved externally. Can ...
I'm facing an issue with Selenium WebDriver where it is not executing the desired action even though my Xpath is accurate: public class Openchrome{ public static void main(String[] args){ System.setProperty("webdriver.chrome.driver","C:&b ...
My challenge is to center a react handsontable component within a container div while maintaining its autosizing feature. In this scenario, I aim for the width of div #example1 to adapt based on the table's content (adjusting as the number of columns ...
I currently have 3 input fields. The first input field contains the start time, the second input field contains the end time, and the third input field contains the duration between the start and end times in HH:mm format. My goal is to sum up all the dur ...
I am attempting to utilize Selenium Firefox with PowerShell and need to specify the executable for portable Firefox. While I have figured out how to specify Chrome's path and make my script work with it, I have been unsuccessful in doing the same for ...
Is it possible to change the icon when I click on it using react spring? For example, if I click on " ...
My website is filled with numerous images categorized into 5 different groups, causing it to load slowly. To improve loading times, I have assigned each image a "data-src" attribute containing its actual source. Then, when a specific category is selected ...
In my Typescript-driven Angular 2 application, I am creating an email with some pre-filled information that will open the user's default email client. Currently, I have it working by constructing the mailto string directly in the component like this: ...
Hey there, I came across a javascript code called particles.js in this bootstrap template from here. It seems to be functioning properly, but the issue is that the particles are not clickable when placed under the text section. Is there a solution to make ...
I need to create a function that redirects to a different page depending on the value in the query string. This is for an asp.net web form page, and the function should be triggered when a cancel button (a devexpress button) is clicked. function OnCancelC ...
Is there a way to set a default value in ng-options based on ajax results? <select ng-model="model.stuff" ng-options="o.name for o in options track by o.id"></select> In my controller, I fetch data using the following code: $http.get("myurl" ...
Having an issue with a button that is supposed to change the status value of a db column. It seems to only work for the first 10 rows in the table and stops functioning on the 2nd page. I'm new and could really use some help with this. Here's the ...
Here is the code snippet for a Vue.js component: var list = Vue.component('list', { props: ['items', 'headertext', 'placeholder'], template: ` <div class="col s6"> <div class="search"> ...