To interact with a specific cell in a table using Protractor, simply click

I have a dataset containing various elements such as images, text, and numbers. I am struggling to click on a specific text within the dataset. As someone new to e2e testing with Protractor, any assistance would be greatly appreciated.

I specifically need guidance on how to click on the text "Created By Test Automation".

<td class="custom-t-act mat-cell cdk-column-name mat-column-name ng-tns-c15-3 ng-star-inserted"
    _ngcontent-c15="" mat-cell="" role="gridcell>
  <h5 _ngcontent-c15="" class="mb-0 pointer" tabindex="0"
      ng-reflect-router-link="/projects/created-by-test-auto">
    <b _ngcontent-c15="" class="ng-tns-c15-3">Created by Test Automation</b>
  </h5>
</td>

Answer №1

If you are certain about the text that should be displayed, then the solution is to use the by.cssContainingText method.

element(by.cssContainingText('b', 'Created By Test Automation')).click();

Alternatively, if you are unsure about the text, you can try this approach:

$('[ng-reflect-router-link="/projects/created-by-test-auto"]').click();

This will click on the element with the ng-reflect-router-link directive set to /projects/created-by-test-auto, specifically a h5 element.

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

Sending a PDF document to a function that specifically calls for a file location or URL

Currently, I am developing a web application for an online library where I need to extract metadata from PDF files that are uploaded. To achieve this, I am utilizing the nodejs libraries pdf.js-extract and multer-gridfs-storage for file uploads. However, I ...

Can you suggest an alternative for the "return" statement within a "for loop" in order to retrieve all values from the loop?

When using numInOrder + " : " + nameInOrder;, the console only displays one value: "1 : a". However, I would like to see: "1 : a 2 : b 3 : c 4 : d 5 : e 6 : f" in the console.log output. Additionally, I do not want to use consol.log(numInOrder + " ...

Incorporating Dynamic Events into HTML Generated on the Fly within a Vue.js Component

Currently, I am facing an issue where I am trying to dynamically generate HTML in a Vue.js component. While I have successfully rendered the HTML, I am struggling to connect the events for these dynamically generated elements. To illustrate this problem, I ...

Troubleshooting my CSS navigation bar - What am I missing?

I've been developing a navigation bar using a combination of HTML, CSS, and JavaScript. After writing the code and setting the display of the bar to fixed, I encountered an issue where the content of the page was overlapping the nav bar. Below you&ap ...

Ways to modify the hue of an li element in the context menu upon hovering

I'm currently working on a project that involves VueJS and Bootstrap. To enhance user experience, I've incorporated a context menu using the npm package called vue-context Vue Context Menu When a user hovers over an item on the context menu, the ...

AngularJS allow you to make interval calls with parameters

How can I use the $interval function to call another function with a parameter? $interval(getRecordEveryTime(2), 100000); function getRecordEveryTime(contactId) { console.log(contactId + ' timer running'); } ...

What could be causing jQuery's Promise.reject to fail?

Currently, I'm dealing with a REST API that resembles this stub: Snippet 1 (example based on Ruby on Rails). I have some existing jQuery code using classic callbacks: Snippet 2 It's running with these logs: case 1: [INFO] /api/my/action1: rece ...

Running Javascript code after rendering a HandleBars template in Node/Express

I have a Node.js application where I am trying to load data into a jQuery datatable after the data has been fetched. Currently, I am able to populate the table with the data, but I am facing issues initializing the datatable. Here is how I render the temp ...

What could be causing my externally hosted React component to malfunction when being imported via NPM?

After successfully creating a standalone component within my original project, I decided to explore the possibility of releasing it as an NPM module. To kick off this process, I attempted to load the library from another repository using NPM in a new proje ...

Dotted JavaScript property within an object

Having trouble sorting an array of objects using the lodash orderBy function because it doesn't work when the iteratees contain a dot in the middle. For a better understanding of the issue, check out this plunker. plunker ar users = [ { 'us ...

The compatibility issue between jQuery Tabs and Sliding effect

Hey there, I'm currently working on a website that requires a vertical tab system. I also have an arrow image that shows which tab or thumbnail the user has selected, and it should smoothly slide between the two thumbnails. You can check out the pro ...

Tips for passing command line arguments using a Protractor configuration file

Our current e2e test framework is protractor-cucumber. Previously, we have been using a conf file where the environment details are statically defined within the conf JSON. I am interested in passing user-defined arguments with the protractor_conf file as ...

Constance in JavaScript

Looking to create constants in Javascript and seeking advice on the best way to do so. While I am aware that true constants don't technically exist, I'm finding it difficult to change values after exporting them. Are constants necessary? Is the ...

"How to prevent users from using the back button on Google Chrome and Edge browsers

window.history.pushState(null, null, location.href); window.addEventListener('popstate', () => { history.go(1); alert('The use of back button is restricted.'); }); An issue has been identified where the code snippet above d ...

Update the src attribute in an HTML document

I am looking to dynamically change the size of an image on an HTML page using a dropdown list. Here is my code: <html> <head> </head> <body> <select id="selectbox" name=""> <opti ...

Trouble with two dropdown selections in Angular and preset values

I am encountering an issue with a select input in angular 7. The scenario involves having 2 selects where selecting an option in the second select populates the corresponding values in the first select. The first select should display a default placeholder ...

Detecting single letters in a sentence and changing their appearance using CSS

Looking to make a subtle change to text? I need to swap out single letters in a passage (I have a cat that ate a fish). Any ideas on how to do this? The goal is to input a block of text into a textbox, then display it in a div. I've had difficulty fi ...

React's connect method is causing issues with my test case

Attempting to create a test case for my jsx file... Took a sample test case from another jsx file... The other file does not have the connect method... But this new file contains the connect method... Believe this is causing issues with my test case... Any ...

Angular - the utilization of expressions in view templates

Exploring Angular for the first time and attempting to create a Single Page Application (SPA). I have included the route module, which seems to be functioning properly. However, the templates are not interpreting Angular expressions as expected - for examp ...

Modify the text and purpose of the button

I have a button that I would like to customize. Here is the HTML code for the button: <button class="uk-button uk-position-bottom" onclick="search.start()">Start search</button> The corresponding JavaScript code is as follows: var search = n ...