Tips for extracting text from the content enclosed within <td> </td> tags using Protractor

How can I retrieve the text found in the second td?

<tr data-ng-repeat="s in systemSettings" class="ng-scope">
        <td class="ng-binding">License Key</td>
        <td class="ng-binding">rashmi123</td>
        <td align="center">
            <div data-ng-show="s.readOnly" class="text-warning ng-hide">read only</div>
            <div data-ng-show="!s.readOnly"> <a href="" data-ng-click="onSettingEdit(s)"><i class="glyphicon glyphicon-edit"></i> </a> </div>
        </td>
    </tr>

I attempted to access it using

  expect(element("tr:nth-child(2) td.ng-binding:nth-child(2)").getInnerHtml()).toBe("rashmi123");

However, it is resulting in an Invalid locator error.

javascriptangularjsautomationjasmineprotractor

Answer №1

Make sure your element locator includes types like - xpath, css, etc...

expect(element(by.css("tr:nth-child(2) td.ng-binding:nth-child(2)")).getInnerHtml()).toBe("rashmi123");

You can also utilize .getText() to retrieve the text of an element instead of getInnerHtml.

var ele = element(by.css("tr:nth-child(2) td.ng-binding:nth-child(2)"));
expect(ele.getText()).toBe("rashmi123");

Alternatively, you can use Protractor's shorthand for element(by.css()) => $()

var ele = $("tr:nth-child(2) td.ng-binding:nth-child(2)");
expect(ele.getText()).toBe("rashmi123");

I hope this information proves to be useful.

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

How to determine the length of a JavaScript object

Would like help determining the length of the report_data(object) key using the provided code, but it seems to result in a value of 3. a={report_freq: "daily", report_item_num: 2, report_num: 39, report_data: "{}"} Object {report_freq: "daily", report_ite ...

javascript

Create a loop in JavaScript to iterate through elements using both a while loop and the

I have a JSON object (returned by the server) and I am looking to iterate through it with either a while loop or forEach method in order to display the products in a shopping cart. The name of my object is response2, which contains the cart products. I w ...

javascripthtmlmysqlnode.js

The file Emailable-report.html cannot be located during the execution of my test using the commands mvn clean followed by mvn test

While working with maven and testNG, I encountered an issue. When I run "mvn clean", it successfully cleans the target folder. However, when I proceed to run "mvn test" to execute my test cases and send result emails, I receive a "java.io.FileNotFoundExc ...

javaselenium-webdriverautomationautomated-teststestng

When Vue is used to hide or show elements, MDL styles may be inadvertently removed

When an element is hidden and shown using Vue, some MDL styles may disappear. Take a look at this example on CodePen: https://codepen.io/anon/pen/RBojxP HTML: <!-- MDL --> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=M ...

javascripthtmlcssvue.jsmaterial-design

Enable the jQuery UI Autocomplete feature with Google Places API to require selection and automatically clear the original input field when navigating with the

I am currently using a jquery ui autocomplete feature to fetch data from Google Places... The issue I am experiencing is that when the user navigates through the suggestions using the up and down arrows, the original input also appears at the end. I would ...

javascriptjqueryjquery-uiautocomplete

Oops! There was an unexpected error: TypeError - It seems that the property 'title' cannot be read because it is undefined

HTML document example <ion-header> <ion-toolbar color="danger"> <ion-buttons> <button ion-button navPop icon-only> <ion-icon ios="ios-arrow-back" md="md-arrow-back"></ion-icon> </button> ...

javascriptangulartypescriptionic-frameworkionic3

Issue with Cypress GitHub Actions Build: Module Not Found Error

While setting up Cypress tests in a GitHub Actions workflow, I am facing an issue during the build process. Strangely enough, everything runs smoothly on my local machine. However, when I initiate npm run build, I am met with the following error message: ...

npmautomationcypress

Challenge with the submission event listener

I am struggling to create my first event listener for the submit button that should respond to both a click and an enter key press. Currently, it is not working for either event, and I am unsure why. I do not intend to send any data to another page; I simp ...

javascriptsubmitaddeventlistener

Tips for manipulating elements in arrays using JavaScript and ReactJS: Adding, editing, updating, and deleting items

I currently have a form that looks like this: https://i.sstatic.net/nuaiM.png Below is the table where I am adding elements to an array: https://i.sstatic.net/EvDpX.png Using the code excerpt below, I am adding values from the form into an array: cons ...

javascriptarraysreactjs

Filtering with checkboxes (looking for help with logic functionality)

Yesterday, I sought assistance with a similar question and was able to make progress based on the response provided. However, I have encountered another issue that has left me stuck. Current behavior: Clicking on a checkbox changes the background color of ...

javascripthtml

JavaScript scope: retrieving variable information

Even though this question has been asked multiple times in various ways, I am looking to extract the value of the selected variable in another part of the highest-level function (the alert function currently returns undefined). I understand that I need t ...

javascriptjqueryscope

How can I prevent the enter key from working with Twitter Typeahead?

Is there a way to prevent the enter key from being pressed on an element within Twitter Typeahead's dropdown feature while using Angular with Typescript? I attempted to utilize preventDefault() when event.keycode === 13 on the ng-keydown event for th ...

angularjsangulartypescriptangularjs-directivetwitter-typeahead

JavaScript code encountered an error: "SyntaxError: missing ) after argument list" near the end of the file

Upon encountering an issue, the following error message appears: SyntaxError: missing ) after argument list (line 120) Even though the JavaScript components have been validated without any bracket issues being flagged. An attempt was made to troublesh ...

javascripthtmljsond3.js

Filtering JSON objects within nested objects using Angular

I'm facing an issue while attempting to filter my data based on the routeparam. It seems like the problem might be stemming from the structure of my JSON. Angular doesn't seem to be able to filter objects within objects. Is there a custom filter ...

jsonangularjs

What are the steps to clipping a canvas using CSS clip-path?

When it comes to clipping a canvas, there are multiple methods that can be used. One way is to create a path with getContext('2d') and set globalCompositeOperation. Another method involves using -webkit-clip-path or clip-path, though the latter m ...

javascriptcsshtmlcanvaswebkit

Removing an element with a specific class that was created with Javascript can be done by clicking outside the box

I needed to eliminate an element that was created using JavaScript of a specific class when clicked outside the box. I have created a color-picker using .createElement and added a class to it. Now, my goal is to remove that picker whenever a click occu ...

javascripthtmlcss

Issues with Angular-UI-router resolve functionality not functioning as expected

I have encountered a problem in my Angular-ui-router where the use of resolve is causing my site to send out multiple get requests per second without loading the view. My stack consists of the full MEAN-stack. The views are generated using inline template ...

javascriptangularjsroutesangular-ui-routermean-stack

The Highcharts width spills over the parent div boundaries

I am currently working on a dashboard design where I need to incorporate a chart using highcharts, along with an action box in a row format. Within the action box, I also require two buttons aligned in a column. The challenge I am facing is that the chart ...

angularjshighchartsangular-material

"What is the purpose of using the `position: absolute` property for movement transitions while deleting an item from a list

Click here to see an example where items smoothly move in a list when one item is removed. To achieve this effect, the element needs to be styled with: .list-complete-leave-active { position: absolute; } I'm curious as to why it doesn't work w ...

javascriptcssanimationvue.js

Managing the rendering of charts in Angular with Directives

I'm in the process of creating an admin page with multiple elements, each revealing more information when clicked - specifically, a high chart graph. However, I've encountered a challenge with the rendering of these charts using a directive. Curr ...

javascripthtmlangularjs