• Use Cases
    • Type
      • EnterpriseHigh traffic websites with advanced functionality, such as booking, browsing or paying.
      • Small/MediumWebsites with low-mid traffic that have one or more key functionalities including checkout, sign-ups or account login.
      • AgenciesAgenciesWeb agencies that help clients build, maintain and improve their websites.
    • Industry
      • eCommerce
      • Travel
      • Gambling
      • Public Sector
    • Team
      • Technical
      • Digital
  • Platform
    • Platform
      • PerformanceRapidSpike’s performance tools help you improve website speed, so you can boost conversions and keep customers coming back.
      • SecurityProtection from web skimming attacks, scan for the latest vulnerabilities, check your external perimeter and more.
      • ReliabilityCustomer complaints can drive away future business. It’s vital you find, fix and prevent any issues fast.
    • Top Features
      • User Journeys
      • Magecart Attack Detection
      • Core Web Vitals Monitoring
      • Uptime
      • Alerting & Integrations
    • Take a guided tourLearn how RapidSpike can support your business today.
  • Customers
  • Learn
    • Learn
      • BlogNews updates and articles about web monitoring.
      • Knowledge BaseDocumentation and other resources for customers.
      • RapidSpike AcademyTraining courses and guided tutorials.
      • About UsWe help make the web faster, safer and easier to use.
      • PressSee what the press are saying about RapidSpike.
    • From The Blog
      • Return On Investment Website Revenue CalculatorReturn On Investment Website Revenue Calculator
      • 3 Website Reliability Metrics Councils Should Be Measuring3 Website Reliability Metrics Councils Should Be Measuring
      • Marketing Campaign Highlight - NEOMMarketing Campaign Highlight: NEOM Organics
      • The World Cup Of WebsitesThe World Cup Of Websites
  • Pricing
  • Log In
  • Get Started
  • Use Cases
    • Type
      • EnterpriseHigh traffic websites with advanced functionality, such as booking, browsing or paying.
      • Small/MediumWebsites with low-mid traffic that have one or more key functionalities including checkout, sign-ups or account login.
      • AgenciesAgenciesWeb agencies that help clients build, maintain and improve their websites.
    • Industry
      • eCommerce
      • Travel
      • Gambling
      • Public Sector
    • Team
      • Technical
      • Digital
  • Platform
    • Platform
      • PerformanceRapidSpike’s performance tools help you improve website speed, so you can boost conversions and keep customers coming back.
      • SecurityProtection from web skimming attacks, scan for the latest vulnerabilities, check your external perimeter and more.
      • ReliabilityCustomer complaints can drive away future business. It’s vital you find, fix and prevent any issues fast.
    • Top Features
      • User Journeys
      • Magecart Attack Detection
      • Core Web Vitals Monitoring
      • Uptime
      • Alerting & Integrations
    • Take a guided tourLearn how RapidSpike can support your business today.
  • Customers
  • Learn
    • Learn
      • BlogNews updates and articles about web monitoring.
      • Knowledge BaseDocumentation and other resources for customers.
      • RapidSpike AcademyTraining courses and guided tutorials.
      • About UsWe help make the web faster, safer and easier to use.
      • PressSee what the press are saying about RapidSpike.
    • From The Blog
      • Return On Investment Website Revenue CalculatorReturn On Investment Website Revenue Calculator
      • 3 Website Reliability Metrics Councils Should Be Measuring3 Website Reliability Metrics Councils Should Be Measuring
      • Marketing Campaign Highlight - NEOMMarketing Campaign Highlight: NEOM Organics
      • The World Cup Of WebsitesThe World Cup Of Websites
  • Pricing
  • Log In
  • Get Started

Back to Knowledgebase

Categories

Account & Billing

Getting Started

Performance Monitoring

Alerts & Notifications

Uptime Monitoring

Security Monitoring

Synthetic User Journey Monitoring

Interpreting Data

Assurance and Search

Sitemap Monitoring

Other Articles

User Journeys: Video Journeys

How to Create a Synthetic User Journey

What is Synthetic User Journey Monitoring?

Choosing Appropriate Selectors

User journey scripts are made up of steps and within these steps are actions. In order for the actions to interact with your site, they need selectors. Choosing the appropriate selectors is key to a successful user journey. You can choose from a variety of conditions for your selections, Here is a list of those currently available:

  • cssSelector
  • className
  • id
  • name
  • linktext
  • partialLinkText
  • tagName
  • xpath

Out of these conditions the easiest and most effective to use is the ‘cssSelector’ and ‘xpath’. To find selectors to use you need to open DevTools on your browser, we recommend using chrome. Right-click on your website and click ‘Insect’ which will open a new window. DevTools offers a vast amount of information however we are specifically interested in the ‘Elements’ tab. If you are unfamiliar with this panel there are many resources online covering each type of HTML tag and element.

To make scripting easier we recommend using an additional monitor and using DevTools in a separate window to make selectors easier to see. If you want to be taken to a specific element on your page you can right-click on it and press inspect which will highlight within DevTools. If you already have a selector and want to find it within the elements list, press ‘CMD’ + ‘F’ to open the search box.

Element List - DevTools

We will now look at the two types of selectors we primarily use. We will use the example of clicking a button on the RapidSpike site. Below is a screenshot of the RapidSpike homepage, for this article we will try clicking the ‘Login’ button.

RapidSpike Homepage

Using cssSelector

When choosing a cssSelector we are looking for a unique ‘id’ or a ‘class’ for the element you are looking to interact with. When inputting a selector into the script editor you have to take note of a few things:

  • Include a # before an ID (For example: #loginbutton)
  • Include a . before a class (For Example: .checkout.button)

These selectors can be used at the same time as long as you include a space between the different elements you are interacting with. If you want to use two separate parts of a class such as in the first div in this screenshot:

Div Elements

You can type: .faw-background.bgc-white0

It is worth noting that this only works if you enter in consecutive parts of the class and you wouldn’t be able to use a class of .faq-background.p-50 as the script editor won’t recognise this.

Going back to the RapidSpike site, our first step is to right-click the login button and click ‘inspect’ to jump to the element in DevTools.

Element Hierarchy

This has selected an ‘a’ tag which signifies a hyperlink. This is the correct link as it is the URL of our login screen. Just above this in the hierarchy is a ‘li’ (a list item) with an ID and a class we could use. It is more common for an ID to be unique that a class so we will go ahead and test the ID in the search box (Remember to use a # before entering in the ID.

Search Box with Selector

We can see that this is 1 of 2 meaning it isn’t unique. To ensure the script editor picks up the element you want to click it is essential that the selector we are using is unique. To make this unique we will now look up the hierarchy to see if we add another class or ID.

Here we can see an ID of ‘menu-header-menu’.

DevTools Elements

Going back to the search box we can now input this before the ID we found earlier.

Unique Selector

This is showing as 1 of 1 meaning it is unique and good to use in our click of the login button.

There is a simpler way to find a selector however we strongly recommend you do not use this method as it will likely lead to an unstable user journey. To immediately find a selector you can right-click on the element and click ‘Copy’ then ‘Copy Selector. The reason we avoid this is that the selector may not be unique and it can rely on many elements to stay in the same place.

Here is an example of a selector for a featured product image using the ‘Copy Selector’:

maincontent > div.carousel-12-columns > div.container-fluid.container-fluid–custom-.swiper-container.content-asset-body.swiper-container-initialized.swiper-container-horizontal > div.row.row–custom-.swiper-wrapper > div.col.home-swiper-slide.swiper-slide.homepage-wrapper.swiper-slide-next > div > div > a > section > picture > img

And here is the same element using our method of finding a suitable selector:

.shop.design .image

Using xpath

Using xpath takes a little more knowledge than using CSS as you need to understand how the selectors are formed. xpath can be more powerful than using a cssSelector as you are able to search for text, move up and down the element hierarchy and more more. There are many resources online for you to access and we highly recommend doing some research.

We will briefly cover two xpath expressions that you can use:

Contains Function – This expression looks for a specified tag name containing a specific attribute. Unlike cssSelectors you are able to search for other things than just class or ID and just need to include the attribute and value within the selector.

Example Structure: //tagname[contains(@attribute,’Value’)]

Example With Values: //Input[contains(@name,’address’)]

Text Function – This expression allows you to directly select an element containing specific text. If you have a site with dynamic selectors this can be extremely useful.

Example Structure: //tagname[text()=’ActualText’]

Example With Values: //a[text()=’Terms of Use’]

Here is an alternative selector to the cssSelector we used for the login button earlier, within xpath you are even able to select the first selector on the page if it isn’t unique:

This was a very simplistic look at choosing selectors for your user journey covering the basics. It would be useful to do further reading on this topic and try using our script editor for yourself. If you have any questions or need assistance, you can always contact our support either through live chat or via email at support@rapidspike.com.

We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies.
Cookie settingsAccept
Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Always Enabled
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDurationDescription
cookielawinfo-checbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytics
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
SAVE & ACCEPT

Start your free 30-day trial today

Start monitoring today, no credit card required. Or chat to our friendly team about your requirements.

Get StartedLet’s Talk

RapidSpike - Global eCommerce Winner 2021
RapidSpike - Northern Digital Awards Winners
RapidSpike - Insider Yorkshires Most Exciting Companies
RapidSpike - UK Dev Awards 2021 Winner
RapidSpike - Prolific North Top Tech 30 To Watch
RapidSpike - Cyber Accelerator Alumni

Copyright © 2023 — All Rights Reserved.

RapidSpike - AWS Well Architected
RapidSpike - AWS Partner Network
  • Solutions
    • Technical
    • Digital
    • eCommerce
    • Travel
    • Gambling
    • Public Sector
    • Enterprise
    • Small/Medium
    • Agencies
    • New Relic
    • Customers
    • Pricing
  • Platform
    • Performance
    • Security
    • Reliability
    • How It Works
    • Insights
    • Alerting & Integrations
    • All Features
    • Synthetic User Journeys
    • Google Lighthouse
    • Core Web Vitals & Performance
    • Page Load
    • Real User Monitoring
    • Vulnerability Scanning
    • Magecart Attack Detection
    • Uptime
    • Assurance & SEO
  • Learn
    • Blog
    • Knowledge Base
    • RapidSpike Academy
    • System Status
    • RapidSpike Roadmap
    • Log In
  • Company
    • About Us
    • Contact
    • Careers
    • Press
    • Privacy Policy
    • Terms & Conditions
    • Vulnerability Disclosure