How to access saved values in WebdriverIo using Typescript

I am currently using WebdriverIO along with Typescript for automating an Android app. Scenario:

  1. Go to the Training Page
  2. Get the Session name (This value changes dynamically)
  • I want to store the retrieved session name in a variable and then later assert it

I have implemented the following code. However, it is not working as expected. Can someone please help me identify what I have done wrong here?

Thank you!!

training.ts

import BaseAppScreen from "./base-app.screen";
    
const SELECTORS = {
    Training_Card_Session_Name: (`~trainingItemTitle0`), // This is the dynamic element
};

export default class TrainingScreen extends BaseAppScreen{
    constructor() {
        super(); 
        $(SELECTORS.Training_Card_Session_Name).waitForDisplayed();
    }

    getSessionNameOfTrainingCard(): string{ 
        var trainingSessionName = $(SELECTORS.Training_Card_Session_Name).getText();
        return trainingSessionName;
    }     
}

training.spec.ts

import TrainingScreen from '../screenobjects/training.screen';
    
describe('Training Sessions', () => {
  let trainingScreen: TrainingScreen;

  let trainingSessionName: string;
    
  beforeAll(() => {
    loginScreen = new LoginScreen();   
  });
  
  it(`Select a Training Card`, () => {
    trainingScreen.getSessionNameOfTrainingCard();
    expect(trainingScreen.getSessionHeaderTitle()).toEqual(trainingSessionName); // Assertion of stored text value
  });
});

Answer №1

The correct steps have been executed as shown above.

When working with training.spec.ts, there is no requirement to reference the variable within the toEqual assertion. trainingScreen.getSessionHeaderTitle() already captures the text returned and stores it in the trainingSessionName variable. Thus, verifying its equivalence to the actual title is straightforward.

For example:

expect(trainingScreen.getSessionHeaderTitle()).toEqual('TRAINING'); // The title TRAINING remains constant.

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

What is the process for importing a TypeScript module in the StackBlitz editor?

When I enter the editor at Stackblitz.com and start a new Angular project, it comes with default files and folders already set up. In the "Dependencies" section, I decide to add shortid. So, I input that in the designated box and it begins loading the cor ...

Strategies for retaining a list of chosen localStorage values in Angular6 even after a page refresh

When I choose an option from a list of localStorage data and then refresh the page, the selected data disappears. selectedColumns: any[] = []; this.listData = [ { field: "id", header: "Id", type: "number", value: "id", width: "100px" }, { field: "desc ...

Oops! Looks like an issue has popped up: using require() of an ES module is not supported when using recharts in combination with next.js

I've noticed some similar questions, but none of them seem to address my particular issue. I'm currently working on a webapp using next.js (with typescript). Within the app, I am utilizing recharts, however, I am encountering a compilation error: ...

Make sure to include all enum type values within the function's body to ensure comprehensive coverage

I am defining an enumeration called ApiFunctions with values like "HIDE", "SET_READ_ONLY", and "DESCRIPTION". Also, I have a type ValueOfApiFunction that should include all values of ApiFunctions. Additionally, I have a logic that listens for messages on ...

Even as I create fresh references, my JavaScript array object continues to overwrite previous objects

Coming from a background in c# and c++, I am facing some confusion with a particular situation. Within the scope of my function, I am creating a new object before pushing it into an 'array'. Strangely, when I create the new object, it appears to ...

Creating a Blob or ArrayBuffer in Ionic 2 and Cordova: Step-by-Step Guide

Is there a way to generate a blob or an arrayBuffer with TypeScript when using the Camera.getPicture(options) method? I am currently working on an Ionic 2/Cordova project. var options = { quality: 90, destinationType: Camera.DestinationType.FILE_ ...

Encountering a "Null Pointer Exception" with the Appium Driver

After successfully working on appium with Selenium and Testng for some time, I suddenly encountered a null pointer error while executing my script. I'm not sure what is causing this issue. Can anyone provide insight into what might be wrong with the s ...

Encountering "Cannot write file" errors in VSCode after adding tsconfig exclude?

When I insert the exclude block into my tsconfig.json file like this: "exclude": ["angular-package-format-workspace"] I encounter the following errors in VSCode. These errors disappear once I remove the exclude block (However, the intended exclusion fu ...

Nextjs introduces an innovative "OnThisDay" functionality, leveraging getServerSideProps and Date.now() to provide real-time information

I am currently working on adding an "OnThisDay" feature in my Nextjs project, inspired by Wikipedia's style of displaying events that happened on a specific date. To achieve this, I have implemented a function structured like the following code snippe ...

Strategies for splitting a component's general properties and accurately typing the outcomes

I am attempting to break down a custom type into its individual components: type CustomType<T extends React.ElementType> = React.ComponentPropsWithoutRef<T> & { aBunchOfProps: string; } The code appears as follows: const partitionProps = ...

Choosing radio buttons within rows that contain two radio buttons using ngFor

This section showcases HTML code to demonstrate how I am iterating over an array of objects. <div class="row" *ngFor="let item of modules; let i = index;"> <div class="col-md-1 align-center">{{i+1}}</div> <div class="col-md- ...

Unable to translate text on the loading page

Encountering a peculiar issue with the translate service. Here's how I set it up: export class AppComponent implements OnInit { constructor( private translateService: TranslateService, angulartics2GoogleAnalytics: Angulartics2GoogleAnalytics ...

Is there a way to view Deno's transpiled JavaScript code while coding in TypeScript?

As I dive into Typescript with Deno, I am curious about how to view the JavaScript result. Are there any command line options that I may have overlooked in the documentation? P.S. I understand that Deno does not require a compilation step, but ultimately ...

Retrieve the part of a displayed element

Presently, I am developing a modal system using React. A button is located in the sidebar and the modal is represented as a div within the body. In the render function of the main component of my application, two components are being rendered: MyModal M ...

While attempting to utilize npm install, I encounter an error on a discord bot stating "msvsVersion is not defined."

Struggling with self-hosting a TypeScript discord bot, the setup process has been a puzzle. It's supposed to generate a build directory with an index.js file, but it's unclear. Installed Visual Studio Build Tools 2017 as required, yet running npm ...

Is it possible to specify broad keys of a defined object in TypeScript using TypeScript's typing system?

const obj: {[key: string]: string} = {foo: 'x', bar: 'y'}; type ObjType = keyof typeof obj; Is there a way to restrict ObjType to only accept values "foo" or "bar" without changing the type of obj? ...

Encountered a PrismaClientValidationError in NextJS 13 when making a request

I am currently working on a school project using NextJS 13 and attempting to establish a connection to a MYSQL database using Prisma with PlanetScale. However, when trying to register a user, I encounter the following error: Request error PrismaClientValid ...

What is the best way to add a 'Drawer' component into the 'AppBar' using React MUI within the Next.js framework?

My goal is to create an App bar with a 'hamburger' icon on the left that, when clicked, will display a Sidenav (drawer). I am working with React Material and Next.js (App router) and need to have the app bar and drawer as separate components, hea ...

Angular 2 and TypeScript: Mastering Checkbox Data Binding

Below is the HTML view in which user roles are checked. I want to bind a table of modified user roles using the actualizeRoles() method. How can I achieve this? <md-accordion class="example-headers-align"> <md-expansion-panel hideToggle=" ...

Angular: Clicking on a component triggers the reinitialization of all instances of that particular component

Imagine a page filled with project cards, each equipped with a favorite button. Clicking the button will mark the project as a favorite and change the icon accordingly. The issue arises when clicking on the favorite button causes all project cards to rese ...