nighttime surveillance struggled to locate the element based on its identifier

On my page, I have the following HTML DOM structure and I am using Nightwatch to write test cases.

<td class="GPNWDJGHV" id="gwt-debug-MenuItem/mongo-true">Mongo Extension</td>

When trying to select the element using its ID with the '#' symbol, it doesn't find the element:

.waitForElementVisible('#gwt-debug-MenuItem/mongo-true', 10000)

But if I use the classname instead, it works as shown below:

.waitForElementVisible('GPNWDJGHV', 10000)

The only difference is that the ID contains a special character '/'. Could this be the reason why Nightwatch cannot pick it up? How can we handle IDs with special characters?

EDIT1

I attempted to escape the '/' in the ID like so:

.waitForElementVisible('#gwt-debug-MenuItem\/mongo-true', 10000)

However, it still does not work. Surprisingly, this selector works in CSS. The behavior seems different when using Nightwatch.

javascriptseleniumnightwatch.js

Answer №1

This issue does not stem from Selenium or Nightwatch, but specifically relates to HTML IDs. The character "/" is deemed invalid for an ID.

XPath utilizes the "/" symbol to choose child nodes within a parent node: http://www.w3schools.com/XML/xml_xpath.asp

w3schools provides a straightforward example for testing purposes: http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_id

Edit: It may be possible to workaround this by escaping the slash in the CSS selector with \/. (Please note that this was only tested on the w3schools demo using id="first/name".)

HTML:

<td class="GPNWDJGHV" id="gwt-debug-MenuItem/mongo-true">Mongo Extension</td>

JS:

.waitForElementVisible('#gwt-debug-MenuItem\/mongo-true', 10000);

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

Tips for keeping the options menu visible even when the video is paused

As I was creating my own customized Video player, I encountered an issue where I wanted the options bar/menu to disappear when the user became inactive. While I have managed to achieve this functionality, I still require the option bar to remain visible ...

javascriptreactjsnext.js

What is the procedure to reduce my final search result by 1?

When the search is triggered, I want to filter the images by name. However, the issue arises when trying to make everything disappear on filter addition. <ul id="list2"> <li class="in2"> An extra number is added ...

javascripthtmljquerycssajax

Upon the second click, the addEventListener function is triggered

When using the window.addEventListener, I am encountering an issue where it only triggers on the second click. This is happening after I initially click on the li element to view the task information, and then click on the delete button which fires the eve ...

javascripthtmlcssnode.jstypescript

Troubleshooting a JQuery GET request failure

I'm attempting to send a GET request once the user inputs a value and use that input as a parameter, but nothing seems to be happening. The alert outside the get function is working fine. Here's my code: $(document).ready(function(){ $( "input[ ...

javascriptjqueryajaxhtml

What causes the axios Library to fail in initiating a request if the API call does not begin with "https://"?

This issue has been resolved, but I still want to ask it in order to gain a better understanding of the underlying processes. So, I am using an API to retrieve data on the current weather in a specific city. The API call (as per the provider's documen ...

javascriptreactjspromiseaxios

JQuery: Issues with attaching .on handlers to dynamically added elements

I'm currently developing a comment system. Upon loading the page, users will see a box to create a new comment, along with existing comments that have reply buttons. Clicking on a reply button will duplicate and add the comment text box like this: $( ...

javascriptjqueryajax

Encountering a 500 error in production when making a call to the Next.js API

I have a dedicated API folder within my next.js application to handle server-side endpoints: import { NextApiRequest, NextApiResponse } from 'next' import Cors from 'cors' // Setting up the CORS middleware const cors = Cors({ method ...

javascriptnext.jsfetch-apivercelproduction-environment

The onChange event of the dropdownlist in MVC is not functioning correctly and is not properly triggering the action

Hey everyone, I'm trying to achieve a functionality where changing the selection of a dropdown list will trigger an AJAX call to a specific action with some data being passed. Below is the code I have implemented for this purpose. Despite verifying th ...

javascriptjqueryajaxasp.net-mvc-4onchange

Utilizing jQuery Ajax to submit multiple forms using a single selector in one go

I'm having an issue with jQuery Ajax involving multiple forms. Each time I execute it, only the top form works properly while the others do not function as expected. Can anyone provide assistance with this? Here is the source code: <form id="form_ ...

javascriptphpjqueryajax

Is there a discrepancy in the value between data and computed properties in Vue components?

Upon reviewing my code, I have noticed that the value shown in the data of the component does not match the desired value. The code snippet is provided below: View.component('xxx-item',{ props:['item'], template:`xxxx`, computed: ...

javascriptvue.jsvue-component

Enhancing the Canvas with JavaScript: Implementing 2048

In my high school computer science class, my partner and I chose to create a unique version of the game 2048 for our final project. Instead of traditional moving tiles, we are implementing a grid with properties like number and color assigned to each til ...

javascripthtmlcanvas

Bigger than 100x100 Soundcloud profile picture size

Is it possible to retrieve a user's image larger than 100x100 using the Soundcloud API? Upon reviewing their documentation, I have not come across any images exceeding this size: An ideal solution would involve some form of Javascript implementation. ...

javascriptsoundcloud

Steps for establishing a connection to a MongoDB database on Heroku using mongoose

Everything is running smoothly with my app locally and it can successfully connect to the local database. However, when I attempt to run it on Heroku, I encounter the following error: 2014-04-17T06:32:23.404458+00:00 app[web.1]: > <a href="/cdn-cgi ...

javascriptnode.jsmongodbherokumongoose

Looking to create an infinite loop in Python that continuously imports another file while utilizing Selenium?

I am trying to run a program every 30 seconds, but it seems that every time I try to execute the code it stops after running it just once... Currently, I have a single .py file (named: loop) that contains the loop. Within this loop, another .py file (name ...

python-3.xselenium

Tips for saving an array from the server into a script variable

I'm currently working with the express js framework along with Handlebarsjs as the templating engine. My aim is to pass an array from the router to the view, and then store this array within a script tag. //users is an array res.render('chatRoom ...

javascriptnode.jsexpresshandlebars.js

Can an EJS variable be transferred to an Angular ng-repeat filter?

I am currently working on a profile page where I need to display a user's name in plain text using <%= user.local.name %>. This requires querying the database through Mongoose. My issue now is figuring out how to pass that value to an Angular ng ...

javascriptangularjsnode.jsejs

JQUERY confirm dialog causing AJAX malfunction

I am encountering an issue where I am trying to execute an ajax function only after the user confirms a dialogue using JQUERY confirm. Strangely, when I include the confirmation step, my code throws an error and does not function properly. It's worth ...

javascriptjqueryajax

Utilizing a different file to arrange and establish state

In a separate file called Origin.js, I have some data (objects) stored. This data is exported using the spread operator within an object named OriginState: Origin.js //info const info = { title: '', year: '', }; //images const ...

javascriptreactjsstate

What is causing the 'info' object to be undefined?

transporter.sendMail(mailOptions,(error,info)=>{ if(error) console.log(error) console.log('Message Sent: '+info.messageId) console.log('Preview URL: '+nodemailer.getTestMessageUrl(info)) res.redirect('contacts', ...

javascriptnode.jsexpressnodemailer

When attempting to save a .jpg file, the dialog box opens despite having a custom firefox profile set up to prevent it

Seeking assistance with creating automated tests in selenium webdriver using cucumber for downloading various files. Currently encountering issues specifically with downloading jpg files while employing a custom firefox profile. Need guidance on how to e ...

firefoxseleniummime-typesdownload-manager