An error occurred in a script injected into the tested page; TypeError: Cannot read properties of undefined (reading 'configure') #7739

Closed ayemelyanenko-chegg closed 1 year ago

What is your Scenario?

Would like to run the test without running into an undefined typeerror issue on GitLab on version 2.6 and above

What is the Current behavior?

Test fails intermittently at random places but with a consistency and is most often reproducible on GitLab on version 2.6 and above

For comparison, tests never fail with this issue when running using 2.5.1-rc.1

What is the Expected behavior?

Test should pass in all places without failing intermittently with the undefined typeerror issue on version 2.6 and above

What is your public website URL? (or attach your complete example)

https://www.chegg.com

What is your TestCafe test code?

import { t, Selector } from "testcafe";
const loginUrl = `https://www.chegg.com/auth?action=login`;
const emailForSignIn = Selector('input[id*="email"]');
const passForSignin = Selector('input[type="password"]');
const signInButton = Selector("button").withText("Sign in");
const closeButton = Selector('*[aria-label="Cancel"]');

// user log in/log out methods
async function userLogInWithCredentials(
  email: string,
  password: string
): Promise<void> {
  await t.navigateTo(loginUrl);
  await t
    .typeText(emailForSignIn, email, { paste: true })
    .typeText(passForSignin, password, { paste: true })
    .click(signInButton)
    .wait(6000);
  console.log(`Logged in as user: ${email}`);
}

/**
 Sets TestCafe config options.  This is based on the implementation of the configure function in testing-library/testcafe.
 Needed a more flexible option to assign a page for the option(s)
 One config example to pass in: {testIdAttribute: "data-test"}
 */
const configTestOptions = (
    pageRegEx: string,
    options: Record<string, unknown>
  ): Record<string, unknown> => {
    return {
      page: RegExp(pageRegEx),
      content: `window.TestingLibraryDom.configure(${JSON.stringify(options)})`,
    };
  };

fixture`Test with script`
  .clientScripts([
    {
      page: /\/.*/,
      module: '@testing-library/dom/dist/@testing-library/dom.umd.js',
    },
    configTestOptions('/.*', { testIdAttribute: 'data-test' }),
  ])
  .before(async () => {
    console.log(`Test Automation`);
  })
  .beforeEach(async (t) => {
    const tname = await (t as { [key: string]: any }).testRun.test.name;
    console.log(`**Running Test: ${tname}**`);
  });

test.meta({
    priority: 'p1',
    testRailCaseId: '288525',
  })(
    'Login test',
    async (t: TestController) => {
        await userLogInWithCredentials('test_email_chegg@chegg.com', 'Password1');
    }
  );

  test.meta({
    priority: 'p1',
    testRailCaseId: '288525',
  })(
    'Login test',
    async (t: TestController) => {
        await userLogInWithCredentials('test_email_chegg@chegg.com', 'Password1');
    }
  );

  test.meta({
    priority: 'p1',
    testRailCaseId: '288525',
  })(
    'Login test',
    async (t: TestController) => {
        await userLogInWithCredentials('test_email_chegg@chegg.com', 'Password1');
    }
  );

  test.meta({
    priority: 'p1',
    testRailCaseId: '288525',
  })(
    'Login test',
    async (t: TestController) => {
        await userLogInWithCredentials('test_email_chegg@chegg.com', 'Password1');
    }
  );

  test.meta({
    priority: 'p1',
    testRailCaseId: '288525',
  })(
    'Login test',
    async (t: TestController) => {
        await userLogInWithCredentials('test_email_chegg@chegg.com', 'Password1');
    }
  );

Your complete configuration file

module.exports = {
    skipJsErrors: true
}

Your complete test report

TypeError: Cannot read properties of undefined (reading 'configure')

Screenshots

Steps to Reproduce

Clone https://github.com/ayemelyanenko-chegg/nextjs-nodejs-example
CD into nextjs-nodejs-example/
cd into my-app
npm install
npx testcafe chrome tests/typeErrorIssue.ts -L -c 10

For comparison, downgrade to version 2.5.1-rc.1 and run step 5 again. Tests will pass each time

TestCafe version

2.6.0 and 2.6.1

Node.js version

18.16.0

Command-line arguments

npx testcafe chrome tests/typeErrorIssue.ts -L -c 10

Browser name(s) and version(s)

Chrome 114

Platform(s) and version(s)

Mac OS

Other

No response

This issue is too complex to reproduce on our side. Moreover, the log file is about 90MB. It would be very inefficient to research this log file. The only way for us to research this issue is to get a simple example that demonstrates the issue.

Whenever it's run locally, it passes. Whenever it's run on GitLab, it's intermittently failing. I'll try to decrease the log size. Would searching for An error occurred in a script injected into the tested page; TypeError: Cannot read properties of undefined (reading 'configure') in the current log file help out in any way or not really?

@AlexKamaev Hello, I managed to reproduce the issue locally. Please follow the updated steps in the 'steps to reproduce' section. Thanks.

I managed to reproduce the issue once. However, after this, I always see the following:: Is it possible to prevent this screen from appearing?

@AlexKamaev This is done as a safeguard so that non authorized users/bots don't target the site too much. I don't think there's anything that can be done in this case, maybe pressing and holding the button while it's open in live mode and then trying to rerun the test once it confirms that you're not a robot? To maybe make things easier, I grabbed the log file because I can reproduce it each time on my machine.

https://upload.disroot.org/r/y0zk7N0c#Lgtdu90XYwjl0BuJlVyBZKISBVGHGhcBsfHjCEFXbgo=

Also, I changed to a different website address where it also reproduces. Please pull in the latest from the sample repository and try to run again and hopefully, it will work fine for you. The TestCafe version that ought to work fine is 2.5.1-rc.1

I managed to reproduce the issue. Thank you for your cooperation.

Fixed in https://github.com/DevExpress/testcafe/pull/7771

DevExpress / testcafe