Selectors
Selectors
Selectors are the most important part of any User Journey Script. They tell the software what objects to interact with on your website. Problems with selectors can cause your User Journey to encounter issues. Read on for some of the common selector issues and how to fix them.
Out-of-date selectors
One of the most common reasons for user journeys to fail is incorrect or out-of-date selectors.
An out-of-date selector is when the selector in the script no longer matches the site. This could be because
- Your development team have made some changes to the site.
- A third-party element or provider you use has made changes to the element HTML.
To fix the script, you will need to identify the problem selector and update it.
Example
In this example, we have gotten several User Journey failures in a row. This suggests there is something wrong with the script or the site!
First, go to failure analysis and look at the visual tab to see if there are any differences.
Visual failure analysis
Here we can see that both the passed and failed test results look the same, with a web form displayed on the page. There do not seem to be any visual issues with the site so the failure must be something else.
The next step is to go to the script failure tab.
Here we can see what is causing the script to fail; the second action, a Wait For Element, has been unable to use the selector .formEntry. We can see that in a previous test, the .formEntry selector worked.
We have verified that both pages contained the form, so it is more likely that the selector for the form is no longer .formEntry and should be updated with something else.
To find the new selector, we will go to Inspect Element on the webpage we want to check (hint: most browsers allow you to do this by right-clicking the page). Here, we can diagnose the failure; the selector for the form is now .customerWebForm.
Inspect Element on the webpage to view the updated selector.
We can test the new selector by pressing CTRL F/CMD F and searching for the .customerWebForm. As it then becomes highlighted in green, we know that the selector is valid.
Now all we need to do is update the script with the new selector.
Updating the script with the .customerWebForm selector.
Illegal selector
If you find the selector works on the website, but not on the user journey, you should check you have selected the correct type for the selector. For example, you might be using an Xpath selector labelled as a CSS Selector.
The selector is Xpath, therefore the selector type needs to be changed. Otherwise, the User Journey will be unable to recognise it.
You should also check the syntax of the selector you have used and check for any errors.