set up a new view for displaying the network status

// FREEBIE
This commit is contained in:
Sam Vevang 2017-01-03 21:37:56 -06:00 committed by lilia
parent e4a21d1a53
commit ed4991974b
13 changed files with 326 additions and 76 deletions

View file

@ -18,6 +18,7 @@
</div>
<script type='text/x-tmpl-mustache' id='two-column'>
<div class='gutter'>
<div class='network-status-container'></div>
<div class='title-bar active' id='header'>
<div class='header-buttons right'>
<div class='vertical-align'>
@ -29,7 +30,6 @@
<li class='restart-signal'>{{ restartSignal }}</li>
</ul>
</div>
<span class='socket-status'></span>
</div>
</div>
<h1>Signal</h1>
@ -485,6 +485,19 @@
</div>
</script>
<script type='text/x-tmpl-mustache' id='networkStatus'>
<div class='network-status-message' style='{{^instructions}}margin-top:3px;{{/instructions}}{{#instructions}}margin-top:-6px{{/instructions}}'>
<h3 style='{{^instructions}}font-size:17px;{{/instructions}}'>{{ message }}</h3>
<span>{{ instructions }}</span>
</div>
{{ #reconnectDurationAsSeconds }}
<div class="network-status-message">
{{ attemptingReconnectionMessage }}
</div>
{{/reconnectDurationAsSeconds }}
</script>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript" src="blanket_mocha.js"></script>
@ -529,7 +542,9 @@
<script type='text/javascript' src='../js/views/conversation_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/conversation_search_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/hint_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/network_status_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/inbox_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/network_status_view.js'></script>
<script type='text/javascript' src='../js/views/confirmation_dialog_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/identicon_svg_view.js' data-cover></script>
<script type='text/javascript' src='../js/views/settings_view.js' data-cover></script>
@ -542,6 +557,7 @@
<script type="text/javascript" src="views/timestamp_view_test.js"></script>
<script type="text/javascript" src="views/list_view_test.js"></script>
<script type="text/javascript" src="views/conversation_search_view_test.js"></script>
<script type="text/javascript" src="views/network_status_view_test.js"></script>
<script type="text/javascript" src="models/conversations_test.js"></script>
<script type="text/javascript" src="models/messages_test.js"></script>
<script type="text/javascript" src="storage_test.js"></script>

View file

@ -0,0 +1,125 @@
describe('NetworkStatusView', function() {
describe('getNetworkStatus', function() {
var networkStatusView;
var socketStatus = WebSocket.OPEN;
var oldGetMessage;
var oldGetSocketStatus;
/* BEGIN stubbing globals */
before(function() {
oldGetSocketStatus = window.getSocketStatus;
/* chrome i18n support is missing in 'regular' webpages */
window.chrome.i18n = { getMessage: function(message, args) {
// translationMessageName-arg1-arg2
return _([message, args]).chain().flatten().compact().value().join('-');
}
};
window.getSocketStatus = function() { return socketStatus; };
});
after(function() {
window.getSocketStatus = oldGetSocketStatus;
});
/* END stubbing globals */
beforeEach(function(done) {
networkStatusView = new Whisper.NetworkStatusView();
$('.network-status-container').append(networkStatusView.el);
// stubbing global
done();
});
describe('initialization', function() {
it('should have an empty interval', function() {
assert.equal(networkStatusView.socketReconnectWaitDuration.asSeconds(), 0);
});
});
describe('network status with no connection', function() {
beforeEach(function() {
networkStatusView.navigatorOnLine = function() { return false; };
});
it('should be interrupted', function() {
networkStatusView.render();
var status = networkStatusView.getNetworkStatus();
assert(status.hasInterruption);
assert.equal(status.instructions, "checkNetworkConnection");
});
it('should display an offline message', function() {
networkStatusView.render();
assert.match(networkStatusView.$el.text(), /offline/);
});
it('should override socket status', function() {
_([WebSocket.CONNECTING,
WebSocket.OPEN,
WebSocket.CLOSING,
WebSocket.CLOSED]).map(function(socketStatusVal) {
socketStatus = socketStatusVal;
networkStatusView.render();
assert.match(networkStatusView.$el.text(), /offline/);
});
});
});
describe('network status when socket is connecting', function() {
beforeEach(function() {
socketStatus = WebSocket.CONNECTING;
networkStatusView.render();
});
it('it should display a connecting string if connecting and not in the connecting grace period', function() {
networkStatusView.withinConnectingGracePeriod = false;
var status = networkStatusView.getNetworkStatus();
assert.match(networkStatusView.$el.text(), /connecting/);
});
it('it should not be interrupted if in connecting grace period', function() {
assert(networkStatusView.withinConnectingGracePeriod);
var status = networkStatusView.getNetworkStatus();
assert.match(networkStatusView.$el.text(), /connecting/);
assert(!status.hasInterruption);
});
it('it should be interrupted if connecting grace period is over', function() {
networkStatusView.withinConnectingGracePeriod = false;
var status = networkStatusView.getNetworkStatus();
assert(status.hasInterruption);
});
});
describe('network status when socket is open', function() {
before(function() {
socketStatus = WebSocket.OPEN;
});
it('should not be interrupted', function() {
var status = networkStatusView.getNetworkStatus();
assert(!status.hasInterruption);
assert.match(networkStatusView.$el.find('.network-status-message').text().trim(), /^$/);
});
});
describe('network status when socket is closed or closing', function() {
_([WebSocket.CLOSED, WebSocket.CLOSING]).map(function(socketStatusVal) {
it('should be interrupted', function() {
socketStatus = socketStatusVal;
networkStatusView.render();
var status = networkStatusView.getNetworkStatus();
assert(status.hasInterruption);
});
});
});
describe('the socket reconnect interval', function() {
beforeEach(function() {
socketStatus = WebSocket.CLOSED;
networkStatusView.setSocketReconnectInterval(61000);
networkStatusView.render();
});
it('should format the message based on the socketReconnectWaitDuration property', function() {
assert.equal(networkStatusView.socketReconnectWaitDuration.asSeconds(), 61);
assert.match(networkStatusView.$('.network-status-message:last').text(), /attemptingReconnection-61/);
});
it('should be reset by changing the socketStatus to CONNECTING', function() {
});
});
});
});