diff --git a/.circleci/config.yml b/.circleci/config.yml index 03d7a106e..dbe98e788 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -497,7 +497,6 @@ jobs: environment: EMBER_TEST_PARALLEL: true #enables test parallelization with ember-exam EMBER_TEST_REPORT: test-results/report.xml #outputs test report for CircleCI test summary - parallelism: 4 steps: - checkout - restore_cache: @@ -506,7 +505,7 @@ jobs: at: ui-v2 - run: working_directory: ui-v2 - command: node_modules/ember-cli/bin/ember exam --split=$CIRCLE_NODE_TOTAL --partition=`expr $CIRCLE_NODE_INDEX + 1` --path dist --silent -r xunit + command: make test-ci - store_test_results: path: ui-v2/test-results diff --git a/ui-v2/GNUmakefile b/ui-v2/GNUmakefile index fdc401c95..ed8b59f1d 100644 --- a/ui-v2/GNUmakefile +++ b/ui-v2/GNUmakefile @@ -38,6 +38,9 @@ start-api: deps test: deps test-node yarn run test +test-ci: deps test-node + yarn run test:ci + test-view: deps test-node yarn run test:view diff --git a/ui-v2/app/adapters/kv.js b/ui-v2/app/adapters/kv.js index 4f9efae39..46ac36ae3 100644 --- a/ui-v2/app/adapters/kv.js +++ b/ui-v2/app/adapters/kv.js @@ -53,6 +53,7 @@ export default Adapter.extend({ requestForUpdateRecord: function(request, serialized, data) { const params = { ...this.formatDatacenter(data[DATACENTER_KEY]), + flags: data.Flags, ...this.formatNspace(data[NSPACE_KEY]), }; return request` diff --git a/ui-v2/app/components/aria-menu.js b/ui-v2/app/components/aria-menu.js index 50f63afa4..2c1daff70 100644 --- a/ui-v2/app/components/aria-menu.js +++ b/ui-v2/app/components/aria-menu.js @@ -39,6 +39,7 @@ const MENU_ITEMS = '[role^="menuitem"]'; export default Component.extend({ tagName: '', dom: service('dom'), + router: service('router'), guid: '', expanded: false, orientation: 'vertical', @@ -47,6 +48,7 @@ export default Component.extend({ this._super(...arguments); set(this, 'guid', this.dom.guid(this)); this._listeners = this.dom.listeners(); + this._routelisteners = this.dom.listeners(); }, didInsertElement: function() { // TODO: How do you detect whether the children have changed? @@ -54,10 +56,14 @@ export default Component.extend({ this.$menu = this.dom.element(`#${COMPONENT_ID}menu-${this.guid}`); const labelledBy = this.$menu.getAttribute('aria-labelledby'); this.$trigger = this.dom.element(`#${labelledBy}`); + this._routelisteners.add(this.router, { + routeWillChange: () => this.actions.close.apply(this, [{}]), + }); }, willDestroyElement: function() { this._super(...arguments); this._listeners.remove(); + this._routelisteners.remove(); }, actions: { keypressClick: function(e) { diff --git a/ui-v2/app/components/discovery-chain.js b/ui-v2/app/components/discovery-chain.js index fabd6e85e..c708ffa27 100644 --- a/ui-v2/app/components/discovery-chain.js +++ b/ui-v2/app/components/discovery-chain.js @@ -31,11 +31,13 @@ export default Component.extend({ this._super(...arguments); this._viewportlistener.add( this.dom.isInViewport(this.element, bool => { - set(this, 'isDisplayed', bool); - if (this.isDisplayed) { - this.addPathListeners(); - } else { - this.ticker.destroy(this); + if (get(this, 'isDisplayed') !== bool) { + set(this, 'isDisplayed', bool); + if (this.isDisplayed) { + this.addPathListeners(); + } else { + this.ticker.destroy(this); + } } }) ); @@ -63,24 +65,29 @@ export default Component.extend({ !routes.find(item => get(item, 'Definition.Match.HTTP.PathPrefix') === '/') && !routes.find(item => typeof item.Definition === 'undefined') ) { - let nextNode = `resolver:${this.chain.ServiceName}.${this.chain.Namespace}.${this.chain.Datacenter}`; - const splitterID = `splitter:${this.chain.ServiceName}`; - if (typeof this.chain.Nodes[splitterID] !== 'undefined') { + let nextNode; + const resolverID = `resolver:${this.chain.ServiceName}.${this.chain.Namespace}.${this.chain.Datacenter}`; + const splitterID = `splitter:${this.chain.ServiceName}.${this.chain.Namespace}`; + if (typeof this.chain.Nodes[resolverID] !== 'undefined') { + nextNode = resolverID; + } else if (typeof this.chain.Nodes[splitterID] !== 'undefined') { nextNode = splitterID; } - routes.push({ - Default: true, - ID: `route:${this.chain.ServiceName}`, - Name: this.chain.ServiceName, - Definition: { - Match: { - HTTP: { - PathPrefix: '/', + if (typeof nextNode !== 'undefined') { + routes.push({ + Default: true, + ID: `route:${this.chain.ServiceName}`, + Name: this.chain.ServiceName, + Definition: { + Match: { + HTTP: { + PathPrefix: '/', + }, }, }, - }, - NextNode: nextNode, - }); + NextNode: nextNode, + }); + } } return routes; }), @@ -92,23 +99,17 @@ export default Component.extend({ get(this, 'chain.Nodes') ); }), - graph: computed('chain.Nodes', function() { + graph: computed('splitters', 'routes', function() { const graph = this.dataStructs.graph(); const router = this.chain.ServiceName; - Object.entries(get(this, 'chain.Nodes')).forEach(([key, item]) => { - switch (item.Type) { - case 'splitter': - item.Splits.forEach(splitter => { - graph.addLink(item.ID, splitter.NextNode); - }); - break; - case 'router': - item.Routes.forEach((route, i) => { - route = createRoute(route, router, this.dom.guid); - graph.addLink(route.ID, route.NextNode); - }); - break; - } + this.splitters.forEach(item => { + item.Splits.forEach(splitter => { + graph.addLink(item.ID, splitter.NextNode); + }); + }); + this.routes.forEach((route, i) => { + route = createRoute(route, router, this.dom.guid); + graph.addLink(route.ID, route.NextNode); }); return graph; }), diff --git a/ui-v2/app/components/route-card.js b/ui-v2/app/components/route-card.js index ce9b3547d..7ca2db8b2 100644 --- a/ui-v2/app/components/route-card.js +++ b/ui-v2/app/components/route-card.js @@ -4,12 +4,6 @@ import { get, computed } from '@ember/object'; export default Component.extend({ tagName: '', path: computed('item', function() { - if (get(this, 'item.Default')) { - return { - type: 'Default', - value: '/', - }; - } return Object.entries(get(this, 'item.Definition.Match.HTTP') || {}).reduce( function(prev, [key, value]) { if (key.toLowerCase().startsWith('path')) { diff --git a/ui-v2/app/routes/dc/services/show.js b/ui-v2/app/routes/dc/services/show.js index 4df3f4bbd..d992a2a22 100644 --- a/ui-v2/app/routes/dc/services/show.js +++ b/ui-v2/app/routes/dc/services/show.js @@ -1,6 +1,7 @@ import Route from '@ember/routing/route'; import { inject as service } from '@ember/service'; import { hash } from 'rsvp'; +import { get } from '@ember/object'; export default Route.extend({ repo: service('repository/service'), @@ -17,9 +18,15 @@ export default Route.extend({ const nspace = this.modelFor('nspace').nspace.substr(1); return hash({ item: this.repo.findBySlug(params.name, dc, nspace), - chain: this.chainRepo.findBySlug(params.name, dc, nspace), urls: this.settings.findBySlug('urls'), dc: dc, + }).then(model => { + return hash({ + chain: ['connect-proxy', 'mesh-gateway'].includes(get(model, 'item.Service.Kind')) + ? null + : this.chainRepo.findBySlug(params.name, dc, nspace), + ...model, + }); }); }, setupController: function(controller, model) { diff --git a/ui-v2/app/search/filters/node.js b/ui-v2/app/search/filters/node.js index 6ac9c302f..82a209d21 100644 --- a/ui-v2/app/search/filters/node.js +++ b/ui-v2/app/search/filters/node.js @@ -4,6 +4,9 @@ export default function(filterable) { const sLower = s.toLowerCase(); return ( get(item, 'Node') + .toLowerCase() + .indexOf(sLower) !== -1 || + get(item, 'Address') .toLowerCase() .indexOf(sLower) !== -1 ); diff --git a/ui-v2/app/styles/base/components/menu-panel/layout.scss b/ui-v2/app/styles/base/components/menu-panel/layout.scss index 92f847df4..44823cd12 100644 --- a/ui-v2/app/styles/base/components/menu-panel/layout.scss +++ b/ui-v2/app/styles/base/components/menu-panel/layout.scss @@ -65,8 +65,13 @@ padding: 10px; padding-left: 36px; } +/* here the !important is only needed for what seems to be a difference */ +/* with the CSS before and after compression */ +/* i.e. before compression this style is applied */ +/* after compression it is in the source but doesn't seem to get */ +/* applied (unless you add the !important) */ %menu-panel .is-active { - position: relative; + position: relative !important; } %menu-panel .is-active > *::after { position: absolute; diff --git a/ui-v2/app/templates/components/catalog-filter.hbs b/ui-v2/app/templates/components/catalog-filter.hbs index ddcd20b13..d8484e89c 100644 --- a/ui-v2/app/templates/components/catalog-filter.hbs +++ b/ui-v2/app/templates/components/catalog-filter.hbs @@ -1,5 +1,5 @@ {{!
Keep catalog info up-to-date without refreshing the page. Any changes made to services, nodes and intentions would be reflected in real time.