A guide on identifying the ng-reflect ng class attribute using ProtractortoHaveLength: "Locating the ng-

<div _ngcontent-c3="" class="bs-massage typ-user active" ng-reflect-klass="bs-massage  typ-user active" ng-reflect-ng-class="[object Object]" id="msg_user_step_2">
    <p _ngcontent-c3="" class="msg">
        cvds sadf
    </p>
    <a _ngcontent-c3="" class="btn btn-icon btn-edit">
    </a>
    <div _ngcontent-c3="" class="timestamp">
        <time _ngcontent-c3="" class="time" datetime="11:00">
            5:28 PM
        </time>
    </div>
</div>

Issue:

Element not found using locator

Assistance needed in locating this element via the provided code:

describe("Application Form", function()
        {
            it(" DETAILS", function()
            {
                browser.get("http://localhost:4200/online-application-form.html/Personal");
               element(by.css("bs-massage type-user active").sendKeys("username1"));
var el = element(by.id('msg_user_step_3'));
            el.sendKeys("username 2");

     });
    });

Alternatively:

var el = element(by.id('msg_user_step_3'));
el.sendKeys("username 2");

Answer №1

There are a couple of issues with this code snippet:

element(by.css("bs-massage type-user active").sendKeys("username1"));

Firstly, there is an incorrect placement of a closing parenthesis.

Secondly, the class name should be typ-user, not type-user (based on the provided HTML code).

Lastly, multiple classes should be connected by dots:

element(by.css(".bs-massage.typ-user.active")).sendKeys("username1");

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

What could be causing slice to fail to slice an array?

I've been using the slice function for a while now without any issues, but I'm having trouble with .slice() not actually slicing the data. Code: (why is it not working as expected?) let data data = await Models.find().sort([['points', & ...

Data vanishing in upcoming authentication session in test environment

I have encountered an issue with next auth in my next.js project. During development, the session data is lost if the server refreshes or if I switch to another tab and return to it. This forces me to sign out and then sign back in to restore the session d ...

What is the best way to transfer variables between two Vue files?

How can I transfer a variable between two Vue files? Hello, in my SendCode.vue file, I have a variable named NewEmail that I would like to use in another file called changePass.vue. Is there any way to do this? Can someone offer assistance? Thank you</p ...

What is the best way to modify the CSS of a child element within the context of "$(this)"

On my search results page, each result has an icon to add it to a group. The groups are listed in a hidden UL element on the page with display:none. The issue I'm facing is that when I click on the icon for one result, the UL appears under every sing ...

Experience with GAE sessions vanishing following a POST request initiated by JavaScript

Currently, I am working with a GAE application that utilizes a session for storing information. Alongside this, there is an Android app in place which interacts with the GAE by sending requests and subsequently using the session when receiving responses. P ...

Generate an array of arrays containing objects using different variable names

Here is the issue at hand: const data : [ {labelSlug: 'cola', category: 'catering', subCategory: 'drinks', provider: 'coca cola'}, {labelSlug: 'cola', category: 'catering', subCategory: 'drin ...

EventEmitter asynchronous callback

Can you attach an asynchronous callback to an EventEmitter in TypeScript or JavaScript? someEmitter.on("anEvent", async () => console.log("hello")); If so, does using an async function guarantee that the function will run asynchronously? Also, what ar ...

The connection between Mongoose and the nodejs app cannot be established

I've been attempting to integrate Mongoose with my Node.js environment, but I'm encountering an unexpected error. Previously, I was able to connect with Mongoose using the same commands, but for the past few days, it's been throwing errors. ...

Creating recurring shapes in the Canvas element

I just joined this platform and I'm trying to create an animation using canvas. My goal is to redraw a circle every 2 seconds with a canvas reset in between. The circle should appear randomly within the canvas, which I was able to accomplish. However, ...

Incorrect elements displayed by Preact

Currently, I am utilizing Preact (essentially React) to display a list of items stored in a state array. Each item is accompanied by a remove button. My issue arises when the remove button is clicked; the correct item is deleted (I have double-checked this ...

What is the best way to ensure my dropdown menu closes whenever a user clicks anywhere on the page? (javascript)

I have created a dropdown that appears when the user clicks on the input field, but I would like to remove the active class so that the dropdown disappears if the user clicks anywhere else on the page. Here is my code snippet: // drop-down menu functi ...

Tips for eliminating the left and bottom border in a React chart using Chart.js 2

Is there a way to eliminate the left and bottom borders as shown in the image? ...

What is the process for printing a page in plain text format on a matrix-dot printer?

I've come across many similar questions on SO about this issue, and I've tried various solutions without success. I'm using an Epson LX300+II printer and I want to print pages from my web application in a plain format, like how it would look ...

I'm having trouble executing the JavaScript function

function contentChange(){ var paragraphs = document.getElementsByTagName("p"); for(var i = 0 ; i < paragraphs.length ; i++){ paragraphs[i].innerHTML = "hello" ;}} contentChange(); I'm struggling to change the content of all ...

Loading indicator for the Worklight application

Our app's loading process is quite lengthy, so to keep the user informed that the app is indeed working and just needs time to load, we decided to implement a loading/initializing indicator. I initially attempted to use WL's busy indicator but fo ...

Calling JavaScript functions from ASP.NET code-behind

A question has been updated. Reference: The following HTML link "Add Regular" is functioning correctly. When clicked, it displays the notification showing that the related .js and .css files are working. HTML Link <a href="#" id="add-regular">Add ...

Sending input values through an identifier within a pop-up dialog box

Struggling with my jQuery and Ajax skills, especially when it comes to editing data. The add method works fine, but the edit functionality is giving me trouble. I have a route for editing like /edit/{id}, and whenever I click the button in the modal, it ...

Guide on incorporating amcharts into a Nuxt application

I am attempting to integrate amCharts into my Nuxt project. Within the svg-map.vue component, I have added the following code snippet: head() { return { script: [ { src: 'js/amcharts/core.js' } ] }; }, However, I e ...

Getting the FullCalendar event ID in order to delete events with Laravel: How can it be done?

Currently, I am developing a calendar application using Laravel and FullCalendar. One of the functionalities I am trying to implement is the ability to delete an event by clicking on it in the calendar, which will trigger a modal popup with a delete button ...

Dynamically adjust input controls with ease using jQuery and Bootstrap

Upon reviewing the code provided in this link, I attempted to customize it by adding new dropdown lists to my form. However, the results were not as expected – alignment issues and incorrect labeling arose. Here is the updated code snippet: <div clas ...