Failed to click login button

[AmolForAll]

What is your Scenario?

In our login test case, the script successfully enters the Username and Password, and it clicks the Login button, but it does not navigate to the next page (Looks just like its hovering over the button) . As a result, the next test fails due to the absence of the expected locator in the DOM

What is the Current behavior?

In our login test case, the script successfully enters the Username and Password, and it clicks the Login button, but it does not navigate to the next page (Looks just like its hovering over the button) . As a result, the next test fails due to the absence of the expected locator in the DOM

What is the Expected behavior?

It should click and navigate to next page so that other tests get appropriate locators over the DOM

What is the public URL of the test page? (attach your complete example)

Not Public Yet

What is your TestCafe test code?

await new action.Click({
testControl: t,
options: {
mappings: mappings,
language: language,
category: 'Login',
action: 'click',
data: 'Login'
}
}).execute();

Your complete configuration file

import action from './action';

const actionList = {
CLICK: action.Click,
DOUBLECLICK: action.Click,
NAVIGATETOMENU: action.NavigateToMenu,
TYPETEXT: action.TypeText,
APPENDTEXT: action.TypeText,
ASSERT: action.Assert,
BACK: action.NextBack,
NEXT: action.NextBack,
SCROLL: action.Scroll,
CONDITIONALCLICK: action.ConditionalClick,
READVALUE: action.ReadValue,
PRESSKEY: action.PressKey,
UPLOAD: action.Upload,
DRAG: action.DragToElement,
WAIT: action.Wait,
PROCESSXML: action.ProcessXml,
FILEACTION: action.FileAction,
FETCHCYCLEDETAIL: action.FetchCycleDetail,
HOVER: action.Hover
}

export interface ITestCase {
number: string,
category: string,
steps: string,
execute: boolean,
success?: boolean
}

export interface ITestRunner {
mappings: { [key: string]: any },
language: { [key: string]: any },
categories: { [key: string]: any },
testCases: ITestCase[]
}

class TestCaseBuilder implements ITestRunner {
mappings = null
categories = null
language = null
testCases = []

constructor(config: ITestRunner) {
    Object.assign(this, config);
}

start() {
    const { mappings, language } = this;
    fixture('HexaVue').page(mappings.URL)
        .beforeEach(async t => {
            await t.maximizeWindow(); // we can check this a first as well
            await new action.TypeText({
                testControl: t,
                options: {
                    mappings: mappings,
                    language: language,
                    category: 'Login',
                    action: 'TypeText',
                    data: `Username Field=${mappings.Username}`
                }
            }).execute();

            await new action.TypeText({
                testControl: t,
                options: {
                    mappings: mappings,
                    language: language,
                    category: 'Login',
                    action: 'TypeText',
                    data: `Password Field=${mappings.Password}`
                }
            }).execute();
            await new action.Click({
                testControl: t,
                options: {
                    mappings: mappings,
                    language: language,
                    category: 'Login',
                    action: 'click',
                    data: 'Sign In'
                }
            }).execute();
        
           r;

Your complete test report

1. The specified selector does not match any element in the DOM tree.

   > | Selector('.col-sm-8:nth-child(1) .w-100:nth-child(3) .px-2')
   

   Browser: Chrome 129.0.0.0 / Windows 11

      6 |test('loginTest', async t => {
      7 |    await t
      8 |        .typeText(Selector('#user_session_login'), 'admin')
      9 |        .typeText(Selector('#user_session_password'), 'Admin123!@#')
     10 |        .click(Selector('#login'))
   > 11 |        .click(Selector('.col-sm-8:nth-child(1) .w-100:nth-child(3) .px-2'))
     12 |        .click(Selector('#menuPreOp'))
     13 |        .click(Selector('a').withText('EquipmentVue'));
     14 |});
     15 |
   
     at <anonymous> (C:\Test\Sample Test\logintest.ts:11:10)
     at <anonymous> (C:\Test\Sample Test\logintest.ts:8:71)
     at __awaiter (C:\Test\Sample Test\logintest.ts:4:12)
     at <anonymous> (C:\Test\Sample Test\logintest.ts:6:29)
   

1/1 failed (13s)

Screenshots

No response

Steps to Reproduce

1. Enter User Name
   2.Enter Password
2. Click login - Fails to click

TestCafe version

3.6

Node.js version

20.XXX

Command-line arguments

direct testcasebulilder file

Browser name(s) and version(s)

any

Platform(s) and version(s)

No response

Other

No response

[github-actions]

Thank you for submitting a bug report. We would love to help you investigate the issue. Please share a simple code example that reliably reproduces the bug. For more information, read the following article: How To Create a Minimal Working Example When You Submit an Issue. We look forward to your response.