From de3042911a5a61a8b47fbd12ee0650e929a04315 Mon Sep 17 00:00:00 2001
From: Matthew Shao <me@matshao.com>
Date: Thu, 1 Jun 2017 20:33:22 +0800
Subject: [web] Add tests for js/components/ContentView/CodeEditor.jsx

---
 .../components/ContentView/CodeEditorSpec.js       | 22 ++++++++++++++++++++++
 .../__snapshots__/CodeEditorSpec.js.snap           |  8 ++++++++
 2 files changed, 30 insertions(+)
 create mode 100644 web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
 create mode 100644 web/src/js/__tests__/components/ContentView/__snapshots__/CodeEditorSpec.js.snap

diff --git a/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js b/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
new file mode 100644
index 00000000..2698f13f
--- /dev/null
+++ b/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
@@ -0,0 +1,22 @@
+jest.mock('react-codemirror')
+import React from 'react'
+import renderer from 'react-test-renderer'
+import CodeEditor from '../../../components/ContentView/CodeEditor'
+
+describe('CodeEditor Component', () => {
+    let content = "foo content",
+        changeFn = jest.fn(),
+        codeEditor = renderer.create(
+            <CodeEditor content={content} onChange={changeFn}/>
+        ),
+        tree = codeEditor.toJSON()
+    it('should render correctly', () => {
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should handle key down', () => {
+        let mockEvent = { stopPropagation: jest.fn() }
+        tree.props.onKeyDown(mockEvent)
+        expect(mockEvent.stopPropagation).toBeCalled()
+    })
+})
diff --git a/web/src/js/__tests__/components/ContentView/__snapshots__/CodeEditorSpec.js.snap b/web/src/js/__tests__/components/ContentView/__snapshots__/CodeEditorSpec.js.snap
new file mode 100644
index 00000000..7e688a60
--- /dev/null
+++ b/web/src/js/__tests__/components/ContentView/__snapshots__/CodeEditorSpec.js.snap
@@ -0,0 +1,8 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CodeEditor Component should render correctly 1`] = `
+<div
+  className="codeeditor"
+  onKeyDown={[Function]}
+/>
+`;
-- 
cgit v1.2.3


From ef9ee67c19662b033581a70a0658348f50694813 Mon Sep 17 00:00:00 2001
From: Matthew Shao <me@matshao.com>
Date: Thu, 1 Jun 2017 20:37:38 +0800
Subject: [web] Add tests for js/components/ContentView/ContentViewOptions.jsx

---
 .../ContentView/ContentViewOptionsSpec.js          | 19 ++++++++++
 .../__snapshots__/ContentViewOptionsSpec.js.snap   | 41 ++++++++++++++++++++++
 .../components/ContentView/ContentViewOptions.jsx  |  6 +++-
 3 files changed, 65 insertions(+), 1 deletion(-)
 create mode 100644 web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
 create mode 100644 web/src/js/__tests__/components/ContentView/__snapshots__/ContentViewOptionsSpec.js.snap

diff --git a/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js b/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
new file mode 100644
index 00000000..0b1e8538
--- /dev/null
+++ b/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
@@ -0,0 +1,19 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import ContentViewOptions from '../../../components/ContentView/ContentViewOptions'
+import { Provider } from 'react-redux'
+import { TFlow, TStore } from '../../ducks/tutils'
+
+let tflow = new TFlow()
+
+describe('ContentViewOptions Component', () => {
+    let store = TStore()
+    it('should render correctly', () => {
+        let provider = renderer.create(
+            <Provider store={store}>
+                <ContentViewOptions flow={tflow} message={tflow.response}/>
+            </Provider>),
+            tree = provider.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+})
diff --git a/web/src/js/__tests__/components/ContentView/__snapshots__/ContentViewOptionsSpec.js.snap b/web/src/js/__tests__/components/ContentView/__snapshots__/ContentViewOptionsSpec.js.snap
new file mode 100644
index 00000000..e3561ec1
--- /dev/null
+++ b/web/src/js/__tests__/components/ContentView/__snapshots__/ContentViewOptionsSpec.js.snap
@@ -0,0 +1,41 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ContentViewOptions Component should render correctly 1`] = `
+<div
+  className="view-options"
+>
+  <span>
+    <b>
+      View:
+    </b>
+     edit
+  </span>
+   
+  <a
+    className="btn btn-default btn-xs"
+    href="/flows/d91165be-ca1f-4612-88a9-c0f8696f3e29/response/content"
+    title="Download the content of the flow."
+  >
+    <i
+      className="fa fa-download"
+    />
+  </a>
+   
+  <a
+    className="btn btn-default btn-xs"
+    href="#"
+    onClick={[Function]}
+    title="Upload a file to replace the content."
+  >
+    <i
+      className="fa fa-fw fa-upload"
+    />
+    <input
+      className="hidden"
+      onChange={[Function]}
+      type="file"
+    />
+  </a>
+   
+</div>
+`;
diff --git a/web/src/js/components/ContentView/ContentViewOptions.jsx b/web/src/js/components/ContentView/ContentViewOptions.jsx
index e3cc39cd..109fb861 100644
--- a/web/src/js/components/ContentView/ContentViewOptions.jsx
+++ b/web/src/js/components/ContentView/ContentViewOptions.jsx
@@ -4,6 +4,7 @@ import { connect } from 'react-redux'
 import ViewSelector from './ViewSelector'
 import UploadContentButton from './UploadContentButton'
 import DownloadContentButton from './DownloadContentButton'
+import { uploadContent } from '../../ducks/flows'
 
 ContentViewOptions.propTypes = {
     flow: PropTypes.object.isRequired,
@@ -28,5 +29,8 @@ export default connect(
     state => ({
         contentViewDescription: state.ui.flow.viewDescription,
         readonly: !state.ui.flow.modifiedFlow,
-    })
+    }),
+    {
+        uploadContent: uploadContent
+    }
 )(ContentViewOptions)
-- 
cgit v1.2.3


From 950810accbc3523316017b579c10b4e25ad0ce6d Mon Sep 17 00:00:00 2001
From: Matthew Shao <me@matshao.com>
Date: Fri, 2 Jun 2017 09:19:44 +0800
Subject: [web] Update tests for
 js/components/ContentView/ContentViewOptions.jsx

---
 .../js/__tests__/components/ContentView/ContentViewOptionsSpec.js   | 3 ++-
 web/src/js/components/ContentView/ContentViewOptions.jsx            | 6 +-----
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js b/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
index 0b1e8538..68afb4ec 100644
--- a/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
+++ b/web/src/js/__tests__/components/ContentView/ContentViewOptionsSpec.js
@@ -3,6 +3,7 @@ import renderer from 'react-test-renderer'
 import ContentViewOptions from '../../../components/ContentView/ContentViewOptions'
 import { Provider } from 'react-redux'
 import { TFlow, TStore } from '../../ducks/tutils'
+import { uploadContent } from '../../../ducks/flows'
 
 let tflow = new TFlow()
 
@@ -11,7 +12,7 @@ describe('ContentViewOptions Component', () => {
     it('should render correctly', () => {
         let provider = renderer.create(
             <Provider store={store}>
-                <ContentViewOptions flow={tflow} message={tflow.response}/>
+                <ContentViewOptions flow={tflow} message={tflow.response} uploadContent={uploadContent}/>
             </Provider>),
             tree = provider.toJSON()
         expect(tree).toMatchSnapshot()
diff --git a/web/src/js/components/ContentView/ContentViewOptions.jsx b/web/src/js/components/ContentView/ContentViewOptions.jsx
index 109fb861..e3cc39cd 100644
--- a/web/src/js/components/ContentView/ContentViewOptions.jsx
+++ b/web/src/js/components/ContentView/ContentViewOptions.jsx
@@ -4,7 +4,6 @@ import { connect } from 'react-redux'
 import ViewSelector from './ViewSelector'
 import UploadContentButton from './UploadContentButton'
 import DownloadContentButton from './DownloadContentButton'
-import { uploadContent } from '../../ducks/flows'
 
 ContentViewOptions.propTypes = {
     flow: PropTypes.object.isRequired,
@@ -29,8 +28,5 @@ export default connect(
     state => ({
         contentViewDescription: state.ui.flow.viewDescription,
         readonly: !state.ui.flow.modifiedFlow,
-    }),
-    {
-        uploadContent: uploadContent
-    }
+    })
 )(ContentViewOptions)
-- 
cgit v1.2.3


From 465178323f335ef446760854d4f9a46731397dc1 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Fri, 2 Jun 2017 13:26:21 +0200
Subject: explain codemirror rendering shortcomins

---
 web/src/js/__tests__/components/ContentView/CodeEditorSpec.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js b/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
index 2698f13f..ba7acf07 100644
--- a/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
+++ b/web/src/js/__tests__/components/ContentView/CodeEditorSpec.js
@@ -10,7 +10,11 @@ describe('CodeEditor Component', () => {
             <CodeEditor content={content} onChange={changeFn}/>
         ),
         tree = codeEditor.toJSON()
+    
     it('should render correctly', () => {
+        // This actually does not render properly, but getting a full CodeMirror rendering
+        // is cumbersome. This is hopefully good enough.
+        // see: https://github.com/mitmproxy/mitmproxy/pull/2365#discussion_r119766850
         expect(tree).toMatchSnapshot()
     })
 
-- 
cgit v1.2.3