From 885a59295b45fc3e00123e18dbedd8ea5ee24316 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 09:08:31 -0500 Subject: [PATCH 01/25] Remove running client-side search tests for now MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit I’ll delete these later after I’ve replaced them. --- ui/tests/acceptance/search-test.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 10d9f7aa6fb..632d1f1df82 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -1,5 +1,5 @@ /* eslint-disable ember-a11y-testing/a11y-audit-called */ // TODO -import { module, test } from 'qunit'; +import { module, skip, test } from 'qunit'; import { currentURL, triggerEvent, visit } from '@ember/test-helpers'; import { setupApplicationTest } from 'ember-qunit'; import { setupMirage } from 'ember-cli-mirage/test-support'; @@ -18,7 +18,7 @@ module('Acceptance | search', function(hooks) { setupApplicationTest(hooks); setupMirage(hooks); - test('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { + skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { server.create('node', { name: 'xyz' }); const otherNode = server.create('node', { name: 'ghi' }); @@ -103,7 +103,7 @@ module('Acceptance | search', function(hooks) { clock.restore(); }); - test('search highlights matching substrings', async function(assert) { + skip('search highlights matching substrings', async function(assert) { server.create('node', { name: 'xyz' }); server.create('job', { id: 'traefik', namespaceId: 'default' }); @@ -142,7 +142,7 @@ module('Acceptance | search', function(hooks) { }); }); - test('results are truncated at 10 per group', async function(assert) { + skip('results are truncated at 10 per group', async function(assert) { server.create('node', { name: 'xyz' }); for (let i = 0; i < 15; i++) { @@ -161,7 +161,7 @@ module('Acceptance | search', function(hooks) { }); }); - test('node id prefix matches take priority over node name matches', async function(assert) { + skip('node id prefix matches take priority over node name matches', async function(assert) { const nodeToMatchById = server.create('node', { name: 'xyz' }); const idPrefix = nodeToMatchById.id.substr(0, 5); From 601d1a66c01d689afcb38098101b922d5b018fa2 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 09:38:23 -0500 Subject: [PATCH 02/25] Add preliminary fuzzy search --- ui/app/components/global-search/control.js | 28 +++++++++++++++++++ .../components/global-search/control.hbs | 2 +- ui/mirage/config.js | 18 ++++++++++++ ui/tests/acceptance/search-test.js | 23 +++++++++++++++ 4 files changed, 70 insertions(+), 1 deletion(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index a72f2ef1c31..d9c9c5c506b 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -16,6 +16,7 @@ export default class GlobalSearchControl extends Component { @service dataCaches; @service router; @service store; + @service token; searchString = null; @@ -86,6 +87,33 @@ export default class GlobalSearchControl extends Component { console.log('exception searching', e); } }) + searchOld; + + @task(function*(string) { + const searchResponse = yield this.token.authorizedRequest('/v1/search/fuzzy', { + method: 'POST', + body: JSON.stringify({ + Text: string, + Context: 'all', + }), + }); + + const results = yield searchResponse.json(); + + const jobResults = results.Matches.jobs || []; + const nodeResults = results.Matches.nodes || []; + + return [ + { + groupName: resultsGroupLabel('Jobs', jobResults, [] /* FIXME */), + options: jobResults, + }, + { + groupName: resultsGroupLabel('Clients', nodeResults, [] /* FIXME */), + options: nodeResults, + }, + ]; + }) search; @action diff --git a/ui/app/templates/components/global-search/control.hbs b/ui/app/templates/components/global-search/control.hbs index 4c1226b4729..950b881dedd 100644 --- a/ui/app/templates/components/global-search/control.hbs +++ b/ui/app/templates/components/global-search/control.hbs @@ -12,5 +12,5 @@ @triggerComponent="global-search/trigger" @registerAPI={{action 'storeSelect'}} as |option|> - + {{option.ID}} diff --git a/ui/mirage/config.js b/ui/mirage/config.js index f739a353b69..d8646177f6e 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,6 +568,24 @@ export default function() { }); }); + this.post('/search/fuzzy', function( { jobs }, { requestBody }) { + const { Text } = JSON.parse(requestBody); + + const matchedJobs = jobs.where(job => job.name.includes(Text)); + + return { + Matches: { + jobs: matchedJobs.models.map(job => ({ + ID: job.name, + Scope: [ + job.id, + job.namespace, + ] + })) + } + } + }); + this.get('/recommendations', function( { jobs, namespaces, recommendations }, { queryParams: { job: id, namespace } } diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 632d1f1df82..2c8b67de9dd 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -18,6 +18,29 @@ module('Acceptance | search', function(hooks) { setupApplicationTest(hooks); setupMirage(hooks); + test('search exposes results from the fuzzy search endpoint', async function(assert) { + server.create('node'); + + server.create('job', { id: 'vwxyz', namespaceId: 'default' }); + server.create('job', { id: 'xyz', name: 'xyz job', namespace: 'default' }); + server.create('job', { id: 'abc', namespace: 'default' }); + + await visit('/'); + + await selectSearch(Layout.navbar.search.scope, 'xy'); + + Layout.navbar.search.as(search => { + assert.equal(search.groups.length, 2); + + search.groups[0].as(jobs => { + assert.equal(jobs.name, 'Jobs (2)'); + assert.equal(jobs.options.length, 2); + assert.equal(jobs.options[0].text, 'vwxyz'); + assert.equal(jobs.options[1].text, 'xyz job'); + }); + }); + }); + skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { server.create('node', { name: 'xyz' }); const otherNode = server.create('node', { name: 'ghi' }); From 555ba2dbfd47186d46f07118fbba03595354126f Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 09:46:47 -0500 Subject: [PATCH 03/25] Add placeholder for ignoring one-character search --- ui/tests/acceptance/search-test.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 2c8b67de9dd..f23b5987052 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -41,6 +41,8 @@ module('Acceptance | search', function(hooks) { }); }); + skip('search only triggers after two characters have been entered'); + skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { server.create('node', { name: 'xyz' }); const otherNode = server.create('node', { name: 'ghi' }); From 4501e44432dcf326ff32e27dfdb2115117c285f4 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 09:52:50 -0500 Subject: [PATCH 04/25] Add navigation to jobs --- ui/app/components/global-search/control.js | 12 +++--------- ui/mirage/config.js | 2 +- ui/tests/acceptance/search-test.js | 9 ++++++--- 3 files changed, 10 insertions(+), 13 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index d9c9c5c506b..c6dc62f71be 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -125,15 +125,9 @@ export default class GlobalSearchControl extends Component { @action selectOption(model) { - const itemModelName = model.constructor.modelName; - - if (itemModelName === 'job') { - this.router.transitionTo('jobs.job', model.plainId, { - queryParams: { namespace: model.get('namespace.name') }, - }); - } else if (itemModelName === 'node') { - this.router.transitionTo('clients.client', model.id); - } + this.router.transitionTo('jobs.job', model.Scope[1], { + queryParams: { namespace: model.Scope[0] }, + }); } @action diff --git a/ui/mirage/config.js b/ui/mirage/config.js index d8646177f6e..972bb0d7ec8 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -578,8 +578,8 @@ export default function() { jobs: matchedJobs.models.map(job => ({ ID: job.name, Scope: [ - job.id, job.namespace, + job.id, ] })) } diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index f23b5987052..e98296d7fcd 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -18,12 +18,12 @@ module('Acceptance | search', function(hooks) { setupApplicationTest(hooks); setupMirage(hooks); - test('search exposes results from the fuzzy search endpoint', async function(assert) { + test('search exposes and navigates to results from the fuzzy search endpoint', async function(assert) { server.create('node'); server.create('job', { id: 'vwxyz', namespaceId: 'default' }); - server.create('job', { id: 'xyz', name: 'xyz job', namespace: 'default' }); - server.create('job', { id: 'abc', namespace: 'default' }); + server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default' }); + server.create('job', { id: 'abc', namespaceId: 'default' }); await visit('/'); @@ -39,6 +39,9 @@ module('Acceptance | search', function(hooks) { assert.equal(jobs.options[1].text, 'xyz job'); }); }); + + await Layout.navbar.search.groups[0].options[1].click(); + assert.equal(currentURL(), '/jobs/xyz'); }); skip('search only triggers after two characters have been entered'); From 7d5fdf2879b3e27c8ee5ff2edce451b1a4f011c0 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 10:12:37 -0500 Subject: [PATCH 05/25] Add handling for node results --- ui/app/components/global-search/control.js | 13 ++++++++++--- ui/mirage/config.js | 9 ++++++++- ui/tests/acceptance/search-test.js | 14 +++++++++++++- 3 files changed, 31 insertions(+), 5 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index c6dc62f71be..9462a0af86e 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -103,6 +103,9 @@ export default class GlobalSearchControl extends Component { const jobResults = results.Matches.jobs || []; const nodeResults = results.Matches.nodes || []; + jobResults.forEach(job => job.type = 'job'); + nodeResults.forEach(node => node.type = 'node'); + return [ { groupName: resultsGroupLabel('Jobs', jobResults, [] /* FIXME */), @@ -125,9 +128,13 @@ export default class GlobalSearchControl extends Component { @action selectOption(model) { - this.router.transitionTo('jobs.job', model.Scope[1], { - queryParams: { namespace: model.Scope[0] }, - }); + if (model.type === 'job') { + this.router.transitionTo('jobs.job', model.Scope[1], { + queryParams: { namespace: model.Scope[0] }, + }); + } else if (model.type === 'node') { + this.router.transitionTo('clients.client', model.Scope[0]); + } } @action diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 972bb0d7ec8..5980662ccd8 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,10 +568,11 @@ export default function() { }); }); - this.post('/search/fuzzy', function( { jobs }, { requestBody }) { + this.post('/search/fuzzy', function( { jobs, nodes }, { requestBody }) { const { Text } = JSON.parse(requestBody); const matchedJobs = jobs.where(job => job.name.includes(Text)); + const matchedNodes = nodes.where(node => node.name.includes(Text)); return { Matches: { @@ -581,6 +582,12 @@ export default function() { job.namespace, job.id, ] + })), + nodes: matchedNodes.models.map(node => ({ + ID: node.name, + Scope: [ + node.id, + ], })) } } diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index e98296d7fcd..313e56fe233 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -19,7 +19,8 @@ module('Acceptance | search', function(hooks) { setupMirage(hooks); test('search exposes and navigates to results from the fuzzy search endpoint', async function(assert) { - server.create('node'); + server.create('node', { name: 'xyz' }); + const otherNode = server.create('node', { name: 'ghi' }); server.create('job', { id: 'vwxyz', namespaceId: 'default' }); server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default' }); @@ -38,10 +39,21 @@ module('Acceptance | search', function(hooks) { assert.equal(jobs.options[0].text, 'vwxyz'); assert.equal(jobs.options[1].text, 'xyz job'); }); + + search.groups[1].as(clients => { + assert.equal(clients.name, 'Clients (1)'); + assert.equal(clients.options.length, 1); + assert.equal(clients.options[0].text, 'xyz'); + }); }); await Layout.navbar.search.groups[0].options[1].click(); assert.equal(currentURL(), '/jobs/xyz'); + + await selectSearch(Layout.navbar.search.scope, otherNode.name); + + await Layout.navbar.search.groups[1].options[0].click(); + assert.equal(currentURL(), `/clients/${otherNode.id}`); }); skip('search only triggers after two characters have been entered'); From 5beff76d616092a6c30badbe2ac73f9e04cf0846 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 10:25:47 -0500 Subject: [PATCH 06/25] Add minimum search string length filter --- ui/app/components/global-search/control.js | 5 +++++ ui/app/templates/components/global-search/control.hbs | 1 + ui/tests/acceptance/search-test.js | 9 ++++++++- ui/tests/pages/layout.js | 6 ++++++ 4 files changed, 20 insertions(+), 1 deletion(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 9462a0af86e..67d95c604ec 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -126,6 +126,11 @@ export default class GlobalSearchControl extends Component { } } + @action + ensureMinimumLength(string) { + return string.length > 1; + } + @action selectOption(model) { if (model.type === 'job') { diff --git a/ui/app/templates/components/global-search/control.hbs b/ui/app/templates/components/global-search/control.hbs index 950b881dedd..b7f8aa0ccd4 100644 --- a/ui/app/templates/components/global-search/control.hbs +++ b/ui/app/templates/components/global-search/control.hbs @@ -3,6 +3,7 @@ data-test-search @searchEnabled={{true}} @search={{perform this.search}} + @onInput={{action 'ensureMinimumLength'}} @onChange={{action 'selectOption'}} @onFocus={{action 'openOnClickOrTab'}} @onClose={{action 'onCloseEvent'}} diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 313e56fe233..3f4d76a3ca7 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -56,7 +56,14 @@ module('Acceptance | search', function(hooks) { assert.equal(currentURL(), `/clients/${otherNode.id}`); }); - skip('search only triggers after two characters have been entered'); + test('search does not perform a request when only one character has been entered', async function(assert) { + await visit('/'); + + await selectSearch(Layout.navbar.search.scope, 'q'); + + assert.ok(Layout.navbar.search.noOptionsShown); + assert.notOk(server.pretender.handledRequests.findBy('url', '/v1/search/fuzzy')); + }); skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { server.create('node', { name: 'xyz' }); diff --git a/ui/tests/pages/layout.js b/ui/tests/pages/layout.js index cb1fcbbe8c2..432f949a8b3 100644 --- a/ui/tests/pages/layout.js +++ b/ui/tests/pages/layout.js @@ -4,6 +4,7 @@ import { clickable, collection, hasClass, + isHidden, isPresent, text, } from 'ember-cli-page-object'; @@ -55,6 +56,11 @@ export default create({ ), }), + noOptionsShown: isHidden('.ember-power-select-options', { + testContainer: '.ember-basic-dropdown-content', + resetScope: true, + }), + field: { scope: '.ember-power-select-search input', testContainer: 'html', From 8ce3cb3ef5bf78abcab3cddd0868de7fa228eb33 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 10:59:18 -0500 Subject: [PATCH 07/25] Add handling for task group results --- ui/app/components/global-search/control.js | 10 +++++++++ ui/mirage/config.js | 10 ++++++++- ui/tests/acceptance/search-test.js | 26 +++++++++++++++++----- 3 files changed, 40 insertions(+), 6 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 67d95c604ec..3d16726b9ac 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -102,9 +102,11 @@ export default class GlobalSearchControl extends Component { const jobResults = results.Matches.jobs || []; const nodeResults = results.Matches.nodes || []; + const groupResults = results.Matches.groups || []; jobResults.forEach(job => job.type = 'job'); nodeResults.forEach(node => node.type = 'node'); + groupResults.forEach(group => group.type = 'group'); return [ { @@ -115,6 +117,10 @@ export default class GlobalSearchControl extends Component { groupName: resultsGroupLabel('Clients', nodeResults, [] /* FIXME */), options: nodeResults, }, + { + groupName: resultsGroupLabel('Task Groups', groupResults, []), + options: groupResults, + }, ]; }) search; @@ -139,6 +145,10 @@ export default class GlobalSearchControl extends Component { }); } else if (model.type === 'node') { this.router.transitionTo('clients.client', model.Scope[0]); + } else if (model.type === 'group') { + this.router.transitionTo('jobs.job.task-group', model.Scope[1], model.ID, { + queryParams: { namespace: model.Scope[0] }, + }); } } diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 5980662ccd8..7728c827070 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,14 +568,22 @@ export default function() { }); }); - this.post('/search/fuzzy', function( { jobs, nodes }, { requestBody }) { + this.post('/search/fuzzy', function( { jobs, nodes, taskGroups }, { requestBody }) { const { Text } = JSON.parse(requestBody); + const matchedGroups = taskGroups.where(taskGroup => taskGroup.name.includes(Text)); const matchedJobs = jobs.where(job => job.name.includes(Text)); const matchedNodes = nodes.where(node => node.name.includes(Text)); return { Matches: { + groups: matchedGroups.models.map(group => ({ + ID: group.name, + Scope: [ + group.job.namespace, + group.job.id, + ], + })), jobs: matchedJobs.models.map(job => ({ ID: job.name, Scope: [ diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 3f4d76a3ca7..cf4f5b17a59 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -22,16 +22,22 @@ module('Acceptance | search', function(hooks) { server.create('node', { name: 'xyz' }); const otherNode = server.create('node', { name: 'ghi' }); - server.create('job', { id: 'vwxyz', namespaceId: 'default' }); - server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default' }); - server.create('job', { id: 'abc', namespaceId: 'default' }); + server.create('job', { id: 'vwxyz', namespaceId: 'default', groupsCount: 1 }); + server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default', groupsCount: 1 }); + server.create('job', { id: 'abc', namespaceId: 'default', groupsCount: 1 }); + + // Override random task group names to include job names to make results deterministic + server.schema.taskGroups.all().models.forEach(group => { + group.name = `${group.job.name}-group`; + group.save(); + }); await visit('/'); await selectSearch(Layout.navbar.search.scope, 'xy'); Layout.navbar.search.as(search => { - assert.equal(search.groups.length, 2); + assert.equal(search.groups.length, 3); search.groups[0].as(jobs => { assert.equal(jobs.name, 'Jobs (2)'); @@ -45,15 +51,25 @@ module('Acceptance | search', function(hooks) { assert.equal(clients.options.length, 1); assert.equal(clients.options[0].text, 'xyz'); }); + + search.groups[2].as(groups => { + assert.equal(groups.name, 'Task Groups (2)'); + assert.equal(groups.options.length, 2); + assert.equal(groups.options[0].text, 'vwxyz-group'); + assert.equal(groups.options[1].text, 'xyz job-group'); + }); }); await Layout.navbar.search.groups[0].options[1].click(); assert.equal(currentURL(), '/jobs/xyz'); await selectSearch(Layout.navbar.search.scope, otherNode.name); - await Layout.navbar.search.groups[1].options[0].click(); assert.equal(currentURL(), `/clients/${otherNode.id}`); + + await selectSearch(Layout.navbar.search.scope, 'xy'); + await Layout.navbar.search.groups[2].options[0].click(); + assert.equal(currentURL(), '/jobs/vwxyz/vwxyz-group'); }); test('search does not perform a request when only one character has been entered', async function(assert) { From 3dadcada8a30314f463fbc7cad3b95161b23a2c7 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 15:40:20 -0500 Subject: [PATCH 08/25] Add client-side truncation --- ui/app/components/global-search/control.js | 16 ++++++++++------ ui/tests/acceptance/search-test.js | 19 +++++++++++++++++++ 2 files changed, 29 insertions(+), 6 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 3d16726b9ac..1cfda79b625 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -100,9 +100,13 @@ export default class GlobalSearchControl extends Component { const results = yield searchResponse.json(); - const jobResults = results.Matches.jobs || []; - const nodeResults = results.Matches.nodes || []; - const groupResults = results.Matches.groups || []; + const allJobResults = results.Matches.jobs || []; + const allNodeResults = results.Matches.nodes || []; + const allGroupResults = results.Matches.groups || []; + + const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS); + const nodeResults = allNodeResults.slice(0, MAXIMUM_RESULTS); + const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS); jobResults.forEach(job => job.type = 'job'); nodeResults.forEach(node => node.type = 'node'); @@ -110,15 +114,15 @@ export default class GlobalSearchControl extends Component { return [ { - groupName: resultsGroupLabel('Jobs', jobResults, [] /* FIXME */), + groupName: resultsGroupLabel('Jobs', jobResults, allJobResults), options: jobResults, }, { - groupName: resultsGroupLabel('Clients', nodeResults, [] /* FIXME */), + groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults), options: nodeResults, }, { - groupName: resultsGroupLabel('Task Groups', groupResults, []), + groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults), options: groupResults, }, ]; diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index cf4f5b17a59..a9c8cd595d9 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -166,6 +166,25 @@ module('Acceptance | search', function(hooks) { clock.restore(); }); + test('results are truncated at 10 per group', async function(assert) { + server.create('node', { name: 'xyz' }); + + for (let i = 0; i < 11; i++) { + server.create('job', { id: `job-${i}`, namespaceId: 'default' }); + } + + await visit('/'); + + await selectSearch(Layout.navbar.search.scope, 'job'); + + Layout.navbar.search.as(search => { + search.groups[0].as(jobs => { + assert.equal(jobs.name, 'Jobs (showing 10 of 11)'); + assert.equal(jobs.options.length, 10); + }); + }); + }); + skip('search highlights matching substrings', async function(assert) { server.create('node', { name: 'xyz' }); From cf488fab0d1a0873ec62846bc933318197b4ca59 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Tue, 20 Apr 2021 15:51:05 -0500 Subject: [PATCH 09/25] Add indicator for server-side truncation --- ui/app/components/global-search/control.js | 14 ++++-- ui/mirage/config.js | 57 ++++++++++++++-------- ui/tests/acceptance/search-test.js | 18 +++++++ 3 files changed, 63 insertions(+), 26 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 1cfda79b625..e5441af40e4 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -112,17 +112,19 @@ export default class GlobalSearchControl extends Component { nodeResults.forEach(node => node.type = 'node'); groupResults.forEach(group => group.type = 'group'); + const truncations = results.Truncations; + return [ { - groupName: resultsGroupLabel('Jobs', jobResults, allJobResults), + groupName: resultsGroupLabel('Jobs', jobResults, allJobResults, truncations.jobs), options: jobResults, }, { - groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults), + groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults, truncations.nodes), options: nodeResults, }, { - groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults), + groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults, truncations.groups), options: groupResults, }, ]; @@ -252,7 +254,7 @@ class NodeIdSearch extends EmberObject.extend(Searchable) { regexEnabled = true; } -function resultsGroupLabel(type, renderedResults, allResults) { +function resultsGroupLabel(type, renderedResults, allResults, truncated) { let countString; if (renderedResults.length < allResults.length) { @@ -261,5 +263,7 @@ function resultsGroupLabel(type, renderedResults, allResults) { countString = renderedResults.length; } - return `${type} (${countString})`; + const truncationIndicator = truncated ? '+' : ''; + + return `${type} (${countString}${truncationIndicator})`; } diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 7728c827070..34edb93ba0f 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -575,29 +575,44 @@ export default function() { const matchedJobs = jobs.where(job => job.name.includes(Text)); const matchedNodes = nodes.where(node => node.name.includes(Text)); + const transformedGroups = matchedGroups.models.map(group => ({ + ID: group.name, + Scope: [ + group.job.namespace, + group.job.id, + ], + })); + + const transformedJobs = matchedJobs.models.map(job => ({ + ID: job.name, + Scope: [ + job.namespace, + job.id, + ] + })); + + const transformedNodes = matchedNodes.models.map(node => ({ + ID: node.name, + Scope: [ + node.id, + ], + })); + + const truncatedGroups = transformedGroups.slice(0, 20); + const truncatedJobs = transformedJobs.slice(0, 20); + const truncatedNodes = transformedNodes.slice(0, 20); + return { Matches: { - groups: matchedGroups.models.map(group => ({ - ID: group.name, - Scope: [ - group.job.namespace, - group.job.id, - ], - })), - jobs: matchedJobs.models.map(job => ({ - ID: job.name, - Scope: [ - job.namespace, - job.id, - ] - })), - nodes: matchedNodes.models.map(node => ({ - ID: node.name, - Scope: [ - node.id, - ], - })) - } + groups: truncatedGroups, + jobs: truncatedJobs, + nodes: truncatedNodes, + }, + Truncations: { + groups: truncatedGroups.length < transformedGroups.length, + jobs: truncatedJobs.length < transformedJobs.length, + nodes: truncatedNodes.length < transformedNodes.length, + }, } }); diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index a9c8cd595d9..341d172c752 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -185,6 +185,24 @@ module('Acceptance | search', function(hooks) { }); }); + test('server-side truncation is indicated in the group label', async function(assert) { + server.create('node', { name: 'xyz' }); + + for (let i = 0; i < 21; i++) { + server.create('job', { id: `job-${i}`, namespaceId: 'default' }); + } + + await visit('/'); + + await selectSearch(Layout.navbar.search.scope, 'job'); + + Layout.navbar.search.as(search => { + search.groups[0].as(jobs => { + assert.equal(jobs.name, 'Jobs (showing 10 of 20+)'); + }); + }); + }); + skip('search highlights matching substrings', async function(assert) { server.create('node', { name: 'xyz' }); From 28657737a177f0ac9455687555552979724adeac Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 10:14:36 -0500 Subject: [PATCH 10/25] Add fuzzy search feature detection --- ui/app/components/global-header.js | 1 + ui/app/routes/application.js | 5 +++++ ui/app/services/system.js | 18 ++++++++++++++++++ ui/app/templates/components/global-header.hbs | 8 +++++--- ui/tests/acceptance/search-test.js | 13 ++++++++++++- 5 files changed, 41 insertions(+), 4 deletions(-) diff --git a/ui/app/components/global-header.js b/ui/app/components/global-header.js index a1b13deb1a2..2e89fcb5518 100644 --- a/ui/app/components/global-header.js +++ b/ui/app/components/global-header.js @@ -5,6 +5,7 @@ import { inject as service } from '@ember/service'; @classic export default class GlobalHeader extends Component { @service config; + @service system; 'data-test-global-header' = true; onHamburgerClick() {} diff --git a/ui/app/routes/application.js b/ui/app/routes/application.js index a52f185c7fc..4059b6d924a 100644 --- a/ui/app/routes/application.js +++ b/ui/app/routes/application.js @@ -48,11 +48,16 @@ export default class ApplicationRoute extends Route { .perform() .catch(); + const checkFuzzySearchPresence = this.get('system.checkFuzzySearchPresence') + .perform() + .catch(); + const promises = await RSVP.all([ this.get('system.regions'), this.get('system.defaultRegion'), fetchLicense, fetchSelfTokenAndPolicies, + checkFuzzySearchPresence, ]); if (!this.get('system.shouldShowRegions')) return promises; diff --git a/ui/app/services/system.js b/ui/app/services/system.js index 0f526b57175..bdbc748956f 100644 --- a/ui/app/services/system.js +++ b/ui/app/services/system.js @@ -157,7 +157,25 @@ export default class SystemService extends Service { }) fetchLicense; + @task(function*() { + try { + const request = yield this.token.authorizedRequest('/v1/search/fuzzy', { + method: 'POST', + body: JSON.stringify({ + Text: 'PLACEHOLDERFIXME', + Context: 'jobs', + }), + }); + + return request.ok; + } catch (e) { + return false; + } + }) + checkFuzzySearchPresence; + @alias('fetchLicense.lastSuccessful.value') license; + @alias('checkFuzzySearchPresence.last.value') fuzzySearchEnabled; @computed('license.License.Features.[]') get features() { diff --git a/ui/app/templates/components/global-header.hbs b/ui/app/templates/components/global-header.hbs index 4beb56b39aa..2fd688ee6c1 100644 --- a/ui/app/templates/components/global-header.hbs +++ b/ui/app/templates/components/global-header.hbs @@ -7,9 +7,11 @@ - {{#unless (media "isMobile")}} - - {{/unless}} + {{#if this.system.fuzzySearchEnabled}} + {{#unless (media "isMobile")}} + + {{/unless}} + {{/if}}
{{#if this.config.APP.showStorybookLink}} Storybook diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 341d172c752..1387453f3cf 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -7,6 +7,7 @@ import Layout from 'nomad-ui/tests/pages/layout'; import JobsList from 'nomad-ui/tests/pages/jobs/list'; import { selectSearch } from 'ember-power-select/test-support'; import sinon from 'sinon'; +import Response from 'ember-cli-mirage/response'; import { COLLECTION_CACHE_DURATION } from 'nomad-ui/services/data-caches'; @@ -78,7 +79,17 @@ module('Acceptance | search', function(hooks) { await selectSearch(Layout.navbar.search.scope, 'q'); assert.ok(Layout.navbar.search.noOptionsShown); - assert.notOk(server.pretender.handledRequests.findBy('url', '/v1/search/fuzzy')); + assert.equal(server.pretender.handledRequests.filterBy('url', '/v1/search/fuzzy').length, 1, 'expect the feature detection query'); + }); + + test('when fuzzy search is disabled on the server, the search control is hidden', async function(assert) { + server.post('/search/fuzzy', function() { + return new Response(500, {}, ''); + }); + + await visit('/'); + + assert.ok(Layout.navbar.search.isHidden); }); skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { From 4a6b1a1e01d8c7ff71897dcb766ce7f82d6de722 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 14:09:16 -0500 Subject: [PATCH 11/25] Remove superseded search code --- ui/app/components/global-search/control.js | 105 +---------- ui/app/components/global-search/match.js | 54 ------ ui/app/services/data-caches.js | 33 ---- .../components/global-search-dropdown.scss | 4 - .../components/global-search/match.hbs | 5 - ui/tests/acceptance/search-test.js | 173 +----------------- ui/tests/pages/layout.js | 24 +-- 7 files changed, 3 insertions(+), 395 deletions(-) delete mode 100644 ui/app/components/global-search/match.js delete mode 100644 ui/app/services/data-caches.js delete mode 100644 ui/app/templates/components/global-search/match.hbs diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index e5441af40e4..8d47af85bdf 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -1,21 +1,16 @@ import Component from '@ember/component'; import { classNames } from '@ember-decorators/component'; import { task } from 'ember-concurrency'; -import EmberObject, { action, computed, set } from '@ember/object'; -import { alias } from '@ember/object/computed'; +import { action, set } from '@ember/object'; import { inject as service } from '@ember/service'; import { debounce, run } from '@ember/runloop'; -import Searchable from 'nomad-ui/mixins/searchable'; -import classic from 'ember-classic-decorator'; const SLASH_KEY = 191; const MAXIMUM_RESULTS = 10; @classNames('global-search-container') export default class GlobalSearchControl extends Component { - @service dataCaches; @service router; - @service store; @service token; searchString = null; @@ -23,18 +18,6 @@ export default class GlobalSearchControl extends Component { constructor() { super(...arguments); this['data-test-search-parent'] = true; - - this.jobSearch = JobSearch.create({ - dataSource: this, - }); - - this.nodeNameSearch = NodeNameSearch.create({ - dataSource: this, - }); - - this.nodeIdSearch = NodeIdSearch.create({ - dataSource: this, - }); } keyDownHandler(e) { @@ -57,38 +40,6 @@ export default class GlobalSearchControl extends Component { document.removeEventListener('keydown', this._keyDownHandler); } - @task(function*(string) { - try { - set(this, 'searchString', string); - - const jobs = yield this.dataCaches.fetch('job'); - const nodes = yield this.dataCaches.fetch('node'); - - set(this, 'jobs', jobs.toArray()); - set(this, 'nodes', nodes.toArray()); - - const jobResults = this.jobSearch.listSearched.slice(0, MAXIMUM_RESULTS); - - const mergedNodeListSearched = this.nodeIdSearch.listSearched.concat(this.nodeNameSearch.listSearched).uniq(); - const nodeResults = mergedNodeListSearched.slice(0, MAXIMUM_RESULTS); - - return [ - { - groupName: resultsGroupLabel('Jobs', jobResults, this.jobSearch.listSearched), - options: jobResults, - }, - { - groupName: resultsGroupLabel('Clients', nodeResults, mergedNodeListSearched), - options: nodeResults, - }, - ]; - } catch (e) { - // eslint-disable-next-line - console.log('exception searching', e); - } - }) - searchOld; - @task(function*(string) { const searchResponse = yield this.token.authorizedRequest('/v1/search/fuzzy', { method: 'POST', @@ -200,60 +151,6 @@ export default class GlobalSearchControl extends Component { } } -@classic -class JobSearch extends EmberObject.extend(Searchable) { - @computed - get searchProps() { - return ['id', 'name']; - } - - @computed - get fuzzySearchProps() { - return ['name']; - } - - @alias('dataSource.jobs') listToSearch; - @alias('dataSource.searchString') searchTerm; - - fuzzySearchEnabled = true; - includeFuzzySearchMatches = true; -} -@classic -class NodeNameSearch extends EmberObject.extend(Searchable) { - @computed - get searchProps() { - return ['name']; - } - - @computed - get fuzzySearchProps() { - return ['name']; - } - - @alias('dataSource.nodes') listToSearch; - @alias('dataSource.searchString') searchTerm; - - fuzzySearchEnabled = true; - includeFuzzySearchMatches = true; -} - -@classic -class NodeIdSearch extends EmberObject.extend(Searchable) { - @computed - get regexSearchProps() { - return ['id']; - } - - @alias('dataSource.nodes') listToSearch; - @computed('dataSource.searchString') - get searchTerm() { - return `^${this.get('dataSource.searchString')}`; - } - - exactMatchEnabled = false; - regexEnabled = true; -} - function resultsGroupLabel(type, renderedResults, allResults, truncated) { let countString; diff --git a/ui/app/components/global-search/match.js b/ui/app/components/global-search/match.js deleted file mode 100644 index 4360adeeda3..00000000000 --- a/ui/app/components/global-search/match.js +++ /dev/null @@ -1,54 +0,0 @@ -import Component from '@ember/component'; -import { tagName } from '@ember-decorators/component'; -import { computed, get } from '@ember/object'; -import { alias } from '@ember/object/computed'; - -@tagName('') -export default class GlobalSearchMatch extends Component { - @alias('match.fuzzySearchMatches.firstObject') firstMatch; - - @computed('match.name') - get label() { - return get(this, 'match.name') || ''; - } - - @computed('firstMatch.indices.[]', 'label.length') - get substrings() { - const indices = get(this, 'firstMatch.indices'); - const labelLength = this.label.length; - - if (indices) { - return indices.reduce((substrings, [startIndex, endIndex], indicesIndex) => { - if (indicesIndex === 0 && startIndex > 0) { - substrings.push({ - isHighlighted: false, - string: this.label.substring(0, startIndex) - }); - } - - substrings.push({ - isHighlighted: true, - string: this.label.substring(startIndex, endIndex + 1) - }); - - let endIndexOfNextUnhighlightedSubstring; - - if (indicesIndex === indices.length - 1) { - endIndexOfNextUnhighlightedSubstring = labelLength; - } else { - const nextIndices = indices[indicesIndex + 1]; - endIndexOfNextUnhighlightedSubstring = nextIndices[0]; - } - - substrings.push({ - isHighlighted: false, - string: this.label.substring(endIndex + 1, endIndexOfNextUnhighlightedSubstring) - }); - - return substrings; - }, []); - } else { - return null; - } - } -} diff --git a/ui/app/services/data-caches.js b/ui/app/services/data-caches.js deleted file mode 100644 index 7617c61c583..00000000000 --- a/ui/app/services/data-caches.js +++ /dev/null @@ -1,33 +0,0 @@ -import Service, { inject as service } from '@ember/service'; - -export const COLLECTION_CACHE_DURATION = 60000; // one minute - -export default class DataCachesService extends Service { - @service router; - @service store; - @service system; - - collectionLastFetched = {}; - - async fetch(modelName) { - const modelNameToRoute = { - job: 'jobs', - node: 'clients', - }; - - const route = modelNameToRoute[modelName]; - const lastFetched = this.collectionLastFetched[modelName]; - const now = Date.now(); - - if (this.router.isActive(route)) { - // TODO Incorrect because it’s constantly being fetched by watchers, shouldn’t be marked as last fetched only on search - this.collectionLastFetched[modelName] = now; - return this.store.peekAll(modelName); - } else if (lastFetched && now - lastFetched < COLLECTION_CACHE_DURATION) { - return this.store.peekAll(modelName); - } else { - this.collectionLastFetched[modelName] = now; - return this.store.findAll(modelName); - } - } -} diff --git a/ui/app/styles/components/global-search-dropdown.scss b/ui/app/styles/components/global-search-dropdown.scss index 27e5030020d..0a4d52972e2 100644 --- a/ui/app/styles/components/global-search-dropdown.scss +++ b/ui/app/styles/components/global-search-dropdown.scss @@ -42,10 +42,6 @@ background: transparentize($blue, 0.8); color: $blue; } - - .highlighted { - font-weight: $weight-semibold; - } } } diff --git a/ui/app/templates/components/global-search/match.hbs b/ui/app/templates/components/global-search/match.hbs deleted file mode 100644 index 97671e3033c..00000000000 --- a/ui/app/templates/components/global-search/match.hbs +++ /dev/null @@ -1,5 +0,0 @@ -{{#if this.substrings}} - {{#each this.substrings as |substring|}}{{substring.string}}{{/each}} -{{else}} - {{this.label}} -{{/if}} diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 1387453f3cf..207eb45737a 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -1,20 +1,13 @@ /* eslint-disable ember-a11y-testing/a11y-audit-called */ // TODO -import { module, skip, test } from 'qunit'; +import { module, test } from 'qunit'; import { currentURL, triggerEvent, visit } from '@ember/test-helpers'; import { setupApplicationTest } from 'ember-qunit'; import { setupMirage } from 'ember-cli-mirage/test-support'; import Layout from 'nomad-ui/tests/pages/layout'; import JobsList from 'nomad-ui/tests/pages/jobs/list'; import { selectSearch } from 'ember-power-select/test-support'; -import sinon from 'sinon'; import Response from 'ember-cli-mirage/response'; -import { COLLECTION_CACHE_DURATION } from 'nomad-ui/services/data-caches'; - -function getRequestCount(server, url) { - return server.pretender.handledRequests.filterBy('url', url).length; -} - module('Acceptance | search', function(hooks) { setupApplicationTest(hooks); setupMirage(hooks); @@ -92,91 +85,6 @@ module('Acceptance | search', function(hooks) { assert.ok(Layout.navbar.search.isHidden); }); - skip('search searches jobs and nodes with route- and time-based caching and navigates to chosen items', async function(assert) { - server.create('node', { name: 'xyz' }); - const otherNode = server.create('node', { name: 'ghi' }); - - server.create('job', { id: 'vwxyz', namespaceId: 'default' }); - server.create('job', { id: 'xyz', name: 'xyz job', namespace: 'default' }); - server.create('job', { id: 'abc', namespace: 'default' }); - - await visit('/'); - - const clock = sinon.useFakeTimers({ - now: new Date(), - shouldAdvanceTime: true, - }); - - let presearchJobsRequestCount = getRequestCount(server, '/v1/jobs'); - let presearchNodesRequestCount = getRequestCount(server, '/v1/nodes'); - - await selectSearch(Layout.navbar.search.scope, 'xy'); - - Layout.navbar.search.as(search => { - assert.equal(search.groups.length, 2); - - search.groups[0].as(jobs => { - assert.equal(jobs.name, 'Jobs (2)'); - assert.equal(jobs.options.length, 2); - assert.equal(jobs.options[0].text, 'xyz job'); - assert.equal(jobs.options[1].text, 'vwxyz'); - }); - - search.groups[1].as(clients => { - assert.equal(clients.name, 'Clients (1)'); - assert.equal(clients.options.length, 1); - assert.equal(clients.options[0].text, 'xyz'); - }); - }); - - assert.equal( - getRequestCount(server, '/v1/jobs'), - presearchJobsRequestCount, - 'no new jobs request should be sent when in the jobs hierarchy' - ); - assert.equal( - getRequestCount(server, '/v1/nodes'), - presearchNodesRequestCount + 1, - 'a nodes request should happen when not in the clients hierarchy' - ); - - await Layout.navbar.search.groups[0].options[0].click(); - assert.equal(currentURL(), '/jobs/xyz'); - - await selectSearch(Layout.navbar.search.scope, otherNode.id.substr(0, 3)); - - await Layout.navbar.search.groups[1].options[0].click(); - assert.equal(currentURL(), `/clients/${otherNode.id}`); - - presearchJobsRequestCount = getRequestCount(server, '/v1/jobs'); - presearchNodesRequestCount = getRequestCount(server, '/v1/nodes'); - - await selectSearch(Layout.navbar.search.scope, 'zzzzzzzzzzz'); - - assert.equal( - getRequestCount(server, '/v1/jobs'), - presearchJobsRequestCount, - 'a jobs request should not happen because the cache hasn’t expired' - ); - assert.equal( - presearchNodesRequestCount, - getRequestCount(server, '/v1/nodes'), - 'no new nodes request should happen when in the clients hierarchy' - ); - - clock.tick(COLLECTION_CACHE_DURATION * 2); - - await selectSearch(Layout.navbar.search.scope, otherNode.id.substr(0, 3)); - - assert.equal( - getRequestCount(server, '/v1/jobs'), - presearchJobsRequestCount + 1, - 'a jobs request should happen because the cache has expired' - ); - - clock.restore(); - }); - test('results are truncated at 10 per group', async function(assert) { server.create('node', { name: 'xyz' }); @@ -214,85 +122,6 @@ module('Acceptance | search', function(hooks) { }); }); - skip('search highlights matching substrings', async function(assert) { - server.create('node', { name: 'xyz' }); - - server.create('job', { id: 'traefik', namespaceId: 'default' }); - server.create('job', { id: 'tracking', namespace: 'default' }); - server.create('job', { id: 'smtp-sensor', namespaceId: 'default' }); - - await visit('/'); - - await selectSearch(Layout.navbar.search.scope, 'trae'); - - Layout.navbar.search.as(search => { - search.groups[0].as(jobs => { - assert.equal(jobs.options[0].text, 'traefik'); - assert.equal(jobs.options[0].formattedText, '*trae*fik'); - - assert.equal(jobs.options[1].text, 'tracking'); - assert.equal(jobs.options[1].formattedText, '*tra*cking'); - }); - }); - - await selectSearch(Layout.navbar.search.scope, 'ra'); - - Layout.navbar.search.as(search => { - search.groups[0].as(jobs => { - assert.equal(jobs.options[0].formattedText, 't*ra*efik'); - assert.equal(jobs.options[1].formattedText, 't*ra*cking'); - }); - }); - - await selectSearch(Layout.navbar.search.scope, 'sensor'); - - Layout.navbar.search.as(search => { - search.groups[0].as(jobs => { - assert.equal(jobs.options[0].formattedText, '*s*mtp-*sensor*'); - }); - }); - }); - - skip('results are truncated at 10 per group', async function(assert) { - server.create('node', { name: 'xyz' }); - - for (let i = 0; i < 15; i++) { - server.create('job', { id: `job-${i}`, namespaceId: 'default' }); - } - - await visit('/'); - - await selectSearch(Layout.navbar.search.scope, 'job'); - - Layout.navbar.search.as(search => { - search.groups[0].as(jobs => { - assert.equal(jobs.name, 'Jobs (showing 10 of 15)'); - assert.equal(jobs.options.length, 10); - }); - }); - }); - - skip('node id prefix matches take priority over node name matches', async function(assert) { - const nodeToMatchById = server.create('node', { name: 'xyz' }); - - const idPrefix = nodeToMatchById.id.substr(0, 5); - - const nodeToMatchByName = server.create('node', { - name: `node-name-with-id-piece-${idPrefix}`, - }); - - await visit('/'); - - await selectSearch(Layout.navbar.search.scope, idPrefix); - - Layout.navbar.search.as(search => { - search.groups[1].as(clients => { - assert.equal(clients.options[0].text, nodeToMatchById.name); - assert.equal(clients.options[1].text, nodeToMatchByName.name); - }); - }); - }); - test('clicking the search field starts search immediately', async function(assert) { await visit('/'); diff --git a/ui/tests/pages/layout.js b/ui/tests/pages/layout.js index 432f949a8b3..1a8c639e2dd 100644 --- a/ui/tests/pages/layout.js +++ b/ui/tests/pages/layout.js @@ -3,7 +3,6 @@ import { create, clickable, collection, - hasClass, isHidden, isPresent, text, @@ -32,28 +31,7 @@ export default create({ resetScope: true, name: text('.ember-power-select-group-name'), - options: collection( - '.ember-power-select-option', - create({ - label: text(), - - substrings: collection('[data-test-match-substring]', { - isHighlighted: hasClass('highlighted'), - }), - - get formattedText() { - return this.substrings - .map(string => { - if (string.isHighlighted) { - return `*${string.text}*`; - } else { - return string.text; - } - }) - .join(''); - }, - }) - ), + options: collection('.ember-power-select-option'), }), noOptionsShown: isHidden('.ember-power-select-options', { From c79952ee03748e846779ebb427a06404f3ebe178 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 15:10:13 -0500 Subject: [PATCH 12/25] Add handling for CSI plugins --- ui/app/components/global-search/control.js | 9 +++++++++ ui/mirage/config.js | 10 +++++++++- ui/tests/acceptance/search-test.js | 14 +++++++++++++- 3 files changed, 31 insertions(+), 2 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 8d47af85bdf..47ea66483ed 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -54,14 +54,17 @@ export default class GlobalSearchControl extends Component { const allJobResults = results.Matches.jobs || []; const allNodeResults = results.Matches.nodes || []; const allGroupResults = results.Matches.groups || []; + const allPluginResults = results.Matches.plugins || []; const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS); const nodeResults = allNodeResults.slice(0, MAXIMUM_RESULTS); const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS); + const pluginResults = allPluginResults.slice(0, MAXIMUM_RESULTS); jobResults.forEach(job => job.type = 'job'); nodeResults.forEach(node => node.type = 'node'); groupResults.forEach(group => group.type = 'group'); + pluginResults.forEach(plugin => plugin.type = 'plugin'); const truncations = results.Truncations; @@ -78,6 +81,10 @@ export default class GlobalSearchControl extends Component { groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults, truncations.groups), options: groupResults, }, + { + groupName: resultsGroupLabel('CSI Plugins', pluginResults, allPluginResults, truncations.plugins), + options: pluginResults, + } ]; }) search; @@ -106,6 +113,8 @@ export default class GlobalSearchControl extends Component { this.router.transitionTo('jobs.job.task-group', model.Scope[1], model.ID, { queryParams: { namespace: model.Scope[0] }, }); + } else if (model.type === 'plugin') { + this.router.transitionTo('csi.plugins.plugin', model.ID); } } diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 34edb93ba0f..2932fa2ad66 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,12 +568,13 @@ export default function() { }); }); - this.post('/search/fuzzy', function( { jobs, nodes, taskGroups }, { requestBody }) { + this.post('/search/fuzzy', function( { jobs, nodes, taskGroups, csiPlugins, csiVolumes }, { requestBody }) { const { Text } = JSON.parse(requestBody); const matchedGroups = taskGroups.where(taskGroup => taskGroup.name.includes(Text)); const matchedJobs = jobs.where(job => job.name.includes(Text)); const matchedNodes = nodes.where(node => node.name.includes(Text)); + const matchedPlugins = csiPlugins.where(plugin => plugin.id.includes(Text)); const transformedGroups = matchedGroups.models.map(group => ({ ID: group.name, @@ -598,20 +599,27 @@ export default function() { ], })); + const transformedPlugins = matchedPlugins.models.map(plugin => ({ + ID: plugin.id, + })); + const truncatedGroups = transformedGroups.slice(0, 20); const truncatedJobs = transformedJobs.slice(0, 20); const truncatedNodes = transformedNodes.slice(0, 20); + const truncatedPlugins = transformedPlugins.slice(0, 20); return { Matches: { groups: truncatedGroups, jobs: truncatedJobs, nodes: truncatedNodes, + plugins: truncatedPlugins, }, Truncations: { groups: truncatedGroups.length < transformedGroups.length, jobs: truncatedJobs.length < transformedJobs.length, nodes: truncatedNodes.length < transformedNodes.length, + plugins: truncatedPlugins.length < transformedPlugins.length, }, } }); diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 207eb45737a..5579893256e 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -26,12 +26,14 @@ module('Acceptance | search', function(hooks) { group.save(); }); + server.create('csi-plugin', { id: 'xyz-plugin', createVolumes: false }); + await visit('/'); await selectSearch(Layout.navbar.search.scope, 'xy'); Layout.navbar.search.as(search => { - assert.equal(search.groups.length, 3); + assert.equal(search.groups.length, 4); search.groups[0].as(jobs => { assert.equal(jobs.name, 'Jobs (2)'); @@ -52,6 +54,12 @@ module('Acceptance | search', function(hooks) { assert.equal(groups.options[0].text, 'vwxyz-group'); assert.equal(groups.options[1].text, 'xyz job-group'); }); + + search.groups[3].as(plugins => { + assert.equal(plugins.name, 'CSI Plugins (1)'); + assert.equal(plugins.options.length, 1); + assert.equal(plugins.options[0].text, 'xyz-plugin'); + }); }); await Layout.navbar.search.groups[0].options[1].click(); @@ -64,6 +72,10 @@ module('Acceptance | search', function(hooks) { await selectSearch(Layout.navbar.search.scope, 'xy'); await Layout.navbar.search.groups[2].options[0].click(); assert.equal(currentURL(), '/jobs/vwxyz/vwxyz-group'); + + await selectSearch(Layout.navbar.search.scope, 'xy'); + await Layout.navbar.search.groups[3].options[0].click(); + assert.equal(currentURL(), '/csi/plugins/xyz-plugin'); }); test('search does not perform a request when only one character has been entered', async function(assert) { From 85725f9b7288c732625abaaf08005e936ad703a3 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 15:50:48 -0500 Subject: [PATCH 13/25] Add filtering of detection POST from tests --- ui/tests/acceptance/allocation-detail-test.js | 2 +- ui/tests/acceptance/client-detail-test.js | 30 +++++++++++-------- 2 files changed, 18 insertions(+), 14 deletions(-) diff --git a/ui/tests/acceptance/allocation-detail-test.js b/ui/tests/acceptance/allocation-detail-test.js index af0d97292e1..0fa549395e1 100644 --- a/ui/tests/acceptance/allocation-detail-test.js +++ b/ui/tests/acceptance/allocation-detail-test.js @@ -274,7 +274,7 @@ module('Acceptance | allocation detail', function(hooks) { await Allocation.stop.confirm(); assert.equal( - server.pretender.handledRequests.findBy('method', 'POST').url, + server.pretender.handledRequests.reject(request => request.url.includes('fuzzy')).findBy('method', 'POST').url, `/v1/allocation/${allocation.id}/stop`, 'Stop request is made for the allocation' ); diff --git a/ui/tests/acceptance/client-detail-test.js b/ui/tests/acceptance/client-detail-test.js index 890a0398237..c5f9638655a 100644 --- a/ui/tests/acceptance/client-detail-test.js +++ b/ui/tests/acceptance/client-detail-test.js @@ -17,6 +17,10 @@ let clientToken; const wasPreemptedFilter = allocation => !!allocation.preemptedByAllocation; +function nonSearchPOSTS() { + return server.pretender.handledRequests.reject(request => request.url.includes('fuzzy')).filterBy('method', 'POST'); +} + module('Acceptance | client detail', function(hooks) { setupApplicationTest(hooks); setupMirage(hooks); @@ -576,7 +580,7 @@ module('Acceptance | client detail', function(hooks) { assert.ok(ClientDetail.eligibilityToggle.isActive); ClientDetail.eligibilityToggle.toggle(); - await waitUntil(() => server.pretender.handledRequests.findBy('method', 'POST')); + await waitUntil(() => nonSearchPOSTS()); assert.ok(ClientDetail.eligibilityToggle.isDisabled); server.pretender.resolve(server.pretender.requestReferences[0].request); @@ -586,7 +590,7 @@ module('Acceptance | client detail', function(hooks) { assert.notOk(ClientDetail.eligibilityToggle.isActive); assert.notOk(ClientDetail.eligibilityToggle.isDisabled); - const request = server.pretender.handledRequests.findBy('method', 'POST'); + const request = nonSearchPOSTS()[0]; assert.equal(request.url, `/v1/node/${node.id}/eligibility`); assert.deepEqual(JSON.parse(request.requestBody), { NodeID: node.id, @@ -594,11 +598,11 @@ module('Acceptance | client detail', function(hooks) { }); ClientDetail.eligibilityToggle.toggle(); - await waitUntil(() => server.pretender.handledRequests.filterBy('method', 'POST').length === 2); + await waitUntil(() => nonSearchPOSTS().length === 2); server.pretender.resolve(server.pretender.requestReferences[0].request); assert.ok(ClientDetail.eligibilityToggle.isActive); - const request2 = server.pretender.handledRequests.filterBy('method', 'POST')[1]; + const request2 = nonSearchPOSTS()[1]; assert.equal(request2.url, `/v1/node/${node.id}/eligibility`); assert.deepEqual(JSON.parse(request2.requestBody), { @@ -619,7 +623,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.toggle(); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.equal(request.url, `/v1/node/${node.id}/drain`); assert.deepEqual( @@ -638,7 +642,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.deadlineToggle.toggle(); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.deepEqual( JSON.parse(request.requestBody), @@ -657,7 +661,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.deadlineOptions.options[1].choose(); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.deepEqual( JSON.parse(request.requestBody), @@ -678,7 +682,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.setCustomDeadline('1h40m20s'); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.deepEqual( JSON.parse(request.requestBody), @@ -697,7 +701,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.forceDrainToggle.toggle(); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.deepEqual( JSON.parse(request.requestBody), @@ -715,7 +719,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.systemJobsToggle.toggle(); await ClientDetail.drainPopover.submit(); - request = server.pretender.handledRequests.filterBy('method', 'POST').pop(); + request = nonSearchPOSTS().pop(); assert.deepEqual( JSON.parse(request.requestBody), @@ -744,7 +748,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainPopover.cancel(); assert.notOk(ClientDetail.drainPopover.isOpen); - assert.equal(server.pretender.handledRequests.filterBy('method', 'POST'), 0); + assert.equal(nonSearchPOSTS(), 0); }); test('toggling eligibility is disabled while a drain is active', async function(assert) { @@ -769,7 +773,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.stopDrain.idle(); await ClientDetail.stopDrain.confirm(); - const request = server.pretender.handledRequests.findBy('method', 'POST'); + const request = nonSearchPOSTS()[0]; assert.equal(request.url, `/v1/node/${node.id}/drain`); assert.deepEqual(JSON.parse(request.requestBody), { NodeID: node.id, @@ -801,7 +805,7 @@ module('Acceptance | client detail', function(hooks) { await ClientDetail.drainDetails.force.idle(); await ClientDetail.drainDetails.force.confirm(); - const request = server.pretender.handledRequests.findBy('method', 'POST'); + const request = nonSearchPOSTS()[0]; assert.equal(request.url, `/v1/node/${node.id}/drain`); assert.deepEqual(JSON.parse(request.requestBody), { NodeID: node.id, From fd9d0498c17bd2c25f451f412b0daa8b92623fa6 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 15:54:15 -0500 Subject: [PATCH 14/25] Remove unused variable --- ui/mirage/config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 2932fa2ad66..4b9a8f02e9d 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,7 +568,7 @@ export default function() { }); }); - this.post('/search/fuzzy', function( { jobs, nodes, taskGroups, csiPlugins, csiVolumes }, { requestBody }) { + this.post('/search/fuzzy', function( { jobs, nodes, taskGroups, csiPlugins }, { requestBody }) { const { Text } = JSON.parse(requestBody); const matchedGroups = taskGroups.where(taskGroup => taskGroup.name.includes(Text)); From 9f92a22e32f1f0cd6a5087fa5118782b335d0ed0 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 21 Apr 2021 16:13:33 -0500 Subject: [PATCH 15/25] Add test ignoring for feature detection request --- ui/tests/acceptance/regions-test.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ui/tests/acceptance/regions-test.js b/ui/tests/acceptance/regions-test.js index d667bf30dd4..0e48903ff21 100644 --- a/ui/tests/acceptance/regions-test.js +++ b/ui/tests/acceptance/regions-test.js @@ -162,10 +162,12 @@ module('Acceptance | regions (many)', function(hooks) { await Layout.gutter.visitClients(); await Layout.gutter.visitServers(); const [ + , , , // License request // Token/policies request + // Search feature detection regionsRequest, defaultRegionRequest, ...appRequests From e3198a69a3d813152984d2203d46a10752607388 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 10:13:58 -0500 Subject: [PATCH 16/25] Add handling for allocation search results --- ui/app/components/global-search/control.js | 9 +++++ ui/mirage/config.js | 14 ++++++- ui/tests/acceptance/search-test.js | 44 ++++++++++++---------- 3 files changed, 47 insertions(+), 20 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 47ea66483ed..1a52b78994a 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -53,16 +53,19 @@ export default class GlobalSearchControl extends Component { const allJobResults = results.Matches.jobs || []; const allNodeResults = results.Matches.nodes || []; + const allAllocResults = results.Matches.allocs || []; const allGroupResults = results.Matches.groups || []; const allPluginResults = results.Matches.plugins || []; const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS); const nodeResults = allNodeResults.slice(0, MAXIMUM_RESULTS); + const allocResults = allAllocResults.slice(0, MAXIMUM_RESULTS); const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS); const pluginResults = allPluginResults.slice(0, MAXIMUM_RESULTS); jobResults.forEach(job => job.type = 'job'); nodeResults.forEach(node => node.type = 'node'); + allocResults.forEach(alloc => alloc.type = 'alloc'); groupResults.forEach(group => group.type = 'group'); pluginResults.forEach(plugin => plugin.type = 'plugin'); @@ -77,6 +80,10 @@ export default class GlobalSearchControl extends Component { groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults, truncations.nodes), options: nodeResults, }, + { + groupName: resultsGroupLabel('Allocations', allocResults, allAllocResults, truncations.allocs), + options: allocResults, + }, { groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults, truncations.groups), options: groupResults, @@ -115,6 +122,8 @@ export default class GlobalSearchControl extends Component { }); } else if (model.type === 'plugin') { this.router.transitionTo('csi.plugins.plugin', model.ID); + } else if (model.type === 'alloc') { + this.router.transitionTo('allocations.allocation', model.Scope[1]); } } diff --git a/ui/mirage/config.js b/ui/mirage/config.js index 4b9a8f02e9d..5df462325e5 100644 --- a/ui/mirage/config.js +++ b/ui/mirage/config.js @@ -568,14 +568,23 @@ export default function() { }); }); - this.post('/search/fuzzy', function( { jobs, nodes, taskGroups, csiPlugins }, { requestBody }) { + this.post('/search/fuzzy', function( { allocations, jobs, nodes, taskGroups, csiPlugins }, { requestBody }) { const { Text } = JSON.parse(requestBody); + const matchedAllocs = allocations.where(allocation => allocation.name.includes(Text)); const matchedGroups = taskGroups.where(taskGroup => taskGroup.name.includes(Text)); const matchedJobs = jobs.where(job => job.name.includes(Text)); const matchedNodes = nodes.where(node => node.name.includes(Text)); const matchedPlugins = csiPlugins.where(plugin => plugin.id.includes(Text)); + const transformedAllocs = matchedAllocs.models.map(alloc => ({ + ID: alloc.name, + Scope: [ + alloc.namespace.id, + alloc.id, + ], + })); + const transformedGroups = matchedGroups.models.map(group => ({ ID: group.name, Scope: [ @@ -603,6 +612,7 @@ export default function() { ID: plugin.id, })); + const truncatedAllocs = transformedAllocs.slice(0, 20); const truncatedGroups = transformedGroups.slice(0, 20); const truncatedJobs = transformedJobs.slice(0, 20); const truncatedNodes = transformedNodes.slice(0, 20); @@ -610,12 +620,14 @@ export default function() { return { Matches: { + allocs: truncatedAllocs, groups: truncatedGroups, jobs: truncatedJobs, nodes: truncatedNodes, plugins: truncatedPlugins, }, Truncations: { + allocs: truncatedAllocs.length < truncatedAllocs.length, groups: truncatedGroups.length < transformedGroups.length, jobs: truncatedJobs.length < transformedJobs.length, nodes: truncatedNodes.length < transformedNodes.length, diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 5579893256e..60d7bb4dbf6 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -16,15 +16,12 @@ module('Acceptance | search', function(hooks) { server.create('node', { name: 'xyz' }); const otherNode = server.create('node', { name: 'ghi' }); - server.create('job', { id: 'vwxyz', namespaceId: 'default', groupsCount: 1 }); - server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default', groupsCount: 1 }); - server.create('job', { id: 'abc', namespaceId: 'default', groupsCount: 1 }); - - // Override random task group names to include job names to make results deterministic - server.schema.taskGroups.all().models.forEach(group => { - group.name = `${group.job.name}-group`; - group.save(); - }); + server.create('job', { id: 'vwxyz', namespaceId: 'default', groupsCount: 1, groupTaskCount: 1 }); + server.create('job', { id: 'xyz', name: 'xyz job', namespaceId: 'default', groupsCount: 1, groupTaskCount: 1 }); + server.create('job', { id: 'abc', namespaceId: 'default', groupsCount: 1, groupTaskCount: 1 }); + + const firstAllocation = server.schema.allocations.all().models[0]; + const firstTaskGroup = server.schema.taskGroups.all().models[0]; server.create('csi-plugin', { id: 'xyz-plugin', createVolumes: false }); @@ -33,7 +30,7 @@ module('Acceptance | search', function(hooks) { await selectSearch(Layout.navbar.search.scope, 'xy'); Layout.navbar.search.as(search => { - assert.equal(search.groups.length, 4); + assert.equal(search.groups.length, 5); search.groups[0].as(jobs => { assert.equal(jobs.name, 'Jobs (2)'); @@ -48,14 +45,17 @@ module('Acceptance | search', function(hooks) { assert.equal(clients.options[0].text, 'xyz'); }); - search.groups[2].as(groups => { - assert.equal(groups.name, 'Task Groups (2)'); - assert.equal(groups.options.length, 2); - assert.equal(groups.options[0].text, 'vwxyz-group'); - assert.equal(groups.options[1].text, 'xyz job-group'); + search.groups[2].as(allocs => { + assert.equal(allocs.name, 'Allocations (0)'); + assert.equal(allocs.options.length, 0); + }); + + search.groups[3].as(groups => { + assert.equal(groups.name, 'Task Groups (0)'); + assert.equal(groups.options.length, 0); }); - search.groups[3].as(plugins => { + search.groups[4].as(plugins => { assert.equal(plugins.name, 'CSI Plugins (1)'); assert.equal(plugins.options.length, 1); assert.equal(plugins.options[0].text, 'xyz-plugin'); @@ -69,12 +69,18 @@ module('Acceptance | search', function(hooks) { await Layout.navbar.search.groups[1].options[0].click(); assert.equal(currentURL(), `/clients/${otherNode.id}`); - await selectSearch(Layout.navbar.search.scope, 'xy'); + await selectSearch(Layout.navbar.search.scope, firstAllocation.name); + assert.equal(Layout.navbar.search.groups[2].options[0].text, firstAllocation.name); await Layout.navbar.search.groups[2].options[0].click(); - assert.equal(currentURL(), '/jobs/vwxyz/vwxyz-group'); + assert.equal(currentURL(), `/allocations/${firstAllocation.id}`); - await selectSearch(Layout.navbar.search.scope, 'xy'); + await selectSearch(Layout.navbar.search.scope, firstTaskGroup.name); + assert.equal(Layout.navbar.search.groups[3].options[0].text, firstTaskGroup.name); await Layout.navbar.search.groups[3].options[0].click(); + assert.equal(currentURL(), `/jobs/vwxyz/${firstTaskGroup.name}`); + + await selectSearch(Layout.navbar.search.scope, 'xy'); + await Layout.navbar.search.groups[4].options[0].click(); assert.equal(currentURL(), '/csi/plugins/xyz-plugin'); }); From abe2794121211ff7f01f1b37aa7162e0ef760e79 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 10:15:38 -0500 Subject: [PATCH 17/25] Add guards against unrealistic random data MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The search test was failing occasionally when showing allocations because of the lifecycle chart breaking. While I don’t think these exceptions would happen with real data, adding some guards seems okay. --- ui/app/components/lifecycle-chart-row.js | 4 ++++ ui/app/components/lifecycle-chart.js | 5 ++++- ui/app/controllers/allocations/allocation/index.js | 2 +- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/ui/app/components/lifecycle-chart-row.js b/ui/app/components/lifecycle-chart-row.js index 5a2422cb9d2..25203683b32 100644 --- a/ui/app/components/lifecycle-chart-row.js +++ b/ui/app/components/lifecycle-chart-row.js @@ -26,6 +26,10 @@ export default class LifecycleChartRow extends Component { @computed('task.lifecycleName') get lifecycleLabel() { + if (!this.task) { + return ''; + } + const name = this.task.lifecycleName; if (name.includes('sidecar')) { diff --git a/ui/app/components/lifecycle-chart.js b/ui/app/components/lifecycle-chart.js index a58e6b83999..07a938109d9 100644 --- a/ui/app/components/lifecycle-chart.js +++ b/ui/app/components/lifecycle-chart.js @@ -24,7 +24,10 @@ export default class LifecycleChart extends Component { tasksOrStates.forEach(taskOrState => { const task = taskOrState.task || taskOrState; - lifecycles[`${task.lifecycleName}s`].push(taskOrState); + + if (task.lifecycleName) { + lifecycles[`${task.lifecycleName}s`].push(taskOrState); + } }); const phases = []; diff --git a/ui/app/controllers/allocations/allocation/index.js b/ui/app/controllers/allocations/allocation/index.js index 04771dbb197..4068de300d5 100644 --- a/ui/app/controllers/allocations/allocation/index.js +++ b/ui/app/controllers/allocations/allocation/index.js @@ -47,7 +47,7 @@ export default class IndexController extends Controller.extend(Sortable) { @computed('model.taskGroup.services.@each.name') get services() { - return this.get('model.taskGroup.services').sortBy('name'); + return (this.get('model.taskGroup.services') || []).sortBy('name'); } onDismiss() { From a39c3b9ad7595419a060efe3debebb7c35a4c59e Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 12:13:40 -0500 Subject: [PATCH 18/25] Fix wasteful reruns of application beforeModel MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit I noticed that the feature detection search was running whenever I navigated to a search result, it turns out that refreshModel on the region query parameter meant the application route was reloading on calls to service:router#transitionTo because the calls didn’t include the region query parameter. Rather than needing to add the region to every transitionTo call, this just lets the route load again but skips the various detection/setup queries. --- ui/app/routes/application.js | 6 ++++++ ui/tests/acceptance/search-test.js | 6 ++++++ 2 files changed, 12 insertions(+) diff --git a/ui/app/routes/application.js b/ui/app/routes/application.js index 4059b6d924a..50ceba156a7 100644 --- a/ui/app/routes/application.js +++ b/ui/app/routes/application.js @@ -26,6 +26,12 @@ export default class ApplicationRoute extends Route { } async beforeModel(transition) { + // service:router#transitionTo can cause this to rerun because of refreshModel on + // the region query parameter, this skips rerunning the detection/loading queries. + if (transition.queryParamsOnly) { + return; + } + let exchangeOneTimeToken; if (transition.to.queryParams.ott) { diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 60d7bb4dbf6..5711d89da13 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -82,6 +82,12 @@ module('Acceptance | search', function(hooks) { await selectSearch(Layout.navbar.search.scope, 'xy'); await Layout.navbar.search.groups[4].options[0].click(); assert.equal(currentURL(), '/csi/plugins/xyz-plugin'); + + const featureDetectionQueries = server.pretender.handledRequests + .filterBy('url', '/v1/search/fuzzy') + .filter(request => request.requestBody.includes('PLACEHOLDER')); + + assert.equal(featureDetectionQueries.length, 1, 'expect the feature detection query to only run once'); }); test('search does not perform a request when only one character has been entered', async function(assert) { From 3c5fe93182b86196df04a617dd5b8167a17f1719 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 12:21:07 -0500 Subject: [PATCH 19/25] Change text in feature detection query --- ui/app/services/system.js | 2 +- ui/tests/acceptance/search-test.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/app/services/system.js b/ui/app/services/system.js index bdbc748956f..aaabb069cd9 100644 --- a/ui/app/services/system.js +++ b/ui/app/services/system.js @@ -162,7 +162,7 @@ export default class SystemService extends Service { const request = yield this.token.authorizedRequest('/v1/search/fuzzy', { method: 'POST', body: JSON.stringify({ - Text: 'PLACEHOLDERFIXME', + Text: 'feature-detection-query', Context: 'jobs', }), }); diff --git a/ui/tests/acceptance/search-test.js b/ui/tests/acceptance/search-test.js index 5711d89da13..8045071ea03 100644 --- a/ui/tests/acceptance/search-test.js +++ b/ui/tests/acceptance/search-test.js @@ -85,7 +85,7 @@ module('Acceptance | search', function(hooks) { const featureDetectionQueries = server.pretender.handledRequests .filterBy('url', '/v1/search/fuzzy') - .filter(request => request.requestBody.includes('PLACEHOLDER')); + .filter(request => request.requestBody.includes('feature-detection-query')); assert.equal(featureDetectionQueries.length, 1, 'expect the feature detection query to only run once'); }); From d39f5a2d1a8b870bb56556e34d4319d9ea2bbc75 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 12:32:09 -0500 Subject: [PATCH 20/25] Restore region-setting in application route --- ui/app/routes/application.js | 69 +++++++++++++++++++----------------- 1 file changed, 36 insertions(+), 33 deletions(-) diff --git a/ui/app/routes/application.js b/ui/app/routes/application.js index 50ceba156a7..e0162369eff 100644 --- a/ui/app/routes/application.js +++ b/ui/app/routes/application.js @@ -26,46 +26,49 @@ export default class ApplicationRoute extends Route { } async beforeModel(transition) { + let promises; + // service:router#transitionTo can cause this to rerun because of refreshModel on // the region query parameter, this skips rerunning the detection/loading queries. if (transition.queryParamsOnly) { - return; - } - - let exchangeOneTimeToken; - - if (transition.to.queryParams.ott) { - exchangeOneTimeToken = this.get('token').exchangeOneTimeToken(transition.to.queryParams.ott); + promises = Promise.resolve(true); } else { - exchangeOneTimeToken = Promise.resolve(true); - } - try { - await exchangeOneTimeToken; - } catch (e) { - this.controllerFor('application').set('error', e); + let exchangeOneTimeToken; + + if (transition.to.queryParams.ott) { + exchangeOneTimeToken = this.get('token').exchangeOneTimeToken(transition.to.queryParams.ott); + } else { + exchangeOneTimeToken = Promise.resolve(true); + } + + try { + await exchangeOneTimeToken; + } catch (e) { + this.controllerFor('application').set('error', e); + } + + const fetchSelfTokenAndPolicies = this.get('token.fetchSelfTokenAndPolicies') + .perform() + .catch(); + + const fetchLicense = this.get('system.fetchLicense') + .perform() + .catch(); + + const checkFuzzySearchPresence = this.get('system.checkFuzzySearchPresence') + .perform() + .catch(); + + promises = await RSVP.all([ + this.get('system.regions'), + this.get('system.defaultRegion'), + fetchLicense, + fetchSelfTokenAndPolicies, + checkFuzzySearchPresence, + ]); } - const fetchSelfTokenAndPolicies = this.get('token.fetchSelfTokenAndPolicies') - .perform() - .catch(); - - const fetchLicense = this.get('system.fetchLicense') - .perform() - .catch(); - - const checkFuzzySearchPresence = this.get('system.checkFuzzySearchPresence') - .perform() - .catch(); - - const promises = await RSVP.all([ - this.get('system.regions'), - this.get('system.defaultRegion'), - fetchLicense, - fetchSelfTokenAndPolicies, - checkFuzzySearchPresence, - ]); - if (!this.get('system.shouldShowRegions')) return promises; const queryParam = transition.to.queryParams.region; From c1a7b48f4e0ac92ab077bbedfdb6088dbc809620 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 12:57:59 -0500 Subject: [PATCH 21/25] Add intermediate representation --- ui/app/components/global-search/control.js | 61 +++++++++++++------ .../components/global-search/control.hbs | 2 +- 2 files changed, 42 insertions(+), 21 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 1a52b78994a..7e779311455 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -57,17 +57,38 @@ export default class GlobalSearchControl extends Component { const allGroupResults = results.Matches.groups || []; const allPluginResults = results.Matches.plugins || []; - const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS); - const nodeResults = allNodeResults.slice(0, MAXIMUM_RESULTS); - const allocResults = allAllocResults.slice(0, MAXIMUM_RESULTS); - const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS); - const pluginResults = allPluginResults.slice(0, MAXIMUM_RESULTS); - - jobResults.forEach(job => job.type = 'job'); - nodeResults.forEach(node => node.type = 'node'); - allocResults.forEach(alloc => alloc.type = 'alloc'); - groupResults.forEach(group => group.type = 'group'); - pluginResults.forEach(plugin => plugin.type = 'plugin'); + const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ namespace, id ]}) => ({ + type: 'job', + id, + namespace, + label: name, + })); + + const nodeResults = allNodeResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ id ]}) => ({ + type: 'node', + id, + label: name, + })); + + const allocResults = allAllocResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ , id ]}) => ({ + type: 'allocation', + id, + label: name, + })); + + const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id, Scope: [ namespace, jobId ]}) => ({ + type: 'task-group', + id, + namespace, + jobId, + label: id, + })); + + const pluginResults = allPluginResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id }) => ({ + type: 'plugin', + id, + label: id, + })); const truncations = results.Truncations; @@ -111,19 +132,19 @@ export default class GlobalSearchControl extends Component { @action selectOption(model) { if (model.type === 'job') { - this.router.transitionTo('jobs.job', model.Scope[1], { - queryParams: { namespace: model.Scope[0] }, + this.router.transitionTo('jobs.job', model.id, { + queryParams: { namespace: model.namespace }, }); } else if (model.type === 'node') { - this.router.transitionTo('clients.client', model.Scope[0]); - } else if (model.type === 'group') { - this.router.transitionTo('jobs.job.task-group', model.Scope[1], model.ID, { - queryParams: { namespace: model.Scope[0] }, + this.router.transitionTo('clients.client', model.id); + } else if (model.type === 'task-group') { + this.router.transitionTo('jobs.job.task-group', model.jobId, model.id, { + queryParams: { namespace: model.namespace }, }); } else if (model.type === 'plugin') { - this.router.transitionTo('csi.plugins.plugin', model.ID); - } else if (model.type === 'alloc') { - this.router.transitionTo('allocations.allocation', model.Scope[1]); + this.router.transitionTo('csi.plugins.plugin', model.id); + } else if (model.type === 'allocation') { + this.router.transitionTo('allocations.allocation', model.id); } } diff --git a/ui/app/templates/components/global-search/control.hbs b/ui/app/templates/components/global-search/control.hbs index b7f8aa0ccd4..fd044f76f65 100644 --- a/ui/app/templates/components/global-search/control.hbs +++ b/ui/app/templates/components/global-search/control.hbs @@ -13,5 +13,5 @@ @triggerComponent="global-search/trigger" @registerAPI={{action 'storeSelect'}} as |option|> - {{option.ID}} + {{option.label}} From d6fc44b30c2a7820f20997a99727782d6a262438 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 13:19:21 -0500 Subject: [PATCH 22/25] Update various variable names --- ui/app/components/global-search/control.js | 36 +++++++++++++--------- 1 file changed, 21 insertions(+), 15 deletions(-) diff --git a/ui/app/components/global-search/control.js b/ui/app/components/global-search/control.js index 7e779311455..84bc9a2bfff 100644 --- a/ui/app/components/global-search/control.js +++ b/ui/app/components/global-search/control.js @@ -53,9 +53,9 @@ export default class GlobalSearchControl extends Component { const allJobResults = results.Matches.jobs || []; const allNodeResults = results.Matches.nodes || []; - const allAllocResults = results.Matches.allocs || []; - const allGroupResults = results.Matches.groups || []; - const allPluginResults = results.Matches.plugins || []; + const allAllocationResults = results.Matches.allocs || []; + const allTaskGroupResults = results.Matches.groups || []; + const allCSIPluginResults = results.Matches.plugins || []; const jobResults = allJobResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ namespace, id ]}) => ({ type: 'job', @@ -70,13 +70,13 @@ export default class GlobalSearchControl extends Component { label: name, })); - const allocResults = allAllocResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ , id ]}) => ({ + const allocationResults = allAllocationResults.slice(0, MAXIMUM_RESULTS).map(({ ID: name, Scope: [ , id ]}) => ({ type: 'allocation', id, label: name, })); - const groupResults = allGroupResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id, Scope: [ namespace, jobId ]}) => ({ + const taskGroupResults = allTaskGroupResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id, Scope: [ namespace, jobId ]}) => ({ type: 'task-group', id, namespace, @@ -84,34 +84,40 @@ export default class GlobalSearchControl extends Component { label: id, })); - const pluginResults = allPluginResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id }) => ({ + const csiPluginResults = allCSIPluginResults.slice(0, MAXIMUM_RESULTS).map(({ ID: id }) => ({ type: 'plugin', id, label: id, })); - const truncations = results.Truncations; + const { + jobs: jobsTruncated, + nodes: nodesTruncated, + allocs: allocationsTruncated, + groups: taskGroupsTruncated, + plugins: csiPluginsTruncated, + } = results.Truncations; return [ { - groupName: resultsGroupLabel('Jobs', jobResults, allJobResults, truncations.jobs), + groupName: resultsGroupLabel('Jobs', jobResults, allJobResults, jobsTruncated), options: jobResults, }, { - groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults, truncations.nodes), + groupName: resultsGroupLabel('Clients', nodeResults, allNodeResults, nodesTruncated), options: nodeResults, }, { - groupName: resultsGroupLabel('Allocations', allocResults, allAllocResults, truncations.allocs), - options: allocResults, + groupName: resultsGroupLabel('Allocations', allocationResults, allAllocationResults, allocationsTruncated), + options: allocationResults, }, { - groupName: resultsGroupLabel('Task Groups', groupResults, allGroupResults, truncations.groups), - options: groupResults, + groupName: resultsGroupLabel('Task Groups', taskGroupResults, allTaskGroupResults, taskGroupsTruncated), + options: taskGroupResults, }, { - groupName: resultsGroupLabel('CSI Plugins', pluginResults, allPluginResults, truncations.plugins), - options: pluginResults, + groupName: resultsGroupLabel('CSI Plugins', csiPluginResults, allCSIPluginResults, csiPluginsTruncated), + options: csiPluginResults, } ]; }) From 72d6200449a3fed52827067f0e1c1856324279b1 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Thu, 22 Apr 2021 14:08:34 -0500 Subject: [PATCH 23/25] Change context for feature detection query MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit It’s my belief that this is the most lightweight option. --- ui/app/services/system.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/app/services/system.js b/ui/app/services/system.js index aaabb069cd9..106987c6a39 100644 --- a/ui/app/services/system.js +++ b/ui/app/services/system.js @@ -163,7 +163,7 @@ export default class SystemService extends Service { method: 'POST', body: JSON.stringify({ Text: 'feature-detection-query', - Context: 'jobs', + Context: 'namespaces', }), }); From 54346bc2a6f2db8ca7c19bab2686b0e271929f64 Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 28 Apr 2021 11:57:08 -0500 Subject: [PATCH 24/25] Add changelog entry --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d32a654c750..707e57a7540 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -28,6 +28,7 @@ IMPROVEMENTS: * networking: Added support for interpolating host network names with node attributes. [[GH-10196](https://github.com/hashicorp/nomad/issues/10196)] * nomad/structs: Removed deprecated Node.Drain field, added API extensions to restore it [[GH-10202](https://github.com/hashicorp/nomad/issues/10202)] * ui: Added a job reversion button [[GH-10336](https://github.com/hashicorp/nomad/pull/10336)] + * ui: Updated global search to use fuzzy search API [[GH-10412](https://github.com/hashicorp/nomad/pull/10412)] BUG FIXES: * core (Enterprise): Update licensing library to v0.0.11 to include race condition fix. [[GH-10253](https://github.com/hashicorp/nomad/issues/10253)] From d2aa2910ae9735f89487e4be4b04125fc17191ed Mon Sep 17 00:00:00 2001 From: Buck Doyle Date: Wed, 28 Apr 2021 12:14:46 -0500 Subject: [PATCH 25/25] Add missing import --- ui/tests/pages/layout.js | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/tests/pages/layout.js b/ui/tests/pages/layout.js index ade794abdfc..e9d3de2c2cd 100644 --- a/ui/tests/pages/layout.js +++ b/ui/tests/pages/layout.js @@ -3,6 +3,7 @@ import { create, clickable, collection, + hasClass, isHidden, isPresent, text,