Unable to interact with Span in a table cell - Protractor/Typescript error

I am facing an issue where clicking on the Span Element within a Grid cell is not working. I have tried using actions and the code below, but neither worked for me. Any advice would be greatly appreciated.

async SaveorCancelRow() {
    var table = this.component;
    var tbody = table.element(by.xpath(".//tbody"));
    var trs = tbody.all(by.tagName("tr")).get(1);

    //Click Save tr[@class='SearchResultItemView customGridHighlight']//td[3]
    await trs
      .element(by.xpath('.//td[3]//span[contains(@class, "save")]'))
      .click()
      .then(function() {
        browser.sleep(5000);
      });
  }
}

Answer №1

Check out the shortened version of this code snippet.

async PerformSaveOrCancel() {
    await this.component
             .element(by.css('tbody > tr.SearchResultItemView > td > span.save'))
             .click()

    return await browser.sleep(5000);
  }
}

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

Receiving feedback from an http.post request and transferring it to the component.ts file in an Angular

Currently, I am facing an issue with passing the response from an http.post call in my TypeScript service component to an Angular 2 component for display on the frontend. Below are the code structures of my service.ts and component.ts: getSearchProfileRes ...

Tips for testing nested HTTP calls in unit tests

I am currently in the process of unit testing a function that looks like this: async fetchGreatHouseByName(name: string) { const [house] = await this.httpGetHouseByName(name); const currentLord = house.currentLord ? house.currentLord : '957'; ...

Ignore the dialogue prompting for your location

I'm currently using Selenium in combination with Chromedriver for automating the testing of a website. One of the features I'm dealing with involves Location Services, which I've already enabled for the Chrome browser that's being used. ...

Here is a guide on showcasing information obtained from ASP.NET API in Angular version 13

My goal is to fetch motorcycle data from a web API and showcase it in my Angular project. ASP.NET Framework Web API 4.7 Angular CLI: 13.3.7 Angular: 13.3.11 On the Web API end: Controller: [EnableCors(origins: "*", headers: "*", ...

Update the router URL without switching pages, yet still record it in the browser history

One of the features on my search page allows users to perform searches and view results. Initially, I faced a challenge in updating the router URL without navigating, but I managed to overcome this by utilizing the "Location" feature. In my ngOnInit meth ...

The absence of a semicolon in the non-null assertion is causing an

Within my code, I have a function that arranges a set of cards according to a specific coordinate system: const orderCardsInPage = (items: OrderItemType[], pageCards: CardType[]) => { return pageCards.sort((firstCard, secondCard) => { con ...

Collective picture in the exhibit

I recently created a photo gallery that showcases various images sorted by categories. In this setup, I have one object containing both images and their respective categories, and another object solely dedicated to storing the categories. The challenge I ...

Guide to running asynchronous code synchronously in Angular 5

Currently, I have a function that loops through a list of files and for each file, it triggers an async method to manipulate the image and add it to an array. The problem is that the async calls are occurring simultaneously, causing the UI to freeze. My g ...

Different ways to maintain the original syntax highlighting colors in JavaScript console

Upon closer inspection near the green arrows, you can see that the default console.log function colorizes values based on their type, distinguishing between string and number. In contrast, highlighted near the red arrows is my attempt at using Winston to ...

Putting VueJS, typescript, and jest to the test: examining the contents of a dropdown list web-component

Currently, I am in the process of testing a dropdown list within a web component utilized in a VueJS application. My main focus is on checking whether the dropdown list actually contains items fetched through an HTTP query (handled in a vuex store) once t ...

Navigating iframes with Selenium: A guide to locating elements

I'm attempting to locate elements within an iframe, but I'm encountering issues. Below is my code and the error message I am receiving. Here is the script I am using: public class Add_Lists { public static void main (String []args) throws ...

What causes the object type to shift away from 'subscribe'?

Currently, I am facing an issue with retrieving a Coupon object from the server using a REST API in combination with Angular. The problem arises when I attempt to access the 'subscribe' method - within the 'subscribe', the object is of ...

The exclude option in Nest JS middleware does not prevent the middleware from running on excluded routes

I'm having an issue with excluding certain routes from the middleware. The .exclude option doesn't seem to be working as expected, as the middleware is still being applied to the excluded routes. Here is the code for the Middleware: https://i.st ...

What are the methods for comparing List<WebElement> elements in WebDriver?

I am currently working on automating the testing of a Dual List Box. My objective is to compare the selected values (left side) with the moved values (right side list). Below is the code snippet I have developed for this purpose. Select allFromListData = ...

The Ngrx action fails to finish despite encountering an error during execution

An Issue with Action Completion Post-Error Within my application, I have implemented an action for deleting a user. Prior to deletion, the user is prompted on screen with a Dialog to input the administrator password. If the correct password is provided, t ...

The Typescript generics are unable to be assigned to type T

Take a look at my code snippet: interface IDoc { doSomething(): void } class IDocFoo implements IDoc { doSomething(): void { console.log('Do doSomething'); } } class IDocFactory { getIDocInstance<T extends IDoc>(): T { re ...

Selenium encountered a situation where Chrome abruptly shut down after successfully populating the form

I am currently using selenium and have encountered an issue where the chrome browser closes immediately after filling out a form. I would like to prevent this from happening as I want the browser to remain open. Below is my code: from lib2to3.pgen2 import ...

Do Angular lifecycle hooks get triggered for each individual component within a nested component hierarchy?

I'm exploring the ins and outs of Angular lifecycle hooks with a conceptual question. Consider the following nested component structure: <parent-component> <first-child> <first-grandchild> </first-grandchild& ...

The Power of Angular 2's Reactive Form Validation

I am currently developing a custom validator for a group of inputs within my dynamic form. this.transitionForm = this.fb.group({ effectiveStartDate: [this.utils.dateToISO(startDate), Validators.compose([Validators.required, this.validateDates])], effe ...

It seems like the recent upgrade to yarn 2 has caused issues with typescript types, whereas the installation of the same project with yarn 1 was

Recently, I've been attempting to update a typescript monorepo to utilize yarn 2, but I've encountered an issue where typescript is struggling to recognize certain react props. This functionality was working fine in yarn 1.x, leading me to believ ...