diff --git a/README.md b/README.md
index 21f5fb42..df9364d8 100644
--- a/README.md
+++ b/README.md
@@ -121,6 +121,7 @@ Spec | Description
[window-spec.js](cypress/component/basic/window-spec.js) | In the component test, the spec `window` and the application's `window` where the component is running should be the same object
[css](cypress/component/basic/css) | Shows that component with `import './Button.css'` works
[network](cypress/component/basic/network) | Confirms we can use `cy.route` to stub / spy on component's network calls
+[no-visit](cypress/component/basic/no-visit) | Component specs cannot call `cy.visit`
[react-book-by-chris-noring](cypress/component/basic/react-book-by-chris-noring) | Copied test examples from [React Book](https://softchris.github.io/books/react) and adapted for Cypress component tests
[react-tutorial](cypress/component/basic/react-tutorial) | Tests from official [ReactJS tutorial](https://reactjs.org/tutorial/tutorial.html) copied and adapted for Cypress component tests
[stub-example](cypress/component/basic/stub-example) | Uses `cy.stub` as component props
diff --git a/cypress/component/basic/no-visit/spec.js b/cypress/component/basic/no-visit/spec.js
new file mode 100644
index 00000000..c88aeca1
--- /dev/null
+++ b/cypress/component/basic/no-visit/spec.js
@@ -0,0 +1,9 @@
+///
+describe('Trying to use cy.visit in component spec', () => {
+ it('throws an error', () => {
+ // https://github.com/bahmutov/cypress-react-unit-test/issues/286
+ expect(() => {
+ cy.visit('index.html')
+ }).to.throw
+ })
+})
diff --git a/cypress/integration/integration tests/integration-spec.js b/cypress/integration/integration tests/integration-spec.js
index f47e6e16..99a832ec 100644
--- a/cypress/integration/integration tests/integration-spec.js
+++ b/cypress/integration/integration tests/integration-spec.js
@@ -1,4 +1,7 @@
///
+const React = require('react')
+const { mount } = require('../../..')
+
describe('integration tests', () => {
it('loads page for E2E', () => {
cy.visit('index.html')
@@ -9,4 +12,11 @@ describe('integration tests', () => {
cy.visit('index.html')
cy.window().should('have.property', 'React')
})
+
+ it('throws an Error if I try to use mount', () => {
+ cy.log('About to try using *mount*')
+ expect(() => {
+ mount(
Example
)
+ }).to.throw
+ })
})
diff --git a/lib/hooks.ts b/lib/hooks.ts
index 671ace50..fcad8388 100644
--- a/lib/hooks.ts
+++ b/lib/hooks.ts
@@ -1,6 +1,21 @@
// @ts-ignore
const isComponentSpec = () => Cypress.spec.specType === 'component'
+// When running component specs, we cannot allow "cy.visit"
+// because it will wipe out our preparation work, and does not make much sense
+// thus we overwrite "cy.visit" to throw an error
+Cypress.Commands.overwrite('visit', (visit, ...args: any[]) => {
+ if (isComponentSpec()) {
+ throw new Error(
+ 'cy.visit from a component spec is not allowed\n' +
+ 'see https://github.com/bahmutov/cypress-react-unit-test/issues/286',
+ )
+ } else {
+ // allow regular visit to proceed
+ return visit(...args)
+ }
+})
+
/** Initialize an empty document with root element */
function renderTestingPlatform() {
// Let's mount components under a new div with this id