openstack
/
fuel-ui
Code Issues Proposed changes

Update JS dependencies 

* Babel to latest 6.x
* React to latest 15.x
* LoDash to latest 3.x version
* selenium-standalone to 5.1.0
* gulp to 3.9.1
* js-cookie to 2.1.0
* karma-webdriver-launcher to 1.0.4
* added whatwg-fetch polyfill
* switched to backbone.routerfilter from NPM

Change-Id: I9517f89c24a053ecf137f27ed297aaa578efb012
This commit is contained in:
Vitaly Kramskikh 2016-03-12 13:00:58 +03:00 committed by Julia Aranovich
parent 4fa15c3d99
commit b06ce77f7f
11 changed files with 5814 additions and 5245 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
gulpfile.js
View File

@ -56,7 +56,7 @@ function shutdownSelenium() {
}
var SELENIUM_VERSION = '2.52.0';
var SELENIUM_DRIVERS = {chrome: {version: '2.20'}};
var SELENIUM_DRIVERS = {};
gulp.task('selenium:fetch', function(cb) {
var selenium = require('selenium-standalone');

10814
npm-shrinkwrap.json generated
View File

File diff suppressed because it is too large Load Diff

49
package.json
View File

@ -15,21 +15,27 @@
"test": "npm run unit-tests && npm run func-tests",
"unit-tests": "gulp unit-tests",
"func-tests": "./run_ui_func_tests.sh",
"nightly-func-tests": "./run_ui_func_tests.sh static/tests/functional/nightly/*.js",
"prepublish": "gulp build"
"nightly-func-tests": "./run_ui_func_tests.sh static/tests/functional/nightly/*.js"
},
"dependencies": {
"autoprefixer": "5.2.0",
"babel-core": "5.8.23",
"babel-loader": "5.3.2",
"babel-core": "6.7.2",
"babel-loader": "6.2.4",
"babel-plugin-transform-es2015-modules-amd": "6.6.5",
"babel-plugin-transform-es2015-modules-commonjs": "6.7.4",
"babel-plugin-transform-runtime": "6.6.0",
"babel-preset-es2015-webpack": "6.4.0",
"babel-preset-react": "6.5.0",
"babel-runtime": "6.6.1",
"backbone": "1.2.1",
"backbone.routefilter": "1.0.0",
"bootstrap": "3.3.4",
"classnames": "1.1.4",
"css-loader": "0.17.0",
"exports-loader": "0.6.2",
"expose-loader": "0.7.0",
"file-loader": "0.8.4",
"gulp": "3.8.11",
"gulp": "3.9.1",
"gulp-filter": "2.0.1",
"gulp-jison": "1.2.0",
"gulp-replace": "0.5.3",
@ -39,36 +45,37 @@
"ip": "1.1.1",
"javascript-natural-sort": "0.7.1",
"jquery": "1.11.3",
"js-cookie": "1.5.1",
"js-cookie": "2.1.0",
"json-loader": "0.5.3",
"less": "2.4.0",
"less-loader": "2.2.1",
"lodash": "3.9.3",
"lodash": "3.10.1",
"minimist": "1.1.1",
"open-sans-fontface": "1.4.0",
"postcss-loader": "0.5.1",
"raw-loader": "0.5.1",
"react": "0.14.3",
"react-addons-create-fragment": "0.14.3",
"react-addons-css-transition-group": "0.14.3",
"react-addons-linked-state-mixin": "0.14.3",
"react-addons-pure-render-mixin": "0.14.3",
"react-addons-transition-group": "0.14.3",
"react-dnd": "2.0.2",
"react-dnd-html5-backend": "2.0.0",
"react-dom": "0.14.3",
"react": "15.0.1",
"react-addons-create-fragment": "15.0.1",
"react-addons-css-transition-group": "15.0.1",
"react-addons-linked-state-mixin": "15.0.1",
"react-addons-pure-render-mixin": "15.0.1",
"react-addons-transition-group": "15.0.1",
"react-dnd": "2.1.4",
"react-dnd-html5-backend": "2.1.2",
"react-dom": "15.0.1",
"rimraf": "2.2.8",
"run-sequence": "1.0.2",
"style-loader": "0.12.4",
"webpack": "1.12.9"
"webpack": "1.12.9",
"whatwg-fetch": "0.11.0"
},
"devDependencies": {
"chai": "~3.2.0",
"es5-shim": "4.1.11",
"eslint": "1.10.3",
"eslint-config-openstack": "1.2.3",
"eslint-plugin-react": "3.15.0",
"glob": "~5.0.5",
"gulp-babel": "6.1.2",
"gulp-eslint": "1.0.0",
"gulp-lintspaces": "0.3.2",
"gulp-shell": "0.4.1",
@ -77,12 +84,12 @@
"karma-chai": "~0.1.0",
"karma-mocha": "~0.2.0",
"karma-sinon": "~1.0.4",
"karma-webdriver-launcher": "1.0.0",
"karma-webdriver-launcher": "1.0.4",
"karma-webpack": "~1.7.0",
"mocha": "~2.3.2",
"nlf": "~1.3.2",
"react-addons-test-utils": "0.14.3",
"selenium-standalone": "~4.4.0",
"react-addons-test-utils": "15.0.1",
"selenium-standalone": "5.1.0",
"sinon": "1.17.2",
"webpack-dev-server": "1.14.0"
}

22
static/tests/functional/helpers.js
View File

@ -414,28 +414,6 @@ define([
.end();
});
},
assertElementAttributeEquals: function(cssSelector, attribute, expectedText, message) {
return new this.constructor(this, function() {
return this.parent
.findByCssSelector(cssSelector)
.getAttribute(attribute)
.then(function(actualText) {
assert.equal(actualText, expectedText, message);
})
.end();
});
},
assertElementAttributeContains: function(cssSelector, attribute, text, message) {
return new this.constructor(this, function() {
return this.parent
.findByCssSelector(cssSelector)
.getAttribute(attribute)
.then(function(actualText) {
assert.include(actualText, text, message);
})
.end();
});
},
assertElementPropertyEquals: function(cssSelector, attribute, expectedText, message) {
return new this.constructor(this, function() {
return this.parent

2
static/tests/functional/pages/welcome.js
View File

@ -29,7 +29,7 @@ define(['tests/functional/helpers'], function() {
function() {
return this.parent
.clickByCssSelector('.welcome-button-box button')
.waitForDeletedByCssSelector('.welcome-button-box button', 2000)
.waitForDeletedByCssSelector('.welcome-button-box button', 3000)
.then(
function() {
return true;

28
static/tests/functional/test_cluster_deployment.js
View File

@ -284,7 +284,9 @@ define([
'Test deployed cluster': function() {
this.timeout = 100000;
var self = this;
var cidrInitialValue;
var cidrCssSelector = '.storage input[name=cidr]';
var cidrDeployedValue;
return this.remote
.then(function() {
return dashboardPage.startDeployment();
@ -297,7 +299,7 @@ define([
.assertElementAppears('.links-block', 5000, 'Deployment completed')
.assertElementExists('.go-to-healthcheck', 'Healthcheck link is visible after deploy')
.findByLinkText('Horizon')
.getAttribute('href')
.getProperty('href')
.then(function(href) {
// check the link includes 'http(s)' and there is '.' in it's domain
return assert.match(
@ -314,22 +316,24 @@ define([
'.add-nodegroup-btn',
'Add Node network group button is enabled after cluster deploy'
)
.findByCssSelector('.storage input[name=cidr]')
.findByCssSelector(cidrCssSelector)
.then(function(element) {
return element.getProperty('value')
.then(function(value) {
cidrInitialValue = value;
cidrDeployedValue = value;
});
})
.end()
.setInputValue('.storage input[name=cidr]', '192.168.1.0/25')
.clickByCssSelector('.apply-btn')
.setInputValue(cidrCssSelector, '192.168.1.0/25')
.clickByCssSelector('.apply-btn:not(:disabled)')
.waitForCssSelector(cidrCssSelector + ':not(:disabled)', 1000)
.clickByCssSelector('.btn-load-deployed')
.waitForCssSelector('.apply-btn:not(:disabled)', 1000)
.then(function() {
return self.remote.assertElementAttributeEquals(
'.storage input[name=cidr]',
return self.remote.assertElementPropertyEquals(
cidrCssSelector,
'value',
cidrInitialValue,
cidrDeployedValue,
'Load Deployed Settings button works properly'
);
})
@ -363,10 +367,10 @@ define([
return clusterPage.goToTab('Networks');
})
.then(function() {
return self.remote.assertElementAttributeEquals(
'.storage input[name=cidr]',
return self.remote.assertElementPropertyEquals(
cidrCssSelector,
'value',
cidrInitialValue,
cidrDeployedValue,
'Network settings are reset to their deployed state'
);
})

2
static/tests/functional/test_cluster_network.js
View File

@ -106,7 +106,7 @@ define([
return this.remote
.findByCssSelector(cidrElementSelector)
.then(function(element) {
return element.getAttribute('value')
return element.getProperty('value')
.then(function(value) {
cidrInitialValue = value;
});

128
static/vendor/custom/backbone.routefilter.js vendored
View File

@ -1,128 +0,0 @@
/*! backbone.routefilter - v0.2.0 - 2014-05-06
* https://github.com/boazsender/backbone.routefilter
* Copyright (c) 2014 Boaz Sender; Licensed MIT */
(function(factory) {
if (typeof define === 'function' && define.amd) {
define(['backbone', 'underscore'], factory);
} else if (typeof exports === 'object') {
module.exports = factory(require('backbone'), require('underscore'));
} else {
factory(window.Backbone, window._);
}
})(function(Backbone, _) {
// Save a reference to the original route method to be called
// after we pave it over.
var originalRoute = Backbone.Router.prototype.route;
// Create a reusable no operation func for the case where a before
// or after filter is not set. Backbone or Underscore should have
// a global one of these in my opinion.
var nop = function(){};
// Extend the router prototype with a default before function,
// a default after function, and a pave over of _bindRoutes.
_.extend(Backbone.Router.prototype, {
// Add default before filter.
before: nop,
// Add default after filter.
after: nop,
// Pave over Backbone.Router.prototype.route, the public method used
// for adding routes to a router instance on the fly, and the
// method which backbone uses internally for binding routes to handlers
// on the Backbone.history singleton once it's instantiated.
route: function(route, name, callback) {
// If there is no callback present for this route, then set it to
// be the name that was set in the routes property of the constructor,
// or the name arguement of the route method invocation. This is what
// Backbone.Router.route already does. We need to do it again,
// because we are about to wrap the callback in a function that calls
// the before and after filters as well as the original callback that
// was passed in.
if( !callback ){
callback = this[ name ];
}
// Create a new callback to replace the original callback that calls
// the before and after filters as well as the original callback
// internally.
var wrappedCallback = _.bind( function() {
// Call the before filter and if it returns false, run the
// route's original callback, and after filter. This allows
// the user to return false from within the before filter
// to prevent the original route callback and after
// filter from running.
var callbackArgs = [ route, _.toArray(arguments) ];
var beforeCallback;
if ( _.isFunction(this.before) ) {
// If the before filter is just a single function, then call
// it with the arguments.
beforeCallback = this.before;
} else if ( typeof this.before[route] !== "undefined" ) {
// otherwise, find the appropriate callback for the route name
// and call that.
beforeCallback = this.before[route];
} else {
// otherwise, if we have a hash of routes, but no before callback
// for this route, just use a nop function.
beforeCallback = nop;
}
// If the before callback fails during its execusion (by returning)
// false, then do not proceed with the route triggering.
if ( beforeCallback.apply(this, callbackArgs) === false ) {
return;
}
// If the callback exists, then call it. This means that the before
// and after filters will be called whether or not an actual
// callback function is supplied to handle a given route.
if( callback ) {
callback.apply( this, arguments );
}
var afterCallback;
if ( _.isFunction(this.after) ) {
// If the after filter is a single funciton, then call it with
// the proper arguments.
afterCallback = this.after;
} else if ( typeof this.after[route] !== "undefined" ) {
// otherwise if we have a hash of routes, call the appropriate
// callback based on the route name.
afterCallback = this.after[route];
} else {
// otherwise, if we have a has of routes but no after callback
// for this route, just use the nop function.
afterCallback = nop;
}
// Call the after filter.
afterCallback.apply( this, callbackArgs );
}, this);
// Call our original route, replacing the callback that was originally
// passed in when Backbone.Router.route was invoked with our wrapped
// callback that calls the before and after callbacks as well as the
// original callback.
return originalRoute.call( this, route, name, wrappedCallback );
}
});
});

3
static/views/capacity_page.js
View File

@ -96,7 +96,8 @@ var LicenseUsage = React.createClass({
tableClassName={tableClassName}
/>
<a href='/api/capacity/csv' target='_blank' className='btn btn-info'>
<i className='glyphicon glyphicon-download-alt' />{' '}
<i className='glyphicon glyphicon-download-alt' />
&nbsp;
{i18n('capacity_page.download_report')}
</a>
</div>

2
static/views/cluster_page_tabs/nodes_tab_screens/node_list_screen.js
View File

@ -1883,7 +1883,7 @@ Role = React.createClass({
'glyphicon-warning-sign': !!warnings.length
})}
/>
{role.get('label')}
<span>{role.get('label')}</span>
</div>
</div>
{this.state.isPopoverVisible &&

7
webpack.config.js
View File

@ -2,7 +2,6 @@
module.exports = {
entry: [
'babel-core/polyfill',
'./static/app.js'
],
output: {
@ -18,7 +17,11 @@ module.exports = {
test: /\.js$/,
loader: 'babel',
exclude: [/(node_modules|vendor\/custom)\//, /\/expression\/parser\.js$/],
query: {cacheDirectory: true}
query: {
cacheDirectory: true,
plugins: ['transform-runtime', 'transform-es2015-modules-commonjs'],
presets: ['es2015-webpack', 'react']
}
},
{test: /\/expression\/parser\.js$/, loader: 'exports?parser'},
{test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$'},