From 35abe04760dac4b91b4669fb30d09161ceeaf7ae Mon Sep 17 00:00:00 2001
From: Martyn Chamberlin <martyn.chamberlin@hey.com>
Date: Tue, 28 Jul 2020 16:00:38 -0500
Subject: [PATCH 1/4] Fix bug with iFrame focus

---
 packages/driver/src/cy/focused.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/driver/src/cy/focused.js b/packages/driver/src/cy/focused.js
index e0c3c224ef4c..0203c1785b3f 100644
--- a/packages/driver/src/cy/focused.js
+++ b/packages/driver/src/cy/focused.js
@@ -91,7 +91,7 @@ const create = (state) => {
 
     // store the current focused element
     // since when we call .focus() it will change
-    const $focused = getFocused()
+    const $focused = getFocused(el.ownerDocument)
 
     let hasFocused = false
 
@@ -220,8 +220,8 @@ const create = (state) => {
     return false
   }
 
-  const getFocused = () => {
-    const { activeElement } = state('document')
+  const getFocused = (document = state('document')) => {
+    const { activeElement } = document
 
     if ($dom.isFocused(activeElement)) {
       return $dom.wrap(activeElement)

From b0e6ab0e8b4d8418a77b4379c50a543a035a7e2e Mon Sep 17 00:00:00 2001
From: Chris Breiding <chrisbreiding@gmail.com>
Date: Wed, 29 Jul 2020 09:44:56 -0400
Subject: [PATCH 2/4] add test for iframe input focus fix

---
 packages/driver/cypress/fixtures/issue-8111-inner.html |  4 ++++
 packages/driver/cypress/fixtures/issue-8111-outer.html |  1 +
 .../cypress/integration/commands/actions/type_spec.js  | 10 ++++++++++
 packages/driver/src/cy/focused.js                      |  7 +++++--
 4 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 packages/driver/cypress/fixtures/issue-8111-inner.html
 create mode 100644 packages/driver/cypress/fixtures/issue-8111-outer.html

diff --git a/packages/driver/cypress/fixtures/issue-8111-inner.html b/packages/driver/cypress/fixtures/issue-8111-inner.html
new file mode 100644
index 000000000000..1394a7ef8fd2
--- /dev/null
+++ b/packages/driver/cypress/fixtures/issue-8111-inner.html
@@ -0,0 +1,4 @@
+<input />
+<script>
+  document.querySelector('input').focus();
+</script>
diff --git a/packages/driver/cypress/fixtures/issue-8111-outer.html b/packages/driver/cypress/fixtures/issue-8111-outer.html
new file mode 100644
index 000000000000..c42ae8edf1e9
--- /dev/null
+++ b/packages/driver/cypress/fixtures/issue-8111-outer.html
@@ -0,0 +1 @@
+<iframe src="/fixtures/issue-8111-inner.html">
diff --git a/packages/driver/cypress/integration/commands/actions/type_spec.js b/packages/driver/cypress/integration/commands/actions/type_spec.js
index fdc823b6a283..bcd209c82954 100644
--- a/packages/driver/cypress/integration/commands/actions/type_spec.js
+++ b/packages/driver/cypress/integration/commands/actions/type_spec.js
@@ -177,6 +177,16 @@ describe('src/cy/commands/actions/type - #type', () => {
     .should('have.value', 'foobar')
   })
 
+  // https://github.com/cypress-io/cypress/issues/8111
+  it('can type into an input in an iframe', () => {
+    cy.visit('/fixtures/issue-8111-outer.html')
+    cy.get('iframe')
+    .its('0.contentDocument.body').should('not.be.empty')
+    .then(cy.wrap)
+    .find('input')
+    .type(42)
+  })
+
   describe('actionability', () => {
     it('can forcibly type + click even when element is invisible', () => {
       const $txt = cy.$$(':text:first').hide()
diff --git a/packages/driver/src/cy/focused.js b/packages/driver/src/cy/focused.js
index 0203c1785b3f..913ddf369760 100644
--- a/packages/driver/src/cy/focused.js
+++ b/packages/driver/src/cy/focused.js
@@ -89,8 +89,11 @@ const create = (state) => {
 
     const win = $window.getWindowByElement(el)
 
-    // store the current focused element
-    // since when we call .focus() it will change
+    // store the current focused element, since it will change when we call .focus()
+    //
+    // need to pass in el.ownerDocument to get the correct focused element
+    // when el is in an iframe and the browser is not
+    // in focus (https://github.com/cypress-io/cypress/issues/8111)
     const $focused = getFocused(el.ownerDocument)
 
     let hasFocused = false

From ab0803668b1302f12f09421634c78dc9369f5e66 Mon Sep 17 00:00:00 2001
From: Chris Breiding <chrisbreiding@gmail.com>
Date: Thu, 30 Jul 2020 10:12:02 -0400
Subject: [PATCH 3/4] move iframe input test to e2e test with devtools open to
 simulate browser being out of focus

---
 .../driver/cypress/fixtures/issue-8111-outer.html    |  1 -
 .../integration/commands/actions/type_spec.js        | 10 ----------
 packages/server/test/e2e/3_issue_8111_spec.js        | 12 ++++++++++++
 .../projects/issue-8111-iframe-input/cypress.json    |  3 +++
 .../cypress/integration/iframe_input_spec.js         |  8 ++++++++
 .../issue-8111-iframe-input/cypress/plugins/index.js |  7 +++++++
 .../projects/issue-8111-iframe-input/inner.html}     |  0
 .../projects/issue-8111-iframe-input/outer.html      |  1 +
 8 files changed, 31 insertions(+), 11 deletions(-)
 delete mode 100644 packages/driver/cypress/fixtures/issue-8111-outer.html
 create mode 100644 packages/server/test/e2e/3_issue_8111_spec.js
 create mode 100644 packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress.json
 create mode 100644 packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
 create mode 100644 packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/plugins/index.js
 rename packages/{driver/cypress/fixtures/issue-8111-inner.html => server/test/support/fixtures/projects/issue-8111-iframe-input/inner.html} (100%)
 create mode 100644 packages/server/test/support/fixtures/projects/issue-8111-iframe-input/outer.html

diff --git a/packages/driver/cypress/fixtures/issue-8111-outer.html b/packages/driver/cypress/fixtures/issue-8111-outer.html
deleted file mode 100644
index c42ae8edf1e9..000000000000
--- a/packages/driver/cypress/fixtures/issue-8111-outer.html
+++ /dev/null
@@ -1 +0,0 @@
-<iframe src="/fixtures/issue-8111-inner.html">
diff --git a/packages/driver/cypress/integration/commands/actions/type_spec.js b/packages/driver/cypress/integration/commands/actions/type_spec.js
index bcd209c82954..fdc823b6a283 100644
--- a/packages/driver/cypress/integration/commands/actions/type_spec.js
+++ b/packages/driver/cypress/integration/commands/actions/type_spec.js
@@ -177,16 +177,6 @@ describe('src/cy/commands/actions/type - #type', () => {
     .should('have.value', 'foobar')
   })
 
-  // https://github.com/cypress-io/cypress/issues/8111
-  it('can type into an input in an iframe', () => {
-    cy.visit('/fixtures/issue-8111-outer.html')
-    cy.get('iframe')
-    .its('0.contentDocument.body').should('not.be.empty')
-    .then(cy.wrap)
-    .find('input')
-    .type(42)
-  })
-
   describe('actionability', () => {
     it('can forcibly type + click even when element is invisible', () => {
       const $txt = cy.$$(':text:first').hide()
diff --git a/packages/server/test/e2e/3_issue_8111_spec.js b/packages/server/test/e2e/3_issue_8111_spec.js
new file mode 100644
index 000000000000..4d2a46eeda46
--- /dev/null
+++ b/packages/server/test/e2e/3_issue_8111_spec.js
@@ -0,0 +1,12 @@
+const e2e = require('../support/helpers/e2e').default
+const Fixtures = require('../support/helpers/fixtures')
+
+describe('e2e issue 8111 iframe input focus', function () {
+  e2e.setup()
+
+  e2e.it('iframe input retains focus when browser is out of focus', {
+    project: Fixtures.projectPath('issue-8111-iframe-input'),
+    spec: 'iframe_input_spec.js',
+    browser: 'chrome',
+  })
+})
diff --git a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress.json b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress.json
new file mode 100644
index 000000000000..9c5417cd8268
--- /dev/null
+++ b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress.json
@@ -0,0 +1,3 @@
+{
+  "supportFolder": false
+}
diff --git a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
new file mode 100644
index 000000000000..0e5578ebc722
--- /dev/null
+++ b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
@@ -0,0 +1,8 @@
+it('can type into an input in an iframe', () => {
+  cy.visit('/outer.html')
+  cy.get('iframe')
+  .its('0.contentDocument.body').should('not.be.empty')
+  .then(cy.wrap)
+  .find('input')
+  .type(42)
+})
diff --git a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/plugins/index.js b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/plugins/index.js
new file mode 100644
index 000000000000..f04098567ec3
--- /dev/null
+++ b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/plugins/index.js
@@ -0,0 +1,7 @@
+module.exports = (on) => {
+  on('before:browser:launch', (browser, launchOptions) => {
+    launchOptions.args.push('--auto-open-devtools-for-tabs')
+
+    return launchOptions
+  })
+}
diff --git a/packages/driver/cypress/fixtures/issue-8111-inner.html b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/inner.html
similarity index 100%
rename from packages/driver/cypress/fixtures/issue-8111-inner.html
rename to packages/server/test/support/fixtures/projects/issue-8111-iframe-input/inner.html
diff --git a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/outer.html b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/outer.html
new file mode 100644
index 000000000000..7c17c2c77b97
--- /dev/null
+++ b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/outer.html
@@ -0,0 +1 @@
+<iframe src="/inner.html">

From 536821675d900b8e5f4661d96ed00f4e2bdf8815 Mon Sep 17 00:00:00 2001
From: Jennifer Shehane <jennifer@cypress.io>
Date: Mon, 3 Aug 2020 14:19:53 +0630
Subject: [PATCH 4/4] Pass 'headed' true, otherwise it will always pass + add
 some comments

---
 packages/server/test/e2e/3_issue_8111_spec.js                 | 4 ++++
 .../cypress/integration/iframe_input_spec.js                  | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/server/test/e2e/3_issue_8111_spec.js b/packages/server/test/e2e/3_issue_8111_spec.js
index 4d2a46eeda46..f775270ef993 100644
--- a/packages/server/test/e2e/3_issue_8111_spec.js
+++ b/packages/server/test/e2e/3_issue_8111_spec.js
@@ -5,8 +5,12 @@ describe('e2e issue 8111 iframe input focus', function () {
   e2e.setup()
 
   e2e.it('iframe input retains focus when browser is out of focus', {
+    // this test is dependent on the browser being Chrome headed
+    // and also having --auto-open-devtools-for-tabs plugins option
+    // (which pulls focus from main browser window)
     project: Fixtures.projectPath('issue-8111-iframe-input'),
     spec: 'iframe_input_spec.js',
     browser: 'chrome',
+    headed: true,
   })
 })
diff --git a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
index 0e5578ebc722..c605183f66e3 100644
--- a/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
+++ b/packages/server/test/support/fixtures/projects/issue-8111-iframe-input/cypress/integration/iframe_input_spec.js
@@ -1,4 +1,4 @@
-it('can type into an input in an iframe', () => {
+it('can type into an input in an iframe that calls auto focus', () => {
   cy.visit('/outer.html')
   cy.get('iframe')
   .its('0.contentDocument.body').should('not.be.empty')