[web] add connection tests

mitmproxy/tools/web/static/app.js

@@ -3358,19 +3358,19 @@ var _react = require("react");
 
 var _react2 = _interopRequireDefault(_react);
 
+var _propTypes = require("prop-types");
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _reactRedux = require("react-redux");
 
-var _classnames = require("classnames");
-
-var _classnames2 = _interopRequireDefault(_classnames);
-
 var _connection = require("../../ducks/connection");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 ConnectionIndicator.propTypes = {
-    state: _react.PropTypes.symbol.isRequired,
+    state: _propTypes2.default.symbol.isRequired,
-    message: _react.PropTypes.string
+    message: _propTypes2.default.string
 
 };
 function ConnectionIndicator(_ref) {
@@ -3399,7 +3399,8 @@ function ConnectionIndicator(_ref) {
         case _connection.ConnectionState.ERROR:
             return _react2.default.createElement(
                 "span",
-                { className: "connection-indicator error", title: message },
+                { className: "connection-indicator error",
+                    title: message },
                 "connection lost"
             );
         case _connection.ConnectionState.OFFLINE:
@@ -3415,7 +3416,7 @@ exports.default = (0, _reactRedux.connect)(function (state) {
     return state.connection;
 })(ConnectionIndicator);
 
-},{"../../ducks/connection":49,"classnames":"classnames","react":"react","react-redux":"react-redux"}],29:[function(require,module,exports){
+},{"../../ducks/connection":49,"prop-types":"prop-types","react":"react","react-redux":"react-redux"}],29:[function(require,module,exports){
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
@@ -4952,10 +4953,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = DocsLink;
 
-var _react = require("react");
+var _propTypes = require("prop-types");
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 DocsLink.propTypes = {
-    resource: _react.PropTypes.string.isRequired
+    resource: _propTypes2.default.string.isRequired
 };
 
 function DocsLink(_ref) {
@@ -4970,7 +4975,7 @@ function DocsLink(_ref) {
     );
 }
 
-},{"react":"react"}],43:[function(require,module,exports){
+},{"prop-types":"prop-types"}],43:[function(require,module,exports){
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {

web/src/js/__tests__/ducks/connectionSpec.js

@@ -0,0 +1,41 @@
+import reduceConnection from "../../ducks/connection"
+import * as ConnectionActions from "../../ducks/connection"
+import { ConnectionState } from "../../ducks/connection"
+
+describe('connection reducer', () => {
+    it('should return initial state', () => {
+        expect(reduceConnection(undefined, {})).toEqual({
+            state: ConnectionState.INIT,
+            message: null,
+        })
+    })
+
+    it('should handle start fetch', () => {
+        expect(reduceConnection(undefined, ConnectionActions.startFetching())).toEqual({
+            state: ConnectionState.FETCHING,
+            message: undefined,
+        })
+    })
+
+    it('should handle connection established', () => {
+        expect(reduceConnection(undefined, ConnectionActions.connectionEstablished())).toEqual({
+            state: ConnectionState.ESTABLISHED,
+            message: undefined,
+        })
+    })
+
+    it('should handle connection error', () => {
+        expect(reduceConnection(undefined, ConnectionActions.connectionError("no internet"))).toEqual({
+            state: ConnectionState.ERROR,
+            message: "no internet",
+        })
+    })
+
+    it('should handle offline mode', () => {
+        expect(reduceConnection(undefined, ConnectionActions.setOffline())).toEqual({
+            state: ConnectionState.OFFLINE,
+            message: undefined,
+        })
+    })
+
+})

web/src/js/components/Header/ConnectionIndicator.jsx

@@ -1,7 +1,7 @@
-import React, { PropTypes } from "react"
+import React from "react"
+import PropTypes from "prop-types"
 import { connect } from "react-redux"
-import classnames from "classnames"
+import { ConnectionState } from "../../ducks/connection"
-import {ConnectionState} from "../../ducks/connection"
 
 
 ConnectionIndicator.propTypes = {
@@ -10,7 +10,7 @@ ConnectionIndicator.propTypes = {
 
 }
 function ConnectionIndicator({ state, message }) {
-    switch(state){
+    switch (state) {
         case ConnectionState.INIT:
             return <span className="connection-indicator init">connecting…</span>;
         case ConnectionState.FETCHING:
@@ -18,7 +18,8 @@ function ConnectionIndicator({ state, message }) {
         case ConnectionState.ESTABLISHED:
             return <span className="connection-indicator established">connected</span>;
         case ConnectionState.ERROR:
-            return <span className="connection-indicator error" title={message}>connection lost</span>;
+            return <span className="connection-indicator error"
+                         title={message}>connection lost</span>;
         case ConnectionState.OFFLINE:
             return <span className="connection-indicator offline">offline</span>;
     }

web/src/js/components/common/DocsLink.jsx

@@ -1,4 +1,4 @@
-import { PropTypes } from 'react'
+import PropTypes from "prop-types"
 
 DocsLink.propTypes = {
     resource: PropTypes.string.isRequired,