From d5b08bdf188c0fb56154e0bdac126f198959cdc1 Mon Sep 17 00:00:00 2001
From: Kyle Shockey <shockey@users.noreply.github.com>
Date: Wed, 18 Sep 2019 15:40:19 -0700
Subject: [PATCH 1/4] `test/e2e-cypress/tests/features/xss/` ->
 `test/e2e-cypress/tests/security`

---
 .../documents/{xss/oauth2.yaml => security/xss-oauth2.yaml}     | 0
 test/e2e-cypress/tests/{features/xss => security}/oauth2.js     | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename test/e2e-cypress/static/documents/{xss/oauth2.yaml => security/xss-oauth2.yaml} (100%)
 rename test/e2e-cypress/tests/{features/xss => security}/oauth2.js (90%)

diff --git a/test/e2e-cypress/static/documents/xss/oauth2.yaml b/test/e2e-cypress/static/documents/security/xss-oauth2.yaml
similarity index 100%
rename from test/e2e-cypress/static/documents/xss/oauth2.yaml
rename to test/e2e-cypress/static/documents/security/xss-oauth2.yaml
diff --git a/test/e2e-cypress/tests/features/xss/oauth2.js b/test/e2e-cypress/tests/security/oauth2.js
similarity index 90%
rename from test/e2e-cypress/tests/features/xss/oauth2.js
rename to test/e2e-cypress/tests/security/oauth2.js
index 3d7b727aa0a..4d01ba3c660 100644
--- a/test/e2e-cypress/tests/features/xss/oauth2.js
+++ b/test/e2e-cypress/tests/security/oauth2.js
@@ -1,6 +1,6 @@
 describe("XSS: OAuth2 authorizationUrl sanitization", () => {
   it("should filter out a javascript URL", () => {
-    cy.visit("/?url=/documents/xss/oauth2.yaml")
+    cy.visit("/?url=/documents/security/xss-oauth2.yaml")
       .window()
       .then(win => {
         let args = null

From e2d517f53f1081e3191f0c3574cca60a29a65a5f Mon Sep 17 00:00:00 2001
From: Kyle Shockey <shockey@users.noreply.github.com>
Date: Fri, 20 Sep 2019 12:16:15 -0700
Subject: [PATCH 2/4] add tests

---
 .../documents/petstore-expanded.openapi.yaml  | 13 ++++-
 .../sequential-import-chaining/injection.css  |  7 +++
 .../sequential-import-chaining/openapi.yaml   | 10 ++++
 .../sequential-import-chaining/swagger.yaml   | 10 ++++
 .../security/sequential-import-chaining.js    | 58 +++++++++++++++++++
 5 files changed, 97 insertions(+), 1 deletion(-)
 create mode 100644 test/e2e-cypress/static/documents/security/sequential-import-chaining/injection.css
 create mode 100644 test/e2e-cypress/static/documents/security/sequential-import-chaining/openapi.yaml
 create mode 100644 test/e2e-cypress/static/documents/security/sequential-import-chaining/swagger.yaml
 create mode 100644 test/e2e-cypress/tests/security/sequential-import-chaining.js

diff --git a/test/e2e-cypress/static/documents/petstore-expanded.openapi.yaml b/test/e2e-cypress/static/documents/petstore-expanded.openapi.yaml
index 20bd288b07d..98646200dc9 100644
--- a/test/e2e-cypress/static/documents/petstore-expanded.openapi.yaml
+++ b/test/e2e-cypress/static/documents/petstore-expanded.openapi.yaml
@@ -13,6 +13,8 @@ info:
     url: https://www.apache.org/licenses/LICENSE-2.0.html
 servers:
   - url: http://petstore.swagger.io/api
+security:
+  - Petstore: []
 paths:
   /pets:
     get:
@@ -152,4 +154,13 @@ components:
           type: integer
           format: int32
         message:
-          type: string
\ No newline at end of file
+          type: string
+  securitySchemes:
+    Petstore:
+      type: oauth2
+      flows: 
+        implicit:
+          authorizationUrl: https://example.com/api/oauth/dialog
+          scopes:
+            write:pets: modify pets in your account
+            read:pets: read your pets
diff --git a/test/e2e-cypress/static/documents/security/sequential-import-chaining/injection.css b/test/e2e-cypress/static/documents/security/sequential-import-chaining/injection.css
new file mode 100644
index 00000000000..edc480f6ad8
--- /dev/null
+++ b/test/e2e-cypress/static/documents/security/sequential-import-chaining/injection.css
@@ -0,0 +1,7 @@
+* {
+  color: red !important; /* for humans */
+}
+
+h4 {
+  display: none; /* for machines, used to trace whether this sheet is applied */
+}
diff --git a/test/e2e-cypress/static/documents/security/sequential-import-chaining/openapi.yaml b/test/e2e-cypress/static/documents/security/sequential-import-chaining/openapi.yaml
new file mode 100644
index 00000000000..e4e4ade8526
--- /dev/null
+++ b/test/e2e-cypress/static/documents/security/sequential-import-chaining/openapi.yaml
@@ -0,0 +1,10 @@
+openapi: "3.0.0"
+
+info:
+  title: Sequential Import Chaining
+  description: >
+    <h4>This h4 would be hidden by the injected CSS</h4>
+
+    This document tests the ability of a `<style>` tag in a Markdown field to pull in a remote stylesheet using an `@import` directive.
+
+    <style>@import url(/documents/security/sequential-import-chaining/injection.css);</style>
diff --git a/test/e2e-cypress/static/documents/security/sequential-import-chaining/swagger.yaml b/test/e2e-cypress/static/documents/security/sequential-import-chaining/swagger.yaml
new file mode 100644
index 00000000000..5f9cc448a92
--- /dev/null
+++ b/test/e2e-cypress/static/documents/security/sequential-import-chaining/swagger.yaml
@@ -0,0 +1,10 @@
+swagger: "2.0"
+
+info:
+  title: Sequential Import Chaining
+  description: >
+    <h4>This h4 would be hidden by the injected CSS</h4>
+
+    This document tests the ability of a `<style>` tag in a Markdown field to pull in a remote stylesheet using an `@import` directive.
+
+    <style>@import url(/documents/security/sequential-import-chaining/injection.css);</style>
diff --git a/test/e2e-cypress/tests/security/sequential-import-chaining.js b/test/e2e-cypress/tests/security/sequential-import-chaining.js
new file mode 100644
index 00000000000..90887def3ad
--- /dev/null
+++ b/test/e2e-cypress/tests/security/sequential-import-chaining.js
@@ -0,0 +1,58 @@
+describe("Security: CSS Sequential Import Chaining", () => {
+  describe("in OpenAPI 3.0", () => {
+    describe("CSS Injection via Markdown", () => {
+      it("should filter <style> tags out of Markdown fields", () => {
+        cy.visit("/?url=/documents/security/sequential-import-chaining/openapi.yaml")
+          .get("div.information-container")
+          .should("exist")
+          .and("not.have.descendants", "style")
+      })
+      it("should not apply `@import`ed CSS stylesheets", () => {
+        cy.visit("/?url=/documents/security/sequential-import-chaining/openapi.yaml")
+          .wait(500) // HACK: wait for CSS import to settle
+          .get("div.info h4")
+          .should("have.length", 1)
+          .and("not.be.hidden")
+      })
+    })
+    describe("Value Exfiltration via CSS", () => {
+      it("should not allow OAuth credentials to be visible via HTML `value` attribute", () => {
+        cy.visit("/?url=/documents/petstore-expanded.openapi.yaml")
+          .get(".scheme-container > .schemes > .auth-wrapper > .btn > span")
+          .click()
+          .get("div > div > .wrapper > .block-tablet > #client_id")
+          .clear()
+          .type("abc")
+          .should("not.have.attr", "value", "abc")
+      })
+    })
+  })
+  describe("in Swagger 2.0", () => {
+    describe("CSS Injection via Markdown", () => {
+      it("should filter <style> tags out of Markdown fields", () => {
+        cy.visit("/?url=/documents/security/sequential-import-chaining/swagger.yaml")
+          .get("div.information-container")
+          .should("exist")
+          .and("not.have.descendants", "style")
+      })
+      it("should not apply `@import`ed CSS stylesheets", () => {
+        cy.visit("/?url=/documents/security/sequential-import-chaining/swagger.yaml")
+          .wait(500) // HACK: wait for CSS import to settle
+          .get("div.info h4")
+          .should("have.length", 1)
+          .and("not.be.hidden")
+      })
+    })
+    describe("Value Exfiltration via CSS", () => {
+      it("should not allow OAuth credentials to be visible via HTML `value` attribute", () => {
+        cy.visit("/?url=/documents/petstore.swagger.yaml")
+          .get(".scheme-container > .schemes > .auth-wrapper > .btn > span")
+          .click()
+          .get("div > div > .wrapper > .block-tablet > #client_id")
+          .clear()
+          .type("abc")
+          .should("not.have.attr", "value", "abc")
+      })
+    })
+  })
+})

From 84e6b63d14bab79f82d75542c8bd9ed5a6d23c58 Mon Sep 17 00:00:00 2001
From: Kyle Shockey <shockey@users.noreply.github.com>
Date: Fri, 20 Sep 2019 12:21:19 -0700
Subject: [PATCH 3/4] filter <style> tags out of Markdown fields

---
 src/core/components/providers/markdown.jsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/core/components/providers/markdown.jsx b/src/core/components/providers/markdown.jsx
index d8d31a97aae..d3a2e4826bc 100644
--- a/src/core/components/providers/markdown.jsx
+++ b/src/core/components/providers/markdown.jsx
@@ -51,6 +51,7 @@ export default Markdown
 
 export function sanitizer(str) {
   return DomPurify.sanitize(str, {
-    ADD_ATTR: ["target"]
+    ADD_ATTR: ["target"],
+    FORBID_TAGS: ["style"],
   })
 }

From 62f4fc5b9e0a665274695d0bc8682e290f7e7dbf Mon Sep 17 00:00:00 2001
From: Kyle Shockey <shockey@users.noreply.github.com>
Date: Fri, 20 Sep 2019 12:21:33 -0700
Subject: [PATCH 4/4] initialize OAuth inputs without applying `value`
 attribute

---
 src/core/components/auth/oauth2.jsx       |  9 +++---
 src/core/components/initialized-input.jsx | 36 +++++++++++++++++++++++
 src/core/presets/base.js                  |  2 ++
 3 files changed, 43 insertions(+), 4 deletions(-)
 create mode 100644 src/core/components/initialized-input.jsx

diff --git a/src/core/components/auth/oauth2.jsx b/src/core/components/auth/oauth2.jsx
index a4cb6a79db0..a480857e66a 100644
--- a/src/core/components/auth/oauth2.jsx
+++ b/src/core/components/auth/oauth2.jsx
@@ -96,6 +96,7 @@ export default class Oauth2 extends React.Component {
     const AuthError = getComponent("authError")
     const JumpToPath = getComponent("JumpToPath", true)
     const Markdown = getComponent( "Markdown" )
+    const InitializedInput = getComponent("InitializedInput")
 
     const { isOAS3 } = specSelectors
 
@@ -170,10 +171,10 @@ export default class Oauth2 extends React.Component {
             {
               isAuthorized ? <code> ****** </code>
                            : <Col tablet={10} desktop={10}>
-                               <input id="client_id"
+                               <InitializedInput id="client_id"
                                       type="text"
                                       required={ flow === PASSWORD }
-                                      value={ this.state.clientId }
+                                      initialValue={ this.state.clientId }
                                       data-name="clientId"
                                       onChange={ this.onInputChange }/>
                              </Col>
@@ -187,8 +188,8 @@ export default class Oauth2 extends React.Component {
             {
               isAuthorized ? <code> ****** </code>
                            : <Col tablet={10} desktop={10}>
-                               <input id="client_secret"
-                                      value={ this.state.clientSecret }
+                               <InitializedInput id="client_secret"
+                                      initialValue={ this.state.clientSecret }
                                       type="text"
                                       data-name="clientSecret"
                                       onChange={ this.onInputChange }/>
diff --git a/src/core/components/initialized-input.jsx b/src/core/components/initialized-input.jsx
new file mode 100644
index 00000000000..2f4189c2438
--- /dev/null
+++ b/src/core/components/initialized-input.jsx
@@ -0,0 +1,36 @@
+// This component provides an interface that feels like an uncontrolled input
+// to consumers, while providing a `defaultValue` interface that initializes
+// the input's value using JavaScript value property APIs instead of React's 
+// vanilla[0] implementation that uses HTML value attributes.
+//
+// This is useful in situations where we don't want to surface an input's value
+// into the HTML/CSS-exposed side of the DOM, for example to avoid sequential
+// input chaining attacks[1].
+// 
+// [0]: https://github.com/facebook/react/blob/baff5cc2f69d30589a5dc65b089e47765437294b/fixtures/dom/src/components/fixtures/text-inputs/README.md
+// [1]: https://github.com/d0nutptr/sic
+
+import React from "react"
+import PropTypes from "prop-types"
+
+export default class InitializedInput extends React.Component {
+  componentDidMount() {
+    // Set the element's `value` property (*not* the `value` attribute)
+    // once, on mount, if an `initialValue` is provided.
+    if(this.props.initialValue) {
+      this.inputRef.value = this.props.initialValue
+    }
+  }
+
+  render() {
+    // Filter out `value` and `defaultValue`, since we have our own
+    // `initialValue` interface that we provide.
+    // eslint-disable-next-line no-unused-vars, react/prop-types
+    const { value, defaultValue, ...otherProps } = this.props
+    return <input {...otherProps} ref={c => this.inputRef = c} />
+  }
+}
+
+InitializedInput.propTypes = {
+  initialValue: PropTypes.string
+}
diff --git a/src/core/presets/base.js b/src/core/presets/base.js
index 015cd80d21b..6fe8f43c618 100644
--- a/src/core/presets/base.js
+++ b/src/core/presets/base.js
@@ -53,6 +53,7 @@ import Headers from "core/components/headers"
 import Errors from "core/components/errors"
 import ContentType from "core/components/content-type"
 import Overview from "core/components/overview"
+import InitializedInput from "core/components/initialized-input"
 import Info, {
   InfoUrl,
   InfoBasePath
@@ -105,6 +106,7 @@ export default function() {
       basicAuth: BasicAuth,
       clear: Clear,
       liveResponse: LiveResponse,
+      InitializedInput,
       info: Info,
       InfoContainer,
       JumpToPath,