Tests began failing after moving to new environment

[dmoon-kdg]

What is your Scenario?

I am in the process of moving my TestCafe test scripts to a new laptop, so I am pretty much doing the environment installation from scratch. I am seeing different behavior on the two machines. The most significant one is that tests that involve clicking on a link, which worked previously, are failing even though the link is recognized as being visible. Clicking on button elements, so far, seems to be fine.

What is the Current behavior?

As I watch the test execute, I see the cursor move toward the link element, but nothing actually happens, and the test fails when either checking the url after clicking the link or attempting to interact with elements on the next page.

What is the Expected behavior?

I expected full backward compatibility, in this specific case being able to click on link elements.

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

https://app.forgeos.co/login

What is your TestCafe test code?

import { Selector, t } from 'testcafe'
import { ClientFunction } from 'testcafe'

let emailField = Selector('input').withAttribute('placeholder', 'Enter your email')
let passwordField = Selector('input').withAttribute('placeholder', 'Enter your password')

let loginButton = Selector('button').withText('Login')
let forgotButton = Selector('a').withText('Forgot your password?')
let backToLogin = Selector('a').withText('Back to Login')
let errorBanner = Selector('.alert.alert-danger').child()
let forgotPasswordInput = Selector('label').withText('Email').nextSibling()
let resetButton = Selector('button').withText('Send Password Reset Link')
let getLocation = ClientFunction(() => document.location.href)
let successBanner = Selector('.alert.alert-success')

async function enterCredentials( inputEmail, inputPassword ) {
let tempEmail = inputEmail.toString()
let tempPassword = inputPassword.toString()
await t
.typeText(emailField, tempEmail)
.typeText(passwordField, tempPassword)
}

const TEST_DESCRIPTION = 'logins'

fixture`login_and_forgotpassword`
    .page `https://app.forgeos.co/login`


test(`${TEST_DESCRIPTION} | login page header | C2356 `, async t => {
    let imageElement = Selector('img')
	let imageSource = await imageElement.getAttribute('src')
    await t.expect(imageSource).contains('/forgeos_logo.svg')
})

test(`${TEST_DESCRIPTION} | login page available controls | C2357 `, async t => {
     await t
        .expect(emailField.exists).eql(true)
        .expect(passwordField.exists).eql(true);

    //confirm there is a button with the text 'Login'
    let testElement = Selector('button').withText('Login');
    await t.expect(testElement.exists).eql(true);

    //Confirm there is a button with the text 'Forgot Your Password?'
    testElement = Selector('.btn.btn-default').withText('Forgot your password?')
    await t.expect(forgotButton.visible).eql(true);

    await t
        .expect(Selector('label').withExactText('Remember Me').exists).eql(true)
})

test(`${TEST_DESCRIPTION} | attempt login without email and password | C2358 `, async t => {
    await t
       .click(loginButton);

    const emailMsgElement = Selector('.alert-danger').child().child().withText('The email field is required.');
    await t.expect(getLocation()).contains('/login')


    const pwdMsgElement = Selector('.alert-danger').child().child().withText('The password field is required.');
    await t
        .expect(getLocation()).contains('/login')
})

test(`${TEST_DESCRIPTION} | password reset page layout | C2364 `, async t => {
    await t.expect(forgotButton.visible).eql(true)   
    await t.click(Selector('a').withAttribute('href','/password/reset'))
    await t
      .expect(getLocation()).contains('/password/reset');

  await t
      .expect(Selector('.form-control').nth(4).prevSibling().innerText).eql("Email");

  
  await t.expect(resetButton.visible).eql(true);

  await t.expect(backToLogin.visible).eql(true);

   await t
      .expect(Selector('.panel-heading').innerText).eql("Password Reset Request");
})

Your complete configuration file

N/A

Your complete test report

Running tests in:

• Chrome 122.0.0.0 / Windows 11

login_and_forgotpassword
√ logins | login page header | C2356
√ logins | login page available controls | C2357
√ logins | attempt login without email and password | C2358
× logins | password reset page layout | C2364

1. AssertionError: expected 'https://app.forgeos.co/login' to include '/password/reset'

   Browser: Chrome 122.0.0.0 / Windows 11

   66 |
   67 | test(${TEST_DESCRIPTION} | password reset page layout | C2364 , async t => {
   68 | await t.expect(forgotButton.visible).eql(true)
   69 | await t.click(Selector('a').withAttribute('href','/password/reset'))
   70 | await t

   71 | .expect(getLocation()).contains('/password/reset');
   72 |
   73 | await t
   74 | .expect(Selector('.form-control').nth(4).prevSibling().innerText).eql("Email");
   75 |
   76 |

   at (c:\QA_Regression\ForgeOS\dci-testing\Automation\24_Login\sample.js:71:34)
   at asyncGeneratorStep (c:\QA_Regression\ForgeOS\dci-testing\Automation\24_Login\sample.js:1:39)
   at _next (c:\QA_Regression\ForgeOS\dci-testing\Automation\24_Login\sample.js:1:39)

1/4 failed (7s)

Screenshots

No response

Steps to Reproduce

TestCafe version

3.5.0

Node.js version

20.11.1

Command-line arguments

testcafe chhrome sample.js

Browser name(s) and version(s)

Chrome 122.0.6261.58

Platform(s) and version(s)

Windows 11 Business, Version 20.0.33631

Other

The test environment in which the script is successful:
TestCafe: 2.0.1
Node: 14.20.1
Browser: Chrome 121.0.6167.140
OS: Windows 11 Pro, version 23H2

[Makavelic]

Wonder if this is related to #8145?

[dmoon-kdg]

It may be somewhat related. I don't recall having any issues with running headless. Some of the tests did complete successfully, but anything that relied on clicking on an element failed, but always after the point of clicking that link.

[Bayheck]

We appreciate you taking the time to share information about this issue. We reproduced the bug and added this ticket to our internal task queue. We'll update this thread once we have news.

As a workaround, you could try disabling Native Automation mode. I managed to run your tests successfully with the
--disable-native-automation flag.

[Bayheck]

Hello,

I researched this issue, and it turned out to be an interesting case with the link on your page.

The text of your link is divided into 2 lines.

Between them, there is a blind layer of the label, which is not interactive. You can check this on your own - click this spot.

By default,

t.click(Selector('a').withAttribute('href','/password/reset'))

clicks the center of your Selector. In your case, right in this blind spot.

So, in order to click right on the link, you should add an offsetY option to your click call.

An example that worked for me:

await t.click(Selector('a').withAttribute('href','/password/reset'), { offsetY: 5 })

https://testcafe.io/documentation/402710/reference/test-api/testcontroller/click#options