Can one incorporate multiple page objects in a single test without using chaining?

Within my codebase, I have 3 distinct page objects: main.js, login.js, and menu.js. Each of these files contains functions that are named after the file itself, making up a series of tests.

  • main : main()
  • login : login()
  • menu : menu()

For instance, in main.js, I have the following structure:

module.exports={
  commands=[{
      main:function(){
        return this.click("@login")
      }
  }],
  elements:{
     login: {
       locateStrategy:'xpath'
       selector: ('//a[@name="Log in"]')
      }
  }
}

One test scenario involves executing main -> login -> menu.

I attempted to achieve this like so:

var main = client.page.main()
var login = client.page.login()
var menu=client.page.menu()
...
var ok=main.main()
if(!ok){
 return ok
}else {
 return login.login()&&menu.menu()
}

However, I consistently encounter this error message:

{ status: -1,
  value:
   { error: 'invalid session id',
     message: 'No active session with ID null',
     stacktrace: '' },
  errorStatus: 6,
  error: '' }

I am curious about how calling the page object affects the client and what could be a viable solution to resolve this issue. Additionally, while searching for answers, I came across Multiple page objects in one test case, but unfortunately, it did not provide a direct solution as I need to reuse these objects multiple times (not just A->B->C, perhaps A->C->B or A->C).

Answer №1

After exploring the linked question I mentioned earlier, I was able to find a successful solution by incorporating an additional callback in each page object.

Main.js:

module.exports={
  commands=[{
      main:function(callback){
        return this.click("@login")
                   .perform(callback)
      }
  }],
  elements:{
     login: {
       locateStrategy:'xpath'
       selector: ('//a[@name="Log in"]')
      }
  }
}

Login.js

module.exports={
      commands=[{
          login:function(callback){
            return this.setValue("@id",'admin')
                       .setValue("@pw",'admin')
                       .perform(callback)
          }
      }],
      elements:{
         id: {
           locateStrategy:'xpath'
           selector: ('//input[@name="id"]')
          }
          pw: {
           locateStrategy:'xpath'
           selector: ('//input[@name="password"]')
          }
      }
    }

Menu.js:

module.exports={
  commands=[{
      menu:function(callback){
        return this.waitForElementVisible("@welcome")
                   .perform(callback)
      }
  }],
  elements:{
     welcome: {
       locateStrategy:'xpath'
       selector: ('//a[@name="Welcome !"]')
      }
  }
}

Within my test script :

var main=client.page.main()
var login=client.page.login()
var menu=client.page.menu()
...
return main.main(function(){
          login.login(function(){
            menu.menu(function(){})
          })
       })

Although not the exact method I originally intended (not chaining page objects), it still achieves the desired outcome effectively.

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

Kendo UI Web - MultiSelect: choosing an option multiple times

Currently, I am encountering an issue with the Kendo UI MultiSelect widget when trying to select an option multiple times. An example of this is shown in the image below where I want to choose Schindler's List again after selecting The Dark Knight. Ho ...

Dealing with JavaScript Events

I have developed an amazing plugin called https://github.com/suprMax/Zepto-onPress Everything works perfectly except for one small issue. When I receive a callback function, I need to store it along with my actual event handler so that I can detach it whe ...

Using grid-template-areas in ReactJS function components does not function as expected

REMINDER: Check out and customize the code in CodeSandbox. This is a parent component with 5 children elements. Among them, 3 are React components and the remaining 2 are regular HTML buttons: import "./App.css"; import React from "react&qu ...

Tips for enabling autofocus in mat-select列表。

I am working on an angular project where I am using Angular Material and a mat-select element. In my form, the mat-select is the first element, and I want to set auto-focus on it when the page loads. However, I have been facing some difficulties achieving ...

"Seeking to access the call stack in the VSC debugger? Unfortunately, console.trace() turns out to

When I'm stopped in the VSC debugger, I am unable to retrieve the call stack using console.trace(). https://i.stack.imgur.com/f6jke.png ...

Finding the Ideal Location for Controllers in an Express.js Project

I'm relatively new to software development and one concept that I find challenging is organizing the directory structure of various projects. As I prepare to embark on an Express project, I prefer keeping controller classes separate from route callbac ...

Selenium failing to access try block following webpage refresh

I've created a code snippet that utilizes a try-except block to monitor an event. The code is designed to wait for 10 seconds and refresh the page if a specified button is found in the try block. If the button is not found, the page should be refreshe ...

Is it possible to include multiple URLs in a single cURL request to retrieve product information?

I am trying to retrieve products from the "generic/products" URL and the "generic/all_products" URL using a single cURL request. Here is my code: <?php $ch = curl_init(); $request_url = "HTTP://www.yourdomain.com/net/WebService.aspx?"; $request_u ...

The extended class possesses a distinct type from the base class, which is reinforced by an interface

Is it possible to write a method that is an extension of a base class, but with a different return type, if supported by the shared interface, without adding a type declaration in class 'a'? In practical terms, classes a & b exist in JavaScript ...

Is there a way to showcase the content of a text file in a sequential manner using Javascript/AJAX?

I am attempting to retrieve text data from a server file and exhibit it within a specific division on my website. Check out the AJAX/Javascript code I have been working with: <body onload="loadXMLDoc()"> <script> function loadX ...

Should each HTTP request in a Node web app open a separate MongoDB connection?

I've integrated MongoDB into my Express.js Node web app. Here's what I have so far: // in app.js var mongodb = require('mongodb'); var mongourl = /* ... */; // These are just examples: app.get('/write', function (req, res) ...

Utilize a viewpoint alteration alongside a floating effect on a specific element

I thought this would be an easy task, but I seem to be missing something as it doesn't work for me. The goal is to use the perspective() and rotateY() functions in a transform to create a perspective effect on an element. Additionally, there should b ...

Verify a document located on another server

My objective is to prompt the user to download a file generated by my script and upload it onto their server (this functionality has been successfully implemented). The purpose of this task is to confirm that the user can indeed upload files to the website ...

What is the best way to update a calendar date using Selenium and Python?

Looking for assistance in changing the date using selenium on this calendar: Any suggestions on how to go about it? Here is my current basic code: from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.chrome.op ...

Navigating the maze of Express.js routes

When attempting to use sendFile to call my index.html page, I encountered a problem. The issue is that the index.html page displays without any of the CSS or JS/jQuery effects applied. This is what my server.js file looks like: var express = require("exp ...

Issue with Component: Data is not being injected into controller from ui-router resolve, resulting in undefined data

Encountering an issue with resolve when using a component and ui-router: the data returned after resolving the promise is displaying as "undefined" in the controller. Service: class userService { constructor ($http, ConfigService, authService) { th ...

The text-center alignment in Bootstrap doesn't seem to be applying to buttons

After spending a considerable amount of time trying to center two buttons in Bootstrap, I came across the "text-center" class offered by Bootstrap. However, no matter where I include this class, it doesn't seem to have any effect on the alignment of t ...

When navigating to a new route in VueJS with parameters, the browser displays the previously used

Scenario In my app, I am using vue.js 2.6 and vue-router 3.0. Within the app, there are links to detail pages set up like this: <div v-for="item in items"> <router-link :to="{name: 'details', params: {key: item.shortKey}}"> &l ...

Unable to retrieve a string from one function within another function

Three functions are responsible for triggering POST API calls, with the intention of returning a success or failure message to whoever invokes them (Observable<string>). In an effort to avoid repetition, I introduced a new function to retrieve succe ...

Guide on displaying data from a list in aspx with javascript/Jquery from aspx.cs

Code in aspx.cs file protected void Page_Load(object sender, EventArgs e) { foreach (UserDetail l in liststUser) { UserName = l.Name; ...