yarn 2 support does not work

[francisu]

Get this error[1] when using yarn 2 (pnp)

I tried removing the check for 'hasOwnProperty' in resqInjector, but that failed as well, as it looks like webpack did not properly insert the pnp magic in place of the require.resolve[2]

I also tried yarn unplug cypress-react-selector to no avail.

I will work on it a bit more to see if I can find a solution.

[1]

cy.readFile("../../.yarn/cache/resq-npm-1.10.1-c0eb904091-57458eb232.zip/node_modules/resq/dist/index.js") failed while trying to read the file at the following path:

/Users/francis/d/IdeaProjects/product/.yarn/cache/resq-npm-1.10.1-c0eb904091-57458eb232.zip/node_modules/resq/dist/index.js

The following error occurred:

"ENOTDIR: not a directory, open '/Users/francis/d/IdeaProjects/product/.yarn/cache/resq-npm-1.10.1-c0eb904091-57458eb232.zip/node_modules/resq/dist/index.js'"

Because this error occurred during a before all hook we are skipping all of the remaining tests.Learn more
View stack trace
Print to console
at (http://localhost:53226/__cypress/runner/cypress_runner.js:159601:29)
From previous event:
at verifyAssertions (http://localhost:53226/__cypress/runner/cypress_runner.js:159593:86)
at Context.readFile (http://localhost:53226/__cypress/runner/cypress_runner.js:159645:15)
From Your Spec Code:
at $Cy.cy. [as readFile] (http://localhost:53226/__cypress/runner/cypress_runner.js:174899:50)
at Context.push.../../.yarn/unplugged/cypress-react-selector-npm-2.3.11-c2cb0b820d/node_modules/cypress-react-selector/src/resqInjector.js.exports.waitForReact (http://localhost:53226/__cypress/src/static/js/0.chunk.js:1088:7)
at (http://localhost:53226/__cypress/runner/cypress_runner.js:173604:16)
at tryCatcher (http://localhost:53226/__cypress/runner/cypress_runner.js:26492:24)
at Promise._settlePromiseFromHandler (http://localhost:53226/__cypress/runner/cypress_runner.js:24427:32)
at Promise._settlePromise (http://localhost:53226/__cypress/runner/cypress_runner.js:24484:19)
at Promise._settlePromiseCtx (http://localhost:53226/__cypress/runner/cypress_runner.js:24521:11)
at _drainQueueStep (http://localhost:53226/__cypress/runner/cypress_runner.js:21203:13)
at _drainQueue (http://localhost:53226/__cypress/runner/cypress_runner.js:21192:10)

[2]
Webpack generated code:

exports.waitForReact = (timeout = 10000, reactRoot) => {
const file = /require.resolve/(/*! resq */ "../../.yarn/cache/resq-npm-1.10.1-c0eb904091-57458eb232.zip/node_modules/resq/dist/index.js");

cy.readFile(file, 'utf8', {
log: false
}).then(script => {

[francisu]

To reproduce:

git clone https://github.com/francisu/test-material-ui
cd test-material-ui
git checkout yarn2-readFile
yarn install
yarn cypress open-ct

(will open GUI - Click on the first test)
====> The error will happen at that point

[francisu]

I think this is really a cypress issue: cypress-io/cypress#18072

[francisu]

This can be worked around by doing a yarn unplug resq

[francisu]

Update for those using 2.3.15 or higher. The yarn unplug resq no longer works by itself. You can however use this code to locate the package and give the name to cy.waitForReact().

In your cypress/plugins/index.js:

module.exports = (on, config) => {
  on('task', {
    getResqFilePath() {
      const pathName = path.join(process.cwd(), '../../.yarn/unplugged');
      const files = fs.readdirSync(pathName);
      const resqFiles = files.filter((f) => f.includes('resq-npm-'));
      if (resqFiles.length != 1) {
        throw new Error(
          `Cannot find the resq module in the unplugged ${pathName} - make sure the 'resq' package is unplugged`,
        );
      }
      const resqFile = path.join(
        pathName,
        resqFiles[0],
        'node_modules/resq/dist/index.js',
      );
      return resqFile;
    },
  });

And when you call cy.waitForReact():

  cy.task('getResqFilePath').then((resqPath: string) => {
    cy.waitForReact(1000, undefined, resqPath);
  });