Ensuring Promises: WebdriverIO UI tests run smoothly on Chrome but are encountering issues on Firefox and Safari

My code is located in test.page.js, where I have defined elements on the page. Specifically, I am trying to locate the Add button using the following code:

import Page from './page';

class TestPage extends Page {
  get addButton() {
    return browser.element('#add-button > a');
  }
  getAddButton() {
    return this.addButton.getText();
  }

Based on the documentation, I expected the example below to work, but unfortunately it returns a pending promise:

import Page from './page';

class LoginPage extends Page {

    get username()  { return browser.element('#username'); }

In my test.spec.js file, I am using chai as a promise extension to assert this element:

import testPage from '../pageobjects/test.page';

it('should validate if Add button exists', (done) => {
  testPage.getAddButton().should.eventually.be.equal('Create a new thing').notify(done);
 });

This assertion passes in Chrome but fails in Firefox or Safari. I suspect there may be an issue with how I am locating the elements compared to the documentation. Can anyone provide assistance?

Answer №1

The issue seems to be stemming from how Chai is being used, rather than any errors in your element selectors which appear to be correct.

WebdriverIO has built-in functionality that eliminates the need for using the 'eventually' keyword. You can try this assertion instead:

testPage.getAddButton().should.equal('Create a new thing')

To help illustrate this, I have provided a test example for you to experiment with:

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

Executing MySQL queries through JavaScript functions

I need to create a PHP function that I can use in my JavaScript code. The issue I'm facing is that the variables from the beginning of the file are not recognized in the JavaScript block. <!DOCTYPE html> <?php include 'pdo_connect.php&a ...

Is it possible for the Blog {tag_nextpage} and {tag_previouspage} to be displayed on the same page in Business Catalyst?

I'm curious about a specific scenario regarding loading blog list contents on the same page. Is it feasible to replace the current content with either previous or next page contents when {tag_nextpage} or {tag_previouspage} is activated? I would appr ...

Update the array elements to produce smaller sub arrays containing just a single item

I have a constant called cartProducts: const cartProducts = props.cartSlice; It outputs an array with the following items: Array [ Object { "cartQuantity": 3, "product": "5f15d92ee520d44421ed8e9b", }, Object { "cartQuantity": 2, "pro ...

"Unlocking the potential of Vue.js: Grabbing the object ID with a

I am encountering an issue with accessing the object ID when I click on the edit or delete buttons in my CRUD operation. The event.target is returning the values of the edit and delete buttons instead. This is what my HTML template looks like: <div ...

(node:9263) UnhandledPromiseRejectionWarning: ValidationError: ideas validation failed: Missing required field imageUrl

Encountering the UnhandledPromiseRejectionWarning: ValidationError validation failed: imageUrl: PathimageUrlis required error when attempting to upload an image. However, removing or commenting out the required: true keyword in the model file for imageUrl ...

Automate the Selenium web driver to navigate to the following page automatically

Currently, I am working on automating the process of navigating to the next product list on a certain website. If you visit the following link, you will find the page I am referring to: Despite clicking through to the next page, the URL remains unchanged ...

Exploring cookie evaluation in AngularJS routes and templates

I am in the process of implementing a login system using cookies to ensure that a user stays logged in even after leaving the application. While I have successfully set the cookie, I am unsure of how to utilize it to restrict access to the login screen for ...

The Alertify dialog vanished without being able to confirm

While working on some code, I encountered a specific issue: alertify.dialog("confirm").set( { 'labels': { ok: 'Personal', cancel: 'Share' }, 'message': 'Select target:', ...

Is there a way for me to modify the formatting of the text that I

Can you help me transform a text that looks like this: '?category=1,2&brand=1' into something like this: '?categories[]=1&categories[]=2&brands[]=1'? I'm not quite sure how to make this change. ...

How to input a file in a form using React

I am trying to use an API to upload a file, but my formData() function is not returning anything. var formData = new FormData(); data.append("file", file[0]); const options = { method: 'POST', headers: {...}, body: formData } fet ...

encountered an undefined error while using jQuery

I have a piece of code in my header that creates a pop-up window $(document).ready(function() { //When you click on a link with the class poplight and the href starts with # $('a.poplight[href^=#]').click(function() { var popID = ...

Using html() to load dynamic data can cause the script to malfunction if the content being loaded contains special characters

Utilizing the html() function, I am retrieving dynamic data from the database and appending it to my HTML. Everything functions correctly, except when the dynamic data contains '>' or '<' tags as data. In this scenario, the script ...

Can you explain the meaning of the symbol >>=?

I'm confused about the meaning of >>= (I thought it was greater than or equal to as >=). Can you also explain what (times & 1) means in the code snippet below? function repeat (string, times) { var result = '' while (times > 0) ...

Discover how to prevent a link or text from appearing if a user has already browsed a particular webpage

Is there a way to hide a link to another page if the user has previously visited that page? For example, I have 3 options - A, B, and C. If a user selects option A, links to pages B and C are displayed at the bottom of the page. However, if they then navi ...

Is it possible to make changes to local storage data without impacting the rest of the data set?

https://i.sstatic.net/BBcJF.pngI am looking for a way to modify specific data in the local storage without affecting any other stored information. However, I have encountered an issue where editing values works correctly for the first three attempts, but ...

Steps for transforming Object A into an array of objects, each containing the properties and assigned values and labels from Object A

I have an object with specific key-value pairs and I would like to transform it into an array where each item has a label and a value: { "id": 12432, "application": "pashmodin", "unit": null, "status": ...

Ways to recycle the output of the three.js fragment shader

Recently delving into GLSL shaders in three.js, I am currently experimenting with creating a simple and efficient blur effect on a mesh texture. Below is the fragment shader code I have been working on: void blurh(in vec4 inh, out vec4 outh, int r) { ...

How can I keep a Fixed Positioned Background from Moving to the Top of the Page when Clicked?

I've created a unique image/lightbox viewer for displaying multiple images on a single page. However, there seems to be an issue with the .no-scroll class jumping to the top of the page every time it is triggered by a .click() event. I suspect this mi ...

Simulating dynamic route parameters in the Next 13 application directory

I am currently working with Jest and testing library to conduct unit tests on my NextJS application. I am facing difficulties in rendering a page on a dynamic path. Here is the code for my page/component: export default async function MyPage({ params }: { ...

How can the formatResult and formatItem options enhance the functionality of JQuery Autocomplete?

I'm a bit puzzled here - can someone explain what the formatResult and formatItem functions do in the JQuery Autocomplete plugin? I have a function that returns a comma-separated string from Django, but I'm having trouble getting my autocomplete ...