[O2B-1493] Add run numbers filter to the environments overview (#2036)

* Introduces a raw text filter for the run numbers of environments.
* Adds tests to verify correct filtering behaviour.

Author: isaachilly

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',

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) => ({

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.