Mercurial > hg > thermostat-ng > web-client
changeset 181:8d3c8addabad
Convert jvm-info module into component
Reviewed-by: jerboaa
Review-thread: http://icedtea.classpath.org/pipermail/thermostat/2017-September/024868.html
| author | Andrew Azores <aazores@redhat.com> |
|---|---|
| date | Thu, 07 Sep 2017 08:10:36 -0400 |
| parents | 53de35e22716 |
| children | dccfce4148fc |
| files | src/app/components/jvm-info/jvm-info.component.js src/app/components/jvm-info/jvm-info.controller.js src/app/components/jvm-info/jvm-info.controller.spec.js src/app/components/jvm-info/jvm-info.html src/app/components/jvm-info/jvm-info.module.js src/app/components/jvm-info/jvm-info.routing.js src/app/components/jvm-info/jvm-info.routing.spec.js |
| diffstat | 7 files changed, 102 insertions(+), 169 deletions(-) [+] |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/app/components/jvm-info/jvm-info.component.js Thu Sep 07 08:10:36 2017 -0400 @@ -0,0 +1,42 @@ +/** + * Copyright 2012-2017 Red Hat, Inc. + * + * Thermostat is distributed under the GNU General Public License, + * version 2 or any later version (with a special exception described + * below, commonly known as the "Classpath Exception"). + * + * A copy of GNU General Public License (GPL) is included in this + * distribution, in the file COPYING. + * + * Linking Thermostat code with other modules is making a combined work + * based on Thermostat. Thus, the terms and conditions of the GPL + * cover the whole combination. + * + * As a special exception, the copyright holders of Thermostat give you + * permission to link this code with independent modules to produce an + * executable, regardless of the license terms of these independent + * modules, and to copy and distribute the resulting executable under + * terms of your choice, provided that you also meet, for each linked + * independent module, the terms and conditions of the license of that + * module. An independent module is a module which is not derived from + * or based on Thermostat code. If you modify Thermostat, you may + * extend this exception to your version of the software, but you are + * not obligated to do so. If you do not wish to do so, delete this + * exception statement from your version. + */ + +import JvmInfoController from './jvm-info.controller.js'; +import jvmInfoService from './jvm-info.service.js'; +import killVmService from './kill-vm.service.js'; + +export default angular + .module('jvmInfo', [ + JvmInfoController, + jvmInfoService, + killVmService + ]) + .component('jvmInfo', { + controller: 'JvmInfoController', + template: require('./jvm-info.html') + }) + .name;
--- a/src/app/components/jvm-info/jvm-info.controller.js Thu Sep 07 08:06:46 2017 -0400 +++ b/src/app/components/jvm-info/jvm-info.controller.js Thu Sep 07 08:10:36 2017 -0400 @@ -30,10 +30,11 @@ import systemService from 'components/system-info/system-info.service.js'; class JvmInfoController { - constructor ($scope, $state, systemId, jvmId, jvmInfoService, killVmService, systemInfoService, $translate) { + constructor ($state, $stateParams, jvmInfoService, killVmService, systemInfoService, $translate) { 'ngInject'; - this.systemId = systemId; - this.jvmId = jvmId; + this._state = $state; + this.systemId = $stateParams.systemId; + this.jvmId = $stateParams.jvmId; this.jvmInfoService = jvmInfoService; this.killVmService = killVmService; this.systemInfoService = systemInfoService; @@ -41,20 +42,20 @@ this.showErr = false; $translate('jvmInfo.killVm.FAIL_MSG_TITLE').then(s => this.errTitle = s); - $scope.$watch('comboValue', cur => { - if (cur === '') { - $state.go('jvmInfo', { systemId: systemId, jvmId: jvmId }); - } else { - $state.go('jvmInfo.' + cur, { systemId: systemId, jvmId: jvmId }); - } - }); - this.systemHostname = this.systemId; systemInfoService.getSystemInfo(this.systemId).then(res => this.systemHostname = res.data.response[0].hostname); this.update(); } + set subView (val) { + if (val === '') { + this._state.go('jvmInfo', { systemId: this.systemId, jvmId: this.jvmId }); + } else { + this._state.go('jvmInfo.' + val, { systemId: this.systemId, jvmId: this.jvmId }); + } + } + update () { this.jvmInfoService.getJvmInfo(this.systemId, this.jvmId).then( res => {
--- a/src/app/components/jvm-info/jvm-info.controller.spec.js Thu Sep 07 08:06:46 2017 -0400 +++ b/src/app/components/jvm-info/jvm-info.controller.spec.js Thu Sep 07 08:10:36 2017 -0400 @@ -29,48 +29,29 @@ beforeEach(angular.mock.module('jvmInfo.controller')); - let scope, state, jvmInfoService, killVmService, ctrl, infoPromise, killPromise, systemInfoService, systemInfoPromise, translate; + let state, jvmInfoService, killVmService, ctrl, infoPromise, killPromise, systemInfoService, systemInfoPromise, translate; beforeEach(inject($controller => { 'ngInject'; - scope = { - $watch: sinon.spy() - }; + state = { go: sinon.spy() }; - state = { - go: sinon.spy() - }; - - infoPromise = { - then: sinon.stub() - }; - jvmInfoService = { - getJvmInfo: sinon.stub().returns(infoPromise) - }; + infoPromise = { then: sinon.stub() }; + jvmInfoService = { getJvmInfo: sinon.stub().returns(infoPromise) }; - killPromise = { - then: sinon.stub().returns({ finally: sinon.stub().yields() }) - }; - killVmService = { - killVm: sinon.stub().returns(killPromise) - }; + killPromise = { then: sinon.stub().returns({ finally: sinon.stub().yields() }) }; + killVmService = { killVm: sinon.stub().returns(killPromise) }; - systemInfoPromise = { - then: sinon.stub() - }; - systemInfoService = { - getSystemInfo: sinon.stub().returns(systemInfoPromise) - }; + systemInfoPromise = { then: sinon.stub() }; + systemInfoService = { getSystemInfo: sinon.stub().returns(systemInfoPromise) }; - translate = sinon.stub().returns({ - then: sinon.stub().yields() - }); + translate = sinon.stub().returns({ then: sinon.stub().yields() }); ctrl = $controller('JvmInfoController', { - $scope: scope, $state: state, - systemId: 'bar-systemId', - jvmId: 'foo-jvmId', + $stateParams: { + systemId: 'bar-systemId', + jvmId: 'foo-jvmId' + }, jvmInfoService: jvmInfoService, killVmService: killVmService, systemInfoService: systemInfoService, @@ -202,21 +183,13 @@ }); describe('combobox state navigation', () => { - it('should register a scope-watcher for comboValue', () => { - scope.$watch.should.be.calledWith(sinon.match('comboValue'), sinon.match.func); - }); - it('should go to root jvm-info state on empty selection', () => { - let func = scope.$watch.args[0][1]; - state.go.should.not.be.called(); - func('', ''); + ctrl.subView = ''; state.go.should.be.calledWith(sinon.match('jvmInfo'), sinon.match.has('jvmId', 'foo-jvmId')); }); it('should go to specified jvm-info child state on non-empty selection', () => { - let func = scope.$watch.args[0][1]; - state.go.should.not.be.called(); - func('fooState', ''); + ctrl.subView = 'fooState'; state.go.should.be.calledWith(sinon.match('jvmInfo.fooState'), sinon.match.has('jvmId', 'foo-jvmId')); }); });
--- a/src/app/components/jvm-info/jvm-info.html Thu Sep 07 08:06:46 2017 -0400 +++ b/src/app/components/jvm-info/jvm-info.html Thu Sep 07 08:10:36 2017 -0400 @@ -1,12 +1,12 @@ <div class="container-fluid container-cards-pf"> <ol class="breadcrumb" style="margin-bottom: 0px;"> <li><a ui-sref="landing">Thermostat</a></li> - <li><a ui-sref="jvmList({ '#': ctrl.systemId })" translate>jvmInfo.JVM_LIST_BREADCRUMB</a></li> - <li><a ui-sref="systemInfo({ systemId: ctrl.systemId })">{{ctrl.systemHostname}}</a></li> - <li><a ui-sref="jvmInfo({ systemId: ctrl.systemId, jvmId: ctrl.jvmId })">{{ctrl.jvmInfo.mainClass | extractClass}}</a></li> + <li><a ui-sref="jvmList({ '#': $ctrl.systemId })" translate>jvmInfo.JVM_LIST_BREADCRUMB</a></li> + <li><a ui-sref="systemInfo({ systemId: $ctrl.systemId })">{{$ctrl.systemHostname}}</a></li> + <li><a ui-sref="jvmInfo({ systemId: $ctrl.systemId, jvmId: $ctrl.jvmId })">{{$ctrl.jvmInfo.mainClass | extractClass}}</a></li> </ol> - <customizable-error-message ng-show="ctrl.showErr" dismissible="true" err-title="ctrl.errTitle" err-message="ctrl.errMessage"></customizable-error-message> + <customizable-error-message ng-show="$ctrl.showErr" dismissible="true" err-title="$ctrl.errTitle" err-message="$ctrl.errMessage"></customizable-error-message> <div class="row"> <div class="col-xs-12 col-lg-8"> @@ -29,67 +29,67 @@ <tbody class="break-word-wrap"> <tr> <td translate>jvmInfo.table.USERNAME</td> - <td>{{ctrl.jvmInfo.username}}</td> + <td>{{$ctrl.jvmInfo.username}}</td> </tr> <tr> <td translate>jvmInfo.table.UID</td> - <td>{{ctrl.jvmInfo.uid}}</td> + <td>{{$ctrl.jvmInfo.uid}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_ID</td> - <td>{{ctrl.jvmInfo.jvmId}}</td> + <td>{{$ctrl.jvmInfo.jvmId}}</td> </tr> <tr> <td translate>jvmInfo.table.MAIN_CLASS</td> - <td>{{ctrl.jvmInfo.mainClass}}</td> + <td>{{$ctrl.jvmInfo.mainClass}}</td> </tr> <tr> <td translate>jvmInfo.table.START_TIME</td> - <td>{{ctrl.jvmInfo.startTime | date:"medium"}}</td> + <td>{{$ctrl.jvmInfo.startTime | date:"medium"}}</td> </tr> - <tr ng-show="!ctrl.jvmInfo.isAlive"> + <tr ng-show="!$ctrl.jvmInfo.isAlive"> <td translate>jvmInfo.table.STOP_TIME</td> - <td>{{ctrl.jvmInfo.stopTime | date:"medium"}}</td> + <td>{{$ctrl.jvmInfo.stopTime | date:"medium"}}</td> </tr> - <tr ng-show="ctrl.jvmInfo.isAlive"> + <tr ng-show="$ctrl.jvmInfo.isAlive"> <td translate>jvmInfo.table.LAST_UPDATED</td> - <td>{{ctrl.jvmInfo.lastUpdated | date:"medium"}}</td> + <td>{{$ctrl.jvmInfo.lastUpdated | date:"medium"}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_PID</td> - <td>{{ctrl.jvmInfo.jvmPid}}</td> + <td>{{$ctrl.jvmInfo.jvmPid}}</td> </tr> <tr> <td translate>jvmInfo.table.JAVA_VERSION</td> - <td>{{ctrl.jvmInfo.javaVersion}}</td> + <td>{{$ctrl.jvmInfo.javaVersion}}</td> </tr> <tr> <td translate>jvmInfo.table.JAVA_HOME</td> - <td>{{ctrl.jvmInfo.javaHome}}</td> + <td>{{$ctrl.jvmInfo.javaHome}}</td> </tr> <tr> <td translate>jvmInfo.table.COMMAND_LINE</td> - <td>{{ctrl.jvmInfo.javaCommandLine}}</td> + <td>{{$ctrl.jvmInfo.javaCommandLine}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_NAME</td> - <td>{{ctrl.jvmInfo.jvmName}}</td> + <td>{{$ctrl.jvmInfo.jvmName}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_INFO</td> - <td>{{ctrl.jvmInfo.jvmInfo}}</td> + <td>{{$ctrl.jvmInfo.jvmInfo}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_VERSION</td> - <td>{{ctrl.jvmInfo.jvmVersion}}</td> + <td>{{$ctrl.jvmInfo.jvmVersion}}</td> </tr> <tr> <td translate>jvmInfo.table.JVM_ARGUMENTS</td> - <td>{{ctrl.jvmInfo.jvmArguments}}</td> + <td>{{$ctrl.jvmInfo.jvmArguments}}</td> </tr> <tr> <td translate>jvmInfo.table.CLASSPATH</td> - <td>{{ctrl.jvmInfo.classpath}}</td> + <td>{{$ctrl.jvmInfo.classpath}}</td> </tr> </tbody> </table> @@ -110,7 +110,7 @@ </tr> </thead> <tbody class="break-word-wrap"> - <tr ng-repeat="env in ctrl.jvmInfo.environment"> + <tr ng-repeat="env in $ctrl.jvmInfo.environment"> <td>{{env.key}}</td> <td>{{env.value}}</td> </tr> @@ -122,13 +122,13 @@ </div> </div> - <btn ng-show="ctrl.jvmInfo.isAlive" class="btn btn-default" ng-click="ctrl.killVm()" translate>jvmInfo.killVm.BUTTON_LABEL</btn> + <btn ng-show="$ctrl.jvmInfo.isAlive" class="btn btn-default" ng-click="$ctrl.killVm()" translate>jvmInfo.killVm.BUTTON_LABEL</btn> <div class="row"> <div class="col-xs-12 col-md-3"> <label for="metricCombo" class="label label-primary" translate>jvmInfo.subview.LABEL</label> - <select name="metricCombo" class="combobox form-control" ng-model="comboValue"> + <select name="metricCombo" class="combobox form-control" ng-model="$ctrl.subView"> <option value="" style="display:none" selected="selected" disabled translate>jvmInfo.subview.DISABLED</option> <option value="" translate>jvmInfo.subview.NONE</option> <option value="jvmMemory" translate>jvmInfo.subview.MEMORY</option>
--- a/src/app/components/jvm-info/jvm-info.module.js Thu Sep 07 08:06:46 2017 -0400 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,38 +0,0 @@ -/** - * Copyright 2012-2017 Red Hat, Inc. - * - * Thermostat is distributed under the GNU General Public License, - * version 2 or any later version (with a special exception described - * below, commonly known as the "Classpath Exception"). - * - * A copy of GNU General Public License (GPL) is included in this - * distribution, in the file COPYING. - * - * Linking Thermostat code with other modules is making a combined work - * based on Thermostat. Thus, the terms and conditions of the GPL - * cover the whole combination. - * - * As a special exception, the copyright holders of Thermostat give you - * permission to link this code with independent modules to produce an - * executable, regardless of the license terms of these independent - * modules, and to copy and distribute the resulting executable under - * terms of your choice, provided that you also meet, for each linked - * independent module, the terms and conditions of the license of that - * module. An independent module is a module which is not derived from - * or based on Thermostat code. If you modify Thermostat, you may - * extend this exception to your version of the software, but you are - * not obligated to do so. If you do not wish to do so, delete this - * exception statement from your version. - */ - -import JvmInfoController from './jvm-info.controller.js'; -import jvmInfoService from './jvm-info.service.js'; -import killVmService from './kill-vm.service.js'; - -export default angular - .module('jvmInfo', [ - JvmInfoController, - jvmInfoService, - killVmService - ]) - .name;
--- a/src/app/components/jvm-info/jvm-info.routing.js Thu Sep 07 08:06:46 2017 -0400 +++ b/src/app/components/jvm-info/jvm-info.routing.js Thu Sep 07 08:10:36 2017 -0400 @@ -33,27 +33,18 @@ $stateProvider.state('jvmInfo', { url: '/jvm-info/{systemId}/{jvmId}', - templateProvider: $q => { - 'ngInject'; - return $q(resolve => - require.ensure([], () => resolve(require('./jvm-info.html')) - ) - ); - }, - controller: 'JvmInfoController as ctrl', + component: 'jvmInfo', resolve: { - loadJvmInfo: ($q, $ocLazyLoad) => { + lazyLoad: ($q, $ocLazyLoad) => { 'ngInject'; return $q(resolve => { - require.ensure(['./jvm-info.module.js'], () => { - let module = require('./jvm-info.module.js'); + require.ensure(['./jvm-info.component.js'], () => { + let module = require('./jvm-info.component.js'); $ocLazyLoad.load({ name: module.default }); resolve(module); }); }); - }, - systemId: $stateParams => $stateParams.systemId, - jvmId: $stateParams => $stateParams.jvmId + } } }); }
--- a/src/app/components/jvm-info/jvm-info.routing.spec.js Thu Sep 07 08:06:46 2017 -0400 +++ b/src/app/components/jvm-info/jvm-info.routing.spec.js Thu Sep 07 08:10:36 2017 -0400 @@ -55,24 +55,8 @@ args[1].url.should.equal('/jvm-info/{systemId}/{jvmId}'); }); - it('template provider should return jvm-info.html', done => { - let providerFn = args[1].templateProvider[1]; - providerFn.should.be.a.Function(); - providerFn(q); - q.should.be.calledOnce(); - - let deferred = q.args[0][0]; - deferred.should.be.a.Function(); - - let resolve = sinon.stub().callsFake(val => { - val.should.equal(require('./jvm-info.html')); - done(); - }); - deferred(resolve); - }); - - it('resolve should load jvm-info module', done => { - let resolveFn = args[1].resolve.loadJvmInfo[2]; + it('resolve should load jvm-info component', done => { + let resolveFn = args[1].resolve.lazyLoad[2]; resolveFn.should.be.a.Function(); resolveFn(q, ocLazyLoad); q.should.be.calledOnce(); @@ -81,7 +65,7 @@ deferred.should.be.a.Function(); let resolve = sinon.stub().callsFake(val => { - let mod = require('./jvm-info.module.js'); + let mod = require('./jvm-info.component.js'); ocLazyLoad.load.should.be.calledWith({ name: mod.default }); val.should.equal(mod); done(); @@ -90,25 +74,5 @@ }); }); - it('should resolve systemId state parameter', () => { - let resolveFn = args[1].resolve.systemId[1]; - should.exist(resolveFn); - resolveFn.should.be.a.Function(); - - let expected = 'bar-systemId'; - let res = resolveFn({ systemId: expected}); - res.should.equal(expected); - }); - - it('should resolve jvmId state parameter', () => { - let resolveFn = args[1].resolve.jvmId[1]; - should.exist(resolveFn); - resolveFn.should.be.a.Function(); - - let expected = 'foo-jvmId'; - let res = resolveFn({ jvmId: expected}); - res.should.equal(expected); - }); - });