Unable to define checkbox with dynamic id in Protractor

Seeking assistance in defining and selecting a specific checkbox to complete the account creation process. The challenge lies in the fact that part of the input id is dynamic and changes with each execution. Hence, the current method is ineffective:

var nativeChannels = element(by.css("label[for='dp-native-9597']"));

Upon inspecting the element, the following code is displayed:

div class="switch"input id="dp-native-9597" type="checkbox" ng-model="controls.allNativeChannels" class="cmn-toggle cmn-toggle-round ng-pristine ng-untouched ng-valid" autocomplete="off">label for="dp-native-9597">/label/div

label for="dp-native-9597"/label

Efforts to use a wildcard character after dp-native- have proven unsuccessful. Is there an alternate method to define this checkbox and proceed with the tests?

Your insight and assistance are greatly appreciated!

javascriptangularjsprotractor

Answer №1

Here is a helpful xpath you can try out: .//label[contains(@for,"dp-native-")]

Answer №2

CSS offers wild card selectors which can be found at http://www.w3schools.com/cssref/css_selectors.asp :

[attribute^=value]  a[href^="https"]    This selects every <a> element with an href attribute value starting with "https"
[attribute$=value]  a[href$=".pdf"] This selects every <a> element with an href attribute value ending in ".pdf"
[attribute*=value]  a[href*="w3schools"]    This selects every <a> element with an href attribute value containing "w3schools"

You can try using one of these selectors, like so:

$(".switch[id*='dp-native'] label")

If you prefer to search by model, check out http://www.protractortest.org/#/api?view=ProtractorBy.prototype.model:

element(by.model('controls.allNativeChannels')).$('label');

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

A Step-by-Step Guide to Implementing Social Logins (Facebook, Google, LinkedIn, and Github) in Angular 6

https://i.sstatic.net/QLDZ6.png Configuration in App.module.ts const config = new AuthServiceConfig( [ {id:GoogleLoginProvider.PROVIDER_ID, provider:new GoogleLoginProvider('358720783918-g6gv4vsabi786qcj0sbvkm2v36totpio.apps.googleusercontent.com&ap ...

javascriptangular

Displaying the data from duplicated table rows

Below is the table that was generated: https://i.sstatic.net/WIzz6.jpg This table was created using the following code: <table class="table table-bordered"> <thead> <tr> </tr> </thead> &l ...

htmlangularjshtml-tablehttp-post

Authorization based on user roles in Node.js or Express.js

Are there any modules available for implementing role-based authorization in node.js or Express js? For example, having roles such as Super Admin, Admin, Editor, and User? ...

javascriptnode.jsexpressauthorizationuser-roles

Avoiding the issue of multiple submissions in Ajax forms

My website's contact form sometimes experiences a delay in sending submissions. When users, in their impatience, click the submit button multiple times, it results in the form being sent repeatedly to the host. To address this issue, I attempted to ...

javascriptjqueryajax

A skeleton framework lacking a data storage backend

I am currently developing an offline javascript application that must be compatible with IE7, ruling out the use of localStorage. The app does not require any information persistence, as a refresh clears everything. My query is regarding setting up Backbo ...

javascriptjsonbackbone.jslocal-storage

Small-scale vue iterates through elements with v-for but fails to display them

I'm really interested in Petite-vue, but I've been struggling to get even the basic functionalities to work. Unfortunately, there isn't a lot of examples or tutorials available online for petite-vue. Can anyone suggest good resources? Right ...

javascriptvue.jspetite-vue

Utilize Express Node to display API information on HTML pages using Handlebars template

I'm seeking assistance in rendering data from an API to HTML using handlebars. I'm a bit puzzled on how to properly showcase the data on the webpage. Here's what I have so far: ROUTES FOLDER/FILE: const express = require('express&ap ...

javascriptnode.jsexpresstemplateshandlebars.js

An issue arises when attempting to utilize v-model with a file input

Is there a way to reset a file input field in Vue.js after uploading a file? I attempted to set the v-model value to null, but encountered an error message that said: File inputs are read only. Use a v-on:change listener instead. This is my current cod ...

javascriptvue.js

Display the title when the mouse hovers over

I am currently working on a minimalist portfolio site where I showcase various projects through images on the landing page. As I iterate over all the projects using {projects.map(({ id, title, route, src }, index) => ())}, I encountered an issue with di ...

javascriptreactjsreact-hooksstyled-components

Flattening an array of Map in Typescript involves combining all the

I am working with an array containing entries of type Map<string, number> Is there a way to flatten this array into a single map? Map<string, number>[] converted to Map<string, number> Appreciate any help on this matter. ...

javascripttypescriptflatten

Looping through each combination of elements in a Map

I have a Map containing Shape objects with unique IDs assigned as keys. My goal is to loop through every pair of Shapes in the Map, ensuring that each pair is only processed once. While I am aware of options like forEach or for..of for looping, I'm s ...

javascriptarraystypescriptobject

Using Angular with THREE JS integration in Javascript

I am currently experimenting with Angular and facing a challenge that I can't seem to figure out. The issue I am encountering involves integrating a javascript code, SunLight.js, from the repository https://github.com/antarktikali/threejs-sunlight in ...

javascriptangulartypescriptthree.js

Utilize res.render in Node.js to pass multiple data arrays to the view

I am facing an issue with populating two separate selects in my view with different arrays. Can anyone guide me on how to pass two distinct JSON objects using res.render? I have attempted the method below without success. const result1 = {data1: "val ...

javascriptnode.jsarraysjsonejs

Hide the 1, 2, 3 page buttons in Datatables pagination and instead display only the Next and Previous buttons for navigation

I recently implemented datadables.net pagination for my HTML table. I am looking to customize the pagination buttons by hiding or removing the 1, 2, 3 ... buttons and only display Next and Previous Buttons. Is there a way to achieve this by setting paging ...

javascriptjqueryhtmlpaginationdatatables

What is the reason behind Q.js promises becoming asynchronous once they have been resolved?

Upon encountering the following code snippet: var deferred = Q.defer(); deferred.resolve(); var a = deferred.promise.then(function() { console.log(1); }); console.log(2); I am puzzled as to why I am seeing 2, then 1 in the console. Although I ...

javascriptangularjspromise

Developing a Cloud Function for Stripe that is taking forever to finalize writing data to Firestore

Currently, I am facing an issue with my Google Cloud function (provided below) that handles webhooks from Stripe payments and stores some data in Firestore. The problem is that it seems to hang for approximately 3 minutes before completing. const Stripe = ...

javascriptnode.jsgoogle-cloud-firestoregoogle-cloud-functionsstripe-payments

The JQuery Full Calendar embedded within a div tag will only become visible once the calendar click event is activated

Upon entering my page, various sections (images, calendar, info, etc) are displayed within div tags. These div tags are hidden or shown based on which navigation link is clicked on the left side of the page. However, I am facing an issue where the calendar ...

javascriptjqueryhtmlfullcalendar

Using ValidationGroup to trigger JavaScript calls from controls

Is it possible to trigger a JavaScript function from the "onclientclick event" of a button that has a ValidationGroup assigned? <asp:Button ID="btnTest" runat="server" Text="Test" OnClick="btnTest_Click" ValidationGroup="Valid ...

asp.netjavascript

Javascript Error - Issue with Fuse.js: e.split() function is not recognized

Scenario - I am in need of implementing a fuzzy search feature, and therefore utilizing fuse.js for this purpose. I obtained the code snippet from fuzzy.min.js at https://github.com/krisk/Fuse/blob/master/src/fuse.min.js Challenge - Despite using the cod ...

javascript

Creating a Pre-authentication service for AWS Cognito using VueJS

Implementation of Pre-Authentication feature is needed in my VueJS application for the following tasks: Validation of ID/Refresh Token to check if it has expired. If the IdToken has expired, the ability to re-generate it using the Refresh Token or altern ...

javascriptvue.jsamazon-cognito