XPathSelectorError: The provided xpath expression is invalid and unable to locate the specified element

Here is an HTML snippet element:

<a ng-click="nodes.setViewType('tiles',true)">
 <span class="fa fa-check Tick-Inactive" ng-class="nodes.viewType == 'tiles'? 'Tick-Active':'Tick-Inactive'" style=""></span>
                Tile View
</a>

Attempting to use ng-click or ng-class in locators with JavaScript escape characters, but receiving an error message stating "invalid or illegal selector was specified".

element(by.xpath("//a[contains(@ng-click,'nodes.setViewType(\'tiles\',true)')]"));

element(by.css("span[ng-class^=nodes.viewType == \'tiles\']"));

element(by.xpath("//a[contains(@ng-click,'nodes.setViewType%28%27tiles%27%2Ctrue%29')]"));
javascriptseleniumselenium-webdriverxpathprotractor

Answer №1

This error message...

An incorrect or illegal selector has been provided

...indicates that the Locator Strategy you created was not a valid locator.

If you are trying to find the element with the text Tile View, you can use the following xpath :

"//a[@ng-click=\"nodes.setViewType('tiles',true)\"]"

Note : Since the element is an Angular element, you will need to add a wait condition for the element to be clickable before interacting with it.

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

Can the typical drag and drop cursors be ignored in an HTML drag operation?

I've been working with the HTML drag and drop API to allow users to resize columns in a table. However, I've noticed that when a user starts dragging a column, the cursor changes to one of the default drag and drop effects (such as move or none). ...

javascriptcsshtmldrag-and-drop

Dynamic commenting with AJAX and jQuery

I've been working on implementing live comments on my website using AJAX with jQuery alongside PHP and HTML. Despite my best efforts, the code I'm using doesn't seem to be functioning properly. In this code snippet, comments.php is responsib ...

javascriptjqueryajaxdynamic

Generate the Xpath for the mentioned href element to use with Selenium Webdriver

I need help creating the Xpath for a specific href element using Selenium webdriver with only IE browser. The HTML code I am working with is as follows: I am looking to find the Xpath for: . Can someone assist in generating the correct Xpath expression ...

javascriptselenium

Executing multiple XPath queries

I'm attempting to use the following XPath expression to select a numeric element from a group: //input[contains(@name, '[options]')][2] However, it doesn't seem to be working as expected. What I want is to target an input element on th ...

xpathseleniumselector

Printing iframe does not display CSS effects

As I work on developing a program that involves the use of iframes, I have encountered an issue with CSS effects not appearing when trying to print the iframe. Despite applying CSS successfully in browsers like IE, Chrome, Mozilla, and Edge, the printed ou ...

javascriptphpcssajaxiframe

Explore various THREE.JS 3D models through a clickable link

I am struggling to make each object open a new page using a URL when clicked. No matter what I try, it doesn't seem to work properly. Can someone point out what I might be missing or doing wrong? Here is the click event code for the objects. If needed ...

javascripthyperlinkthree.js

What could be the reason behind the failure of $cookieStore.get() in retrieving the value?

I am currently testing the cookie functionality in AngularJS. I'm encountering an issue where the console is returning 'undefined' when trying to retrieve a saved value from the cookie using $cookieStore.put(). It seems to work fine when set ...

javascriptangularjs

Error: HTMLTestRunner import issue still needs to be addressed

Encountering the error message: Unresolved import: HTMLTestRunner Here is my code: import random import unittest import HTMLTestRunner class TestSequenceFunctions(unittest.TestCase): def setUp(self): self.seq = range(10) def test_shuff ...

pythoneclipseselenium-webdriverpydev

Discovering the method to retrieve a previous month's date within a VueJs application using Javascript

Can someone guide me on how to retrieve the date of the past month using Vue? This is the code I currently have: import SomeTable from "./table/SomeTable"; export default { name: "Cabinets", components: {SomeTable}, data() { return { ...

javascriptvue.js

Arrangement of components within an entity

I have an instance (let's refer to it as myObject) that is structured like this (when you log it to the console): >Object {info1: Object, info2: Object, info3: Object, info4: Object,…} >info1: Object >info2: Object Id: 53 ...

javascriptarrayssortingobject

What is the significance of the abbreviation 'dbo' in a MongoDB - Express application?

Below is the code snippet provided: app.js const express = require("express"); const app = express(); const cors = require("cors"); require("dotenv").config({ path: "./config.env" }); const port = process.env.PORT | ...

javascriptnode.jsdatabasemongodbexpress

Combining the Powers of Angular JS and Symfony2

Currently working on a project involving Symfony2 and in need of some advice. Considering a hybrid application approach in two ways: a) Using a traditional form with CSRF Token for the Login Page handled by Symfony2, and b) Inner pages (potentially module ...

javascriptphpjsonsymfony

What is the most effective method of utilizing union or extend in TypeScript when faced with a comparable scenario?

I have a function that takes in two different types of objects: const canBeGenericOrDefaultData = { id: 123, pointData: { square: 'x145', triangle: 'y145' } } function submitHandler(canBeGenericOrDefaultData: AllTheDatas | G ...

javascripttypescripttypesinterface

Determine which JavaScript script to include based on whether the code is being executed within a Chrome extension

I am in the process of developing a Chrome extension as well as a web JavaScript application. I currently have an HTML container. I need the container.html file to include <script src="extension.js"> when it is running in the Chrome extension, and ...

javascriptgoogle-chrome-extension

Unit testing in Angular JS is crucial, especially when testing functions in services that do not return any values

Apologies if this has been asked before, but I couldn't find a solution to my issue. I need to create tests for a service within an Angular JS application. The main function of the service returns and is used as an external method. There are also a ...

javascriptangularjsunit-testingkarma-jasmine

Creating a JSON structure using an array in Typescript

Here is an example of my array structure: [ { "detail": "item1", "status": "active", "data": "item1_data" }, { "detail": "item2", "status": ...

javascriptarraysjsontypescript

What are the steps to connect to, fetch, save, and remove files from a remote file server using Node.js?

Currently working on a project in node.js that requires saving an uploaded file from a client onto a remote file server for later retrieval. While I'm familiar with accessing and storing files on the local file system using 'fs', I am unsure ...

javascriptnode.jsexpressfs

Is there a way in Vue to efficiently route multiple instances belonging to the same component while ensuring they maintain their individual states?

It's a bit difficult to capture the exact issue in the title. Here is the scenario: // In the main layout page <keep-alive> <router-view /> </keep-alive> // And I have a route { path: "something/:id", name: "someth ...

javascriptvue.jsvue-router

Header fixed vertically

I am currently working on a webpage with a minimum width requirement of 1124px. This means that whenever the browser window is smaller than that, the content of the page needs to be scrolled horizontally instead of smoothly transitioning into a responsive ...

javascriptjqueryhtmlcss

Retrieving chosen row data in Angular 6 Material Table

I am attempting to send the value of a selected row from one component to another upon clicking a button. However, in this particular example, I'm unsure where to obtain the selected row values and how to pass them on button click. After that, routing ...

javascriptangulartypescriptangular-material