Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Could not find instance of React in given element #325

Open
GowriLakshmiDevarajan opened this issue May 27, 2022 · 6 comments
Open

Could not find instance of React in given element #325

GowriLakshmiDevarajan opened this issue May 27, 2022 · 6 comments

Comments

@GowriLakshmiDevarajan
Copy link

GowriLakshmiDevarajan commented May 27, 2022

@abhinaba-ghosh
I am getting this error while writing the cypress tests. I am using cypress code coverage. This is my test code.

describe("hello world text testing", () => {
before(() => {
cy.visit("/");
cy.waitForReact(1000, "#root", "node_modules/resq/dist/index.js");
});

it("login test", () => {
cy.react("Login");
});
});

@hammeiam
Copy link

I'm also experiencing the same issue

@pegans
Copy link

pegans commented Oct 3, 2022

I have the same issue after updating to Cypress 10.7.0 and cypress-react-selector 3.0.0

@jezaman
Copy link

jezaman commented Oct 5, 2022

Same Issue with React 18.
Is there any bug fix?
Is someone still maintaining this repository?
Seems like it was already reported months ago.

@thediveo
Copy link

waitForReact now works for me; this needed the following changes; however, react(...) then fails for me.

package.json -- make sure to force the just released new version of resq that works with React 18.

{
  "resolutions": {
    "resq": "^1.11.0"
  },
}

In component-index.html add an id= attribute the data-cy-root div element:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Components App</title>
  </head>
  <body>
    <div id="__cy_root" data-cy-root></div>
  </body>
</html>

In cypress.config.ts tell cypress-react-selector the id of this root element:

import { defineConfig } from "cypress"

export default defineConfig({
  component: {
    devServer: {
      framework: "create-react-app",
      bundler: "webpack",
    },
  },
  env: {
    'cypress-react-selector': {
      root: '#__cy_root',
    },
  },
})

@kkuriata
Copy link

Repo seems to be dead. Issue still persists...

@abhinaba-ghosh
Copy link
Owner

this repo is not dead btw. We dont have an active usecase with react 18 at this moment. We will evaluate it soon. Looking for active contributors/maintainers

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants