Added tests for helpers and components. All react components are now ES5.

This commit is contained in:
Mario Basic
2015-06-17 18:15:20 +02:00
parent a4fe94ac75
commit 2e64a56de2
14 changed files with 501 additions and 503 deletions

View File

@@ -1,6 +1,4 @@
var React = require('react');
var ReactAddons = require('react/addons');
var ReactCSSTransitionGroup = ReactAddons.addons.CSSTransitionGroup;
var classNames = require('classnames');
var Alert = React.createClass({

View File

@@ -1,13 +1,8 @@
//jshint esnext:true
var React = require('react');
class MainList extends React.Component {
componentDidMount() {
var MainList = React.createClass({
}
_openOptionsPage() {
_openOptionsPage: function() {
if (chrome.runtime.openOptionsPage) {
// New way to open options pages, if supported (Chrome 42+).
chrome.runtime.openOptionsPage();
@@ -15,14 +10,17 @@ class MainList extends React.Component {
// Reasonable fallback.
window.open(chrome.runtime.getURL('options.html'));
}
}
},
render() {
var loginLogoutButton = () => {
if (this.props.loggedIn === true) {
render: function() {
var that = this;
var loginLogoutButton = function() {
if (that.props.loggedIn === true) {
return (
<div>
<a href="#" className="list-group-item" onClick={this.props.logoutUser}>
<a href="#" className="list-group-item" onClick={that.props.logoutUser}>
<i className="fa fa-fw fa-sign-out"></i>
Logout
</a>
@@ -39,26 +37,26 @@ class MainList extends React.Component {
};
// If logging is enabled, display that info to user
var loggingStatus = () => {
if(this.props.loggingEnabled === true && this.props.loggedIn === true)
var loggingStatus = function() {
if(that.props.loggingEnabled === true && that.props.loggedIn === true)
{
return (
<div className="row">
<div className="col-xs-12">
<p>
<a href="#" onClick={this.props.disableLogging} className="btn btn-danger btn-block">Disable logging</a>
<a href="#" onClick={that.props.disableLogging} className="btn btn-danger btn-block">Disable logging</a>
</p>
</div>
</div>
);
}
else if(this.props.loggingEnabled === false && this.props.loggedIn === true)
else if(that.props.loggingEnabled === false && that.props.loggedIn === true)
{
return (
<div className="row">
<div className="col-xs-12">
<p>
<a href="#" onClick={this.props.enableLogging} className="btn btn-success btn-block">Enable logging</a>
<a href="#" onClick={that.props.enableLogging} className="btn btn-success btn-block">Enable logging</a>
</p>
</div>
</div>
@@ -66,13 +64,13 @@ class MainList extends React.Component {
}
};
var totalTimeLoggedToday = () => {
if (this.props.loggedIn === true) {
var totalTimeLoggedToday = function() {
if (that.props.loggedIn === true) {
return (
<div className="row">
<div className="col-xs-12">
<blockquote>
<p>{this.props.totalTimeLoggedToday}</p>
<p>{that.props.totalTimeLoggedToday}</p>
<small><cite>TOTAL TIME LOGGED TODAY</cite></small>
</blockquote>
</div>
@@ -100,6 +98,7 @@ class MainList extends React.Component {
</div>
);
}
}
export default MainList;
});
module.exports = MainList;

View File

@@ -1,21 +1,21 @@
//jshint esnext:true
var React = require('react');
class Navbar extends React.Component {
var Navbar = React.createClass({
render() {
render: function() {
var signedInAs = () => {
if (this.props.loggedIn === true) {
var that = this;
var signedInAs = function() {
if (that.props.loggedIn === true) {
return (
<p className="navbar-text">Signed in as <b>{this.props.user.full_name}</b></p>
<p className="navbar-text">Signed in as <b>{that.props.user.full_name}</b></p>
);
}
};
var dashboard = () => {
if (this.props.loggedIn === true) {
var dashboard = function() {
if (that.props.loggedIn === true) {
return (
<li>
<a target="_blank" href="https://wakatime.com/dashboard">
@@ -27,8 +27,8 @@ class Navbar extends React.Component {
}
};
var customRules = () => {
if (this.props.loggedIn === true) {
var customRules = function() {
if (that.props.loggedIn === true) {
return (
<li>
<a target="_blank" href="https://wakatime.com/settings/rules">
@@ -84,6 +84,6 @@ class Navbar extends React.Component {
);
}
}
});
export default Navbar;
module.exports = Navbar;

View File

@@ -1,5 +1,3 @@
//jshint esnext:true
var React = require("react");
var $ = require('jquery');
@@ -15,13 +13,10 @@ var WakaTimeOriginal = require('../core/WakaTime');
// Helpers
var changeExtensionState = require('../helpers/changeExtensionState');
class WakaTime extends React.Component {
var WakaTime = React.createClass({
constructor(props){
super(props);
this.state = {
getInitialState: function() {
return {
user: {
full_name: null,
email: null,
@@ -31,21 +26,23 @@ class WakaTime extends React.Component {
loggingEnabled: config.loggingEnabled,
totalTimeLoggedToday: '0 minutes'
};
}
},
componentDidMount() {
componentDidMount: function() {
var wakatime = new WakaTimeOriginal;
wakatime.checkAuth().done(data => {
var that = this;
wakatime.checkAuth().done(function(data) {
if (data !== false) {
chrome.storage.sync.get({
loggingEnabled: config.loggingEnabled
}, (items) => {
this.setState({loggingEnabled: items.loggingEnabled});
}, function(items) {
that.setState({loggingEnabled: items.loggingEnabled});
if (items.loggingEnabled === true) {
changeExtensionState('allGood');
}
@@ -54,7 +51,7 @@ class WakaTime extends React.Component {
}
});
this.setState({
that.setState({
user: {
full_name: data.full_name,
email: data.email,
@@ -63,10 +60,10 @@ class WakaTime extends React.Component {
loggedIn: true
});
wakatime.getTotalTimeLoggedToday().done((grand_total) => {
this.setState({
wakatime.getTotalTimeLoggedToday().done(function(grand_total) {
that.setState({
totalTimeLoggedToday: grand_total['text']
})
});
});
}
else {
@@ -74,34 +71,39 @@ class WakaTime extends React.Component {
}
});
}
},
logoutUser() {
logoutUser: function() {
var deferredObject = $.Deferred();
var that = this;
$.ajax({
url: config.logoutUserUrl,
method: 'GET',
success: () => {
success: function() {
deferredObject.resolve(this);
deferredObject.resolve(that);
},
error: (xhr, status, err) => {
console.error(config.logoutUserUrl, status, err.toString());
deferredObject.resolve(this);
deferredObject.resolve(that);
}
});
return deferredObject.promise();
}
},
_logoutUser() {
this.logoutUser().done(() => {
_logoutUser: function() {
this.setState({
var that = this;
this.logoutUser().done(function(){
that.setState({
user: {
full_name: null,
email: null,
@@ -114,9 +116,9 @@ class WakaTime extends React.Component {
changeExtensionState('notSignedIn');
});
}
},
_disableLogging() {
_disableLogging: function() {
this.setState({
loggingEnabled: false
});
@@ -126,9 +128,9 @@ class WakaTime extends React.Component {
chrome.storage.sync.set({
loggingEnabled: false
});
}
},
_enableLogging() {
_enableLogging: function() {
this.setState({
loggingEnabled: true
});
@@ -138,10 +140,9 @@ class WakaTime extends React.Component {
chrome.storage.sync.set({
loggingEnabled: true
});
}
},
render() {
render: function() {
return (
<div>
<NavBar
@@ -151,12 +152,12 @@ class WakaTime extends React.Component {
<div className="row">
<div className="col-md-12">
<MainList
disableLogging={this._disableLogging.bind(this)}
enableLogging={this._enableLogging.bind(this)}
disableLogging={this._disableLogging}
enableLogging={this._enableLogging}
loggingEnabled={this.state.loggingEnabled}
user={this.state.user}
totalTimeLoggedToday={this.state.totalTimeLoggedToday}
logoutUser={this._logoutUser.bind(this)}
logoutUser={this._logoutUser}
loggedIn={this.state.loggedIn} />
</div>
</div>
@@ -164,6 +165,7 @@ class WakaTime extends React.Component {
</div>
);
}
}
export default WakaTime;
});
module.exports = WakaTime;