feat: handle cy.visit inside before callback (#152)

* feat: handle before callback

* update readme

* remove debug console.log calls

Author: bahmutov

README.md

@@ -322,6 +322,13 @@ npm run dev:no:coverage
 
 ## Examples
 
+### Internal examples
+
+- [examples/before-each-visit](examples/before-each-visit) checks if code coverage correctly keeps track of code when doing `cy.visit` before each test
+- [examples-before-all-visit](examples/before-all-visit) checks if code coverage works when `cy.visit` is made once in the `before` hook
+
+### External examples
+
 - [cypress-io/cypress-example-todomvc-redux](https://github.com/cypress-io/cypress-example-todomvc-redux) is a React / Redux application with 100% code coverage.
 - [cypress-io/cypress-example-realworld](https://github.com/cypress-io/cypress-example-realworld) shows how to collect the coverage information from both back and front end code and merge it into a single report. The E2E test step runs in parallel in several CI containers, each saving just partial test coverage information. Then a merge job runs taking artifacts and combining coverage into the final report to be sent to an exteral coverage as a service app.
 - [bahmutov/code-coverage-webpack-dev-server](https://github.com/bahmutov/code-coverage-webpack-dev-server) shows how to collect code coverage from an application that uses webpack-dev-server.

examples/before-all-visit/cypress/integration/spec.js

@@ -1,6 +1,7 @@
 /// <reference types="cypress" />
 describe('coverage information', () => {
   before(() => {
+    cy.log('visiting index.html')
     cy.visit('index.html')
   })
 

support.js

@@ -46,18 +46,34 @@ if (Cypress.env('coverage') === false) {
     // to let the user know the coverage has been collected
     windowCoverageObjects = []
 
-    // save reference to coverage for each app window loaded in the test
-    cy.on('window:load', win => {
+    const saveCoverageObject = win => {
       // if application code has been instrumented, the app iframe "window" has an object
       const applicationSourceCoverage = win.__coverage__
+      if (!applicationSourceCoverage) {
+        return
+      }
 
-      if (applicationSourceCoverage) {
-        windowCoverageObjects.push({
-          coverage: applicationSourceCoverage,
-          pathname: win.location.pathname
+      if (
+        Cypress._.find(windowCoverageObjects, {
+          coverage: applicationSourceCoverage
         })
+      ) {
+        // this application code coverage object is already known
+        // which can happen when combining `window:load` and `before` callbacks
+        return
       }
-    })
+
+      windowCoverageObjects.push({
+        coverage: applicationSourceCoverage,
+        pathname: win.location.pathname
+      })
+    }
+
+    // save reference to coverage for each app window loaded in the test
+    cy.on('window:load', saveCoverageObject)
+
+    // save reference if visiting a page inside a before() hook
+    cy.window().then(saveCoverageObject)
   })
 
   afterEach(() => {