Using TestCafe selectors to target a classname that has multiple matching nodes

I need help finding a TestCafe selector that can target an element with the same class name that appears multiple times in my HTML code. Here's what I have tried so far:

https://i.sstatic.net/ZS691.png

Despite trying various selectors, I have been unsuccessful as the element is not found in the DOM

this.policyretrieve_item2=Selector('.c-text u-text-sm--right  u-weight--600')

this.policyretrieve_item2=Selector('.c-text u-text-sm--right').nth(4)

this.policyretrieve_item2=Selector('.c-text u-text-sm--right')


If the element exists, I expect the following code to work:

.expect(this.policyretrieve_item2.exists).ok('Some values after policy search are not displayed', { timeout: config.general.shortTimeout })
   

Answer №1

Give it a shot

Use Selector('.c-text.u-text-sm--right') to find text that says 'Daniel Hancox'

Explore more here

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

Exploring MaterialUI withStyles to customize disabled switches with a CSS override

As I work on my project using React and MaterialUI, I've encountered a problem with customizing inputs. Despite trying various selectors, I can't seem to change the black color of this particular input. It would be helpful to have a clearer way o ...

Challenges with CSS div styling (border and image issues)

I won't bore you with the details, but I'm trying to overlay image links on top of a background image in specific positions. Despite my best efforts, the images are not changing no matter how much I tweak their parameters. Here is the HTML code: ...

Positioning multiple images in CSS

I am facing an issue with my background images where one of them is invisible and cannot be displayed. Additionally, the padding-top for the li a element seems to not be working properly. HTML: <ul class="menu"> <li class="item-101 current a ...

What could be causing the Navbar Collapse feature to malfunction in my Bootstrap setup?

Hey there, I'm facing an issue with the Bootstrap navbar collapse button not working. I've tried everything, followed all the steps in a tutorial, but still can't get it to function properly without altering the Signup and Login buttons. Ca ...

Is there a way for me to view the specifics by hovering over a particular box?

Whenever I hover over a specific box, detailed information appears, and when I move the mouse away, the details disappear. HTML <nav> <div> <div class="nav-container"> <a href="./about.html" ...

Implementing CSS in Laravel 8

After placing my CSS file in the public/css folder, I included it in the head section with the following code. <link href="{{ url('/css/app.css') }}" rel="stylesheet"> Unfortunately, the CSS styles are not being applied ...

Ways to condense a text by using dots in the middle portion of it

How can I dynamically shorten the text within a container that varies in width? The goal is to replace the strings between the first and last words with dots so that it fits within the container. For example, Sydney - ... - Quito. It should only replace wh ...

Ways to incorporate a dictionary into your website's content

I am in the process of developing a website for educational purposes while also honing my web programming skills. On this website, I have encountered some complicated terms that may be difficult for users to understand, so I want to implement a tooltip/mod ...

What is the best way to display value in a dropdown option field using Laravel?

I am currently working with 3 tables: hosts, visitors, and visitor_types. My objective is to display the host name and visitor type in a drop-down option button. However, I find myself a bit perplexed when it comes to the controller and route code. I have ...

Utilizing Node.js to dynamically inject variables in SASS compilation

I am currently working on an application where I need to dynamically compile SASS before rendering it on the client side (a caching system is in the works, so no worries there). At the moment, my tool of choice is node-sass and so far, everything is runnin ...

The two items are not situated side by side

Trying to make my page responsive, but when I inspect and look into mobile view, the elements do not align next to each other like they do on desktop. https://i.sstatic.net/8WhxD.png I want the shopping cart icon and button to be positioned next to each o ...

Swap out a div identifier and reload the page without a full page refresh

I am interested in learning how to dynamically remove a div id upon button click and then add it back with another button click to load the associated CSS. The goal is for the page to refresh asynchronously to reflect these changes. So far, I have successf ...

Trouble with scrolling horizontally on the website

After completing the coding for this website with bootstrap, I encountered an unexpected issue with a horizontal scroll appearing. This is my first project using bootstrap. I attempted to troubleshoot by using the 'divide et impera' method - rem ...

Navigation bar failing to show all content on Safari web browser

When navigating to this website, http://www.togethermutualinsurance.co.uk, using any browser except for Safari on Windows, the menu displays correctly. However, in Safari, the title of the menus and submenus with images does not display properly. Despite ...

Hide a div when multiple classes are filtered using jQuery

I have several divs with the class .item. When the user clicks on the Classfilter submit button, all .item elements that also have at least one class from the dateClasses array (for example ['28.09.2015', '29.09.2015']) should be hidden ...

What is preventing this DIV from stretching to the full width of its children?

Why isn't my container DIV expanding to the width of the large table? <html> <head> <link rel="stylesheet" href="http://www.blueprintcss.org/blueprint/screen.css" type="text/css" media="screen, projection" /> <link ...

Which element is able to utilize the inline-block style?

Currently, I am delving into the intricacies of the inline-block attribute and have a basic understanding that it allows elements to sit on the same row rather than stack on top of each other as they would in a normal layout. However, my grasp on how exact ...

Creating a diverse layout by dynamically adding divs without achieving uniformity in the grid

I'm working on dynamically generating a grid of divs with a specific size using the code below: function createGrid(gridSize) { var container = document.getElementById('container'); for (var i = 0; i < gridSize; i++) { va ...

Ensure that the anchor element's height fills the entire div when using the display:block property

My HTML code is very simple: <div class='mydiv'> <a href='#'>Link</a> <div> As for the CSS: div.mydiv { height: 200px; width: 200px; background-color:red; } div.mydiv a { display:block; color:yellow; b ...

Adsense ad unit is not responsive and fails to display properly at dimensions of 320x50 px

I have a unique banner ad that I want to display as the footer on my responsive website. Using media queries recommended in the advertising documentation, I am adjusting the size based on different screen widths. Check out the CSS code below: <style&g ...