diff --git a/lib/public/views/Environments/ActiveColumns/environmentsActiveColumns.js b/lib/public/views/Environments/ActiveColumns/environmentsActiveColumns.js index 49da11ae91..5e2b185f29 100644 --- a/lib/public/views/Environments/ActiveColumns/environmentsActiveColumns.js +++ b/lib/public/views/Environments/ActiveColumns/environmentsActiveColumns.js @@ -74,6 +74,17 @@ export const environmentsActiveColumns = { size: 'w-10', format: formatRunsList, balloon: true, + + /** + * Run numbers filter component + * + * @param {EnvironmentOverviewModel} environmentOverviewModel the environment overview model + * @return {Component} the filter component + */ + filter: (environmentOverviewModel) => rawTextFilter( + environmentOverviewModel.filteringModel.get('runNumbers'), + { classes: ['w-100'], placeholder: 'e.g. 553203, 553221, ...' }, + ), }, updatedAt: { name: 'Last Update', diff --git a/lib/public/views/Environments/Overview/EnvironmentOverviewModel.js b/lib/public/views/Environments/Overview/EnvironmentOverviewModel.js index 1d72fc2528..834313ea2c 100644 --- a/lib/public/views/Environments/Overview/EnvironmentOverviewModel.js +++ b/lib/public/views/Environments/Overview/EnvironmentOverviewModel.js @@ -32,6 +32,7 @@ export class EnvironmentOverviewModel extends OverviewPageModel { super(); this._filteringModel = new FilteringModel({ + runNumbers: new RawTextFilterModel(), statusHistory: new RawTextFilterModel(), currentStatus: new SelectionFilterModel({ availableOptions: Object.keys(StatusAcronym).map((status) => ({ diff --git a/test/public/envs/overview.test.js b/test/public/envs/overview.test.js index 4fa6ca82a0..b56499de1d 100644 --- a/test/public/envs/overview.test.js +++ b/test/public/envs/overview.test.js @@ -294,6 +294,33 @@ module.exports = () => { await page.waitForSelector(filterPanelSelector, { visible: true }); }); + it('should successfully filter environments by their related run numbers', async () => { + /** + * This is the sequence to test filtering the environments based on their related run numbers. + * + * @param {string} selector the filter input selector + * @param {string} inputValue the value to type in the filter input + * @param {string[]} expectedIds the list of expected environment IDs after filtering + * @return {void} + */ + const filterOnRunNumbers = async (selector, inputValue, expectedIds) => { + await fillInput(page, selector, inputValue, ['change']); + await waitForTableLength(page, expectedIds.length); + expect(await page.$$eval('tbody tr', (rows) => rows.map((row) => row.id))).to.eql(expectedIds.map(id => `row${id}`)); + } + + await expectAttributeValue(page, '.runs-filter input', 'placeholder', 'e.g. 553203, 553221, ...'); + + await filterOnRunNumbers('.runs-filter input', '10', ['TDI59So3d', 'Dxi029djX']); + await resetFilters(page); + + await filterOnRunNumbers('.runs-filter input', '103', ['TDI59So3d']); + await resetFilters(page); + + await filterOnRunNumbers('.runs-filter input', '86, 91', ['KGIS12DS', 'VODdsO12d']); + await resetFilters(page); + }); + it('should successfully filter environments by their status history', async () => { /** * This is the sequence to test filtering the environments on their status history.