Failure to locate React elements by name when enclosed in a React fragment

[asnaseer-resilient]

What are you trying to achieve?

I want to locate React elements by their names.

What do you get instead?

CodeceptJs fails to locate these element.

Provide console output if related. Use --verbose mode for more details.

     Evaluation failed: Timed out
      at ExecutionContext._evaluateInternal (node_modules/puppeteer/src/common/ExecutionContext.ts:273:13)
      at processTicksAndRejections (internal/process/task_queues.js:95:5)
      at async ExecutionContext.evaluate (node_modules/puppeteer/src/common/ExecutionContext.ts:140:12)

Provide test source code if related I have created a simple codesandbox at https://lvewnd.csb.app/ and then ran this simple scenario to reproduce the error:

Scenario('[SCENARIO]: Locate React elements within a React fragment', ({ I }) => {
  I.amOnPage('https://lvewnd.csb.app/');
  I.seeElement({ react: 'Cmp1' });
}).tag('@broken');

App.js

import Cmp1 from "./Cmp1";
import Cmp2 from "./Cmp2";

export default function App() {
  return (
    <>
      <Cmp1 />
      <Cmp2 />
    </>
  );
}

Cmp1.js

export default function Cmp1() {
  return (
    <>
      <div id="cmp1-id1">
        <h1>Hello Component 1</h1>
      </div>
      <div id="cmp1-id2">Component 1 Footer</div>
    </>
  );
}

Cmp2.js

export default function Cmp2() {
  return (
    <>
      <div id="cmp2-id1">
        <h1>Hello Component 2</h1>
      </div>
      <div id="cmp2-id2">Component 2 Footer</div>
    </>
  );
}

Details

• CodeceptJS version: 3.3.4
• NodeJS Version: 14.17.5
• Operating System: macOS Monterey, Version 12.5.1
• puppeteer version: 13.7.0
• Configuration file:

const config = {
  tests: './src/e2e/scenarios/*.scenarios.ts',
  output: 'build/e2e/reports',
  helpers: {
    Puppeteer: {
      url:'https://lvewnd.csb.app/',
      windowSize: '1280x640',
      show: true,
      waitForNavigation: ['networkidle0', 'domcontentloaded'],
      waitForAction: 1000,
      waitForTimeout: 10000
    }
  },
  name: 'broken-react-fragments',
  plugins: {
    pauseOnFail: {},
    retryFailedStep: {
      enabled: true
    },
    tryTo: {
      enabled: true
    },
    screenshotOnFail: {
      enabled: true
    }
  }
};

exports.config = config;

[github-actions[bot]]

This issue is stale because it has been open for 90 days with no activity.