testing-library / cypress-testing-library

🐅 Simple and complete custom Cypress commands and utilities that encourage good testing practices.
http://npm.im/@testing-library/cypress
MIT License
1.8k stars 152 forks source link

Cypress commands don't work inside an origin block #221

Open warpdesign opened 2 years ago

warpdesign commented 2 years ago

Relevant code or config

"experimentalSessionAndOrigin": true,
cy.visit('/')
// works as expected
cy.findByText('foo')

cy.origin('google.com', () => {
  cy.visit('/')
  // will crash with "cy.findByText is not a function"
  cy.findByText('foo')
})

What you did:

What happened:

Capture d’écran 2022-05-17 à 16 36 12

the-ult commented 2 years ago

Indeed. Same problem here with cv.findByRole() etc

pakhilov commented 2 years ago

I have the same problem with cypress-testing-library and real-events

luke-sensei commented 2 years ago

HI, same issue here with cypress 10.4

Without this fix, the cy.origin() feature is totally unusable for my project...

craigsumner commented 2 years ago

Hit the same issue on my first time out with cy.origin. I wonder if the same problem exists in cy.session.

csky-ryangibson commented 2 years ago

This is a known limitation with cy.origin (that custom commands don't work). There is a workaround I was pointed to by Gleb which is to make another cy.origin block in the beforeEach block. This origin block would be pointed to the same origin that you are trying to use in your main test. You would setup your custom command in this first origin block and you will be able to use it within the origin block in your test. https://docs.cypress.io/api/commands/origin#Callback-restrictions

luke-sensei commented 1 year ago

Cypress 10.9 with Cypress.require('../support/myCustomCommands') does solve this issue for me

DariaTsypkina commented 1 year ago

Got the same issue using custom command in cy.origin() block. @luke-sensei solution helped. Note you should insert Cypress.require('../support/myCustomCommands') directly in cy.origin() block.

leschdom commented 1 year ago

Got the same issue using custom command in cy.origin() block. @luke-sensei solution helped. Note you should insert Cypress.require('../support/myCustomCommands') directly in cy.origin() block.

Just an additional info: I just read in the release notes for @cypress/webpack-preprocessor@5.15.0 that you can directly use import()/require() without Cypress.require()

Features Enable requiring cy.origin dependencies with require() and import() (https://github.com/cypress-io/cypress/issues/24294) (1b29ce7)

see https://github.com/cypress-io/cypress/blob/develop/npm/webpack-preprocessor/CHANGELOG.md#cypresswebpack-preprocessor-v5150-2022-10-19

anthonyhastings commented 1 year ago

Still an issue with Cypress 10.11 :cry:

craigsumner commented 1 year ago

When I use:

Cypress.require("../../support/myCustomCommands") 

I see:

Cypress.require is not a function

When I use:

require("../../support/myCustomCommands") 

I see:

webpack_require is not defined

I'm using Cypress 9.7.0. What am I missing?

preetibellad commented 1 year ago

When I use:

Cypress.require("../../support/myCustomCommands") 

I see:

Cypress.require is not a function

When I use:

require("../../support/myCustomCommands") 

I see:

webpack_require is not defined

I'm using Cypress 9.7.0. What am I missing?

Upgrade Cypress to 10.9.0 and @cypress/webpack-preprocessor to 5.15.0. It worked for me. Thanks @luke-sensei :)

mlberkow commented 1 year ago

I'm using 10.10 and it waits for the new page to load, but neither the cy.url command or cy.log appear to do anything. I purposefully spelled google wrong in the validation, but the test passes, and the cy.log results don't show up anywhere that I can find.

cy.origin('https://www.google.com', () => { cy.url({ timeout: 60000 }).should('contain', 'gogle.com') cy.log('%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%') })

GeorgeXCV commented 1 year ago

When I use:

Cypress.require("../../support/myCustomCommands") 

I see:

Cypress.require is not a function

When I use:

require("../../support/myCustomCommands") 

I see:

webpack_require is not defined

I'm using Cypress 9.7.0. What am I missing?

Same problem on Cypress 12.1.0 and "@cypress/webpack-preprocessor": "^5.16.0"

charliedodds commented 1 year ago

When I use:

Cypress.require("../../support/myCustomCommands") 

I see:

Cypress.require is not a function

When I use:

require("../../support/myCustomCommands") 

I see:

webpack_require is not defined

I'm using Cypress 9.7.0. What am I missing?

Same problem on Cypress 12.1.0 and "@cypress/webpack-preprocessor": "^5.16.0"

Adding experimentalOriginDependencies: true to the e2e config in cypress.config.json fixed this for me (cypress: ^12.1.0, @cypress/webpack-preprocessor: ^5.16.1, webpack: ^5.75.0)

XavierChevalier commented 1 year ago

Cypress origin and custom commands doesn't work with TypeScript ?

cy.origin(
  Cypress.env('BASE_URL_SHOP'), () => {
    Cypress.require('../support/commands')
    cy.checkIfLinksAreDeadOnPage('/')
  }
)
cy.origin() failed to run the callback function due to the following error:

Processing the origin callback errored:
Error: Cannot find module 'typescript'

Require stack:

- /Users/X/Library/Caches/Cypress/12.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/cross-origin/process-callback.ts
    at Module._resolveFilename (node:internal/modules/cjs/loader:940:15)
    at n._resolveFilename (node:electron/js2c/browser_init:249:1105)
    at PackherdModuleLoader._tryResolveFilename (evalmachine.<anonymous>:1:735006)
    at PackherdModuleLoader._resolvePaths (evalmachine.<anonymous>:1:731827)
    at PackherdModuleLoader.tryResolve (evalmachine.<anonymous>:1:727083)
    at resolve (evalmachine.<anonymous>:1:741891)
    at Function.resolve (evalmachine.<anonymous>:1:752340)
    at customRequire.resolve (<embedded>:5233:1354109)
    at _ (<embedded>:5174:22380)
    at <embedded>:5213:67851
    at a.handle_request (<embedded>:3012:1038)
    at i (<embedded>:3027:1285)
    at <embedded>:2627:2101
    at n (<embedded>:2608:1794)
    at p (<embedded>:2608:1813)
    at IncomingMessage.f (<embedded>:2608:2273)
    at IncomingMessage.emit (node:events:539:35)
    at endReadableNT (node:internal/streams/readable:1345:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:83:21)

Note: I'm using Lerna with PNPM for a monorepository architecture. Could this be a problem? This is the package.json of the e2e tests package:

{
  "name": "@my/e2e",
  "description": "E2E tests",
  "version": "0.0.0",
  "private": true,
  "sideEffects": false,
  "scripts": {
    "cypress:open": "cypress open",
    "cypress:run": "cypress run"
  },
  "dependencies": {
    "cypress": "^12.7.0"
  },
  "devDependencies": {
    "start-server-and-test": "^1.15.2",
    "typescript": "^4.9.4"
  }
}
luke-sensei commented 1 year ago

@XavierChevalier see https://github.com/cypress-io/cypress/issues/25885 should be fixed with next cypress release (in 4 days)

SuprunO commented 9 months ago

Still an issue for me cy.origin("https://creditcube.qa.creditsense.ai/", () => { const _ = Cypress.require("../../support/commands"); cy.visit("/"); });

ERROR process is not defined

Variables must either be defined within the cy.origin() command or passed in using the args option. Using require() or import() within the cy.origin() callback is not supported. Use Cypress.require() to include dependencies instead, but note that it currently requires enabling the experimentalOriginDependencies flag. This error occurred while creating the session. Because the session setup failed, we failed the test.

draganabodiroga23 commented 8 months ago

I am also getting process is not defined error.. I have experimentalOriginDependencies set to true in cypress config file. Within origin I am using custom command for login(enter username, password, click login button).. Variables are passed in using the args option. Cypress version is 12.17.4 Is this issue going to be fixed soon or it is fixed in some version above the one I am using (haven't found anything related to the issue in change log)?

ERROR process is not defined

Variables must either be defined within the cy.origin() command or passed in using the args option.

Using require() or import() within the cy.origin() callback is not supported. Use Cypress.require() to include dependencies instead, but note that it currently requires enabling the experimentalOriginDependencies flag.

katQA commented 5 months ago

Hi, I'm experiencing the same issue with "cypress": "^13.6.1". The commands .type('') and .click() are yelling the same error for me when they are situated inside of the cy.origin() block. experimentalOriginDependencies is set to true.