WIP Tables update

acceptance-tests/.gitignore

@@ -0,0 +1,2 @@
+runner/.blueocean-ath-jenkins-url
+ath-output.txt

acceptance-tests/src/main/java/io/blueocean/ath/pages/blue/DashboardPage.java

@@ -41,15 +41,15 @@ public void open() {
 
     public boolean isFavorite(String job) {
         WebElement favorite = wait.until(driver -> {
-            WebElement tr = driver.findElement(By.xpath("//tr[@data-name=\"" + job + "\"]"));
+            WebElement tr = driver.findElement(By.xpath("//*[@data-pipeline=\"" + job + "\"]"));
             return tr.findElement(By.cssSelector(".Checkbox.Favorite > label > input"));
         });
         return favorite.isSelected();
     }
 
     public void toggleFavorite(String job) {
         WebElement favorite = wait.until(driver -> {
-            WebElement tr = driver.findElement(By.xpath("//tr[@data-name=\"" + job + "\"]"));
+            WebElement tr = driver.findElement(By.xpath("//*[@data-pipeline=\"" + job + "\"]"));
             return tr.findElement(By.cssSelector(".Checkbox.Favorite > label"));
         });
 

acceptance-tests/src/main/js/page_objects/blueocean/bluePipelineActivity.js

@@ -10,12 +10,19 @@ const pageHelper = require('../../util/pageHelper');
 //oh man, I miss es6 import :(
 const sanityCheck = pageHelper.sanityCheck;
 
+function activityRowSelector(pipeline, runId) {
+    // Fixme: Can we parameterise the "elements" below?
+    return `.activity-table .JTable-row[data-pipeline='${pipeline}'][data-runid='${runId}']`;
+}
+
+const activityTableEntries = '.activity-table .JTable-row[data-pipeline]';
+
 module.exports = {
     elements: {
         pipelinesNav: '.Header-topNav nav a[href="/blue/pipelines"]',
         emptyStateShoes: '.PlaceholderContent.NoRuns',
         activityTable: '.activity-table',
-        activityTableEntries: 'table.activity-table tbody tr',
+        activityTableEntries: activityTableEntries,
         runButton: 'a.run-button',
         toastOpenButton: {
             selector: '//div[@class="toast default"]/a[@class="action" and text()="Open"]',
@@ -64,61 +71,62 @@ module.exports.commands = [{
         this.assertBasicLayoutOkay(jobName);
         this.waitForElementVisible('@emptyStateShoes');
     },
+    /**
+     * Wait for a specific run to appear in the activity table
+     * @param pipeline name of the pipeline
+     * @param runId id of the run
+     */
+    waitForRunVisible: function(pipeline, runId) {
+        this.waitForElementVisible(activityRowSelector(pipeline, runId));
+    },
     /**
      * Wait for a specific run to appear in the activity table as a success
-     * @param runName name of the job
+     * @param pipeline name of the pipeline
+     * @param runId id of the run
      */
-    waitForRunSuccessVisible: function(runName) {
-        this.waitForElementVisible('.activity-table tr#' + runName);
-        this.waitForElementVisible('.activity-table tr#' + runName + ' svg.svgResultStatus');
-        this.waitForElementPresent('.activity-table tr#' + runName + ' svg circle.success');
+    waitForRunSuccessVisible: function(pipeline, runId) {
+        this.waitForRunVisible(pipeline, runId);
+        const resultRowSelector = activityRowSelector(pipeline, runId);
+        this.waitForElementVisible(`${resultRowSelector} .success`);
     },
     /**
      * Wait for a specific run to appear in the activity table as a failure
      * @param runName name of the job
      */
-    waitForRunFailureVisible: function(runName) {
-        this.waitForElementVisible('.activity-table tr#' + runName);
-        this.waitForElementVisible('.activity-table tr#' + runName + ' svg.svgResultStatus');
-        this.waitForElementPresent('.activity-table tr#' + runName + ' svg circle.failure');
+    waitForRunFailureVisible: function(pipeline, runId) {
+        this.waitForRunVisible(pipeline, runId);
+        const resultRowSelector = activityRowSelector(pipeline, runId);
+        this.waitForElementVisible(`${resultRowSelector} .failure`);
     },    
 
     /**
      * Wait for a specific run to appear in the activity table as unstable
      * @param runName name of the job
      */
-    waitForRunUnstableVisible: function(runName) {
-        this.waitForElementVisible('.activity-table tr#' + runName);
-        this.waitForElementVisible('.activity-table tr#' + runName + ' svg.svgResultStatus');
-        this.waitForElementPresent('.activity-table tr#' + runName + ' svg circle.unstable');
-    },  
+    waitForRunUnstableVisible: function(pipeline, runId) {
+        this.waitForRunVisible(pipeline, runId);
+        const resultRowSelector = activityRowSelector(pipeline, runId);
+        this.waitForElementVisible(`${resultRowSelector} .unstable`);
+    },
     /**
      * Wait for a specific run to appear in the activity table as running
      * @param runName name of the job
      * @param [callback] {Function} - callback to be invoke when finished, will pass the sse event to the callback
      */
-    waitForRunRunningVisible: function(runName, callback) {
-        this.waitForElementVisible('.activity-table tr#' + runName);
-        this.waitForElementVisible('.activity-table tr#' + runName + ' svg.svgResultStatus');
-        if (callback === undefined) {
-            this.waitForElementPresent('.activity-table tr#' + runName + ' svg path.running');
-        } else {
-            this.waitForElementPresent('.activity-table tr#' + runName + ' svg path.running', callback);
-        }
+    waitForRunRunningVisible: function(pipeline, runId) {
+        this.waitForRunVisible(pipeline, runId);
+        const resultRowSelector = activityRowSelector(pipeline, runId);
+        this.waitForElementVisible(`${resultRowSelector} .running`);
     },
     /**
      * Wait for a specific run to appear in the activity table as paused
      * @param runName name of the job
      * @param [callback] {Function} - callback to be invoke when finished, will pass the sse event to the callback
      */
-    waitForRunPausedVisible: function(runName, callback) {
-        this.waitForElementVisible('.activity-table tr#' + runName);
-        this.waitForElementVisible('.activity-table tr#' + runName + ' svg.svgResultStatus');
-        if (callback === undefined) {
-            this.waitForElementPresent('.activity-table tr#' + runName + ' svg .paused');
-        } else {
-            this.waitForElementPresent('.activity-table tr#' + runName + ' svg .paused', callback);
-        }
+    waitForRunPausedVisible: function(pipeline, runId) {
+        this.waitForRunVisible(pipeline, runId);
+        const resultRowSelector = activityRowSelector(pipeline, runId);
+        this.waitForElementVisible(`${resultRowSelector} .paused`);
     },
 
     /**
@@ -127,7 +135,7 @@ module.exports.commands = [{
     assertStageGraphShows: function() {
       //check results look kosher:
       this.waitForElementVisible('.progress-spinner.running');                           
-      this.waitForElementVisible('.BasicHeader--running')
+      this.waitForElementVisible('.BasicHeader--running');
 
       this.waitForElementVisible('.pipeline-node-selected');                  
       this.waitForElementVisible('.download-log-button');                  
@@ -155,7 +163,7 @@ module.exports.commands = [{
         var self = this;
         const browser = this.api;
         self.waitForElementVisible('@activityTableEntries');
-        browser.elements('css selector', 'table.activity-table tbody tr', function (codeCollection) {
+        browser.elements('css selector', activityTableEntries, function (codeCollection) {
             this.assert.equal(codeCollection.value.length, expected);
         });
     },

acceptance-tests/src/main/js/page_objects/blueocean/bluePipelineBranch.js

@@ -9,7 +9,7 @@ var url = require('../../util/url');
  * */
 module.exports = {
     elements: {
-        runButton: '.actions a.run-button',
+        runButton: 'a.run-button',
         toasts: 'div.toaster div.toast span.text'
     }
 };
@@ -39,4 +39,4 @@ module.exports.commands = [{
         });
         return self;
     }
-}];
+}];

acceptance-tests/src/main/js/page_objects/blueocean/bluePipelines.js

@@ -8,6 +8,10 @@
 const url = require('../../util/url');
 const pipelinesUrl = url.viewAllPipelines();
 
+function pipelineRowSelector(pipeline) {
+    return `.pipelines-table .JTable-row[data-pipeline='${pipeline}']`;
+}
+
 module.exports = {
 
     url: function () {
@@ -35,10 +39,10 @@ module.exports.commands = [{
         this.waitForElementVisible('.Site-footer');
     },
     assertJob: function(jobName) {
-        this.waitForElementVisible('.pipelines-table tr[data-name="' + jobName + '"]');
+        this.waitForElementVisible(pipelineRowSelector(jobName));
     },
     countJobToBeEqual: function(browser, jobName, count) {
-        browser.elements('css selector', '.pipelines-table tr[data-name="' + jobName + '"]', function (codeCollection) {
+        browser.elements('css selector', pipelineRowSelector(jobName), function (codeCollection) {
             this.assert.equal(codeCollection.value.length, count);
         });
     },

acceptance-tests/src/test/js/artifacts/artifacts.js

@@ -20,7 +20,7 @@ module.exports = {
       // run the job
       blueActivityPage.click('@runButton');
       blueActivityPage.waitForElementVisible('@toastOpenButton');
-      blueActivityPage.waitForRunSuccessVisible(`${jobName}-1`);
+      blueActivityPage.waitForRunSuccessVisible(jobName, '1');
 
     },
 

acceptance-tests/src/test/js/creation/git/localRepo.js

@@ -37,6 +37,6 @@ module.exports = {
     'Step 02 - Check Activity Tab': !function (browser) {
         const activity = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
         activity.assertBasicLayoutOkay();
-        activity.waitForRunSuccessVisible(jobName + '-1');
+        activity.waitForRunSuccessVisible(jobName, '1');
     }
 };

acceptance-tests/src/test/js/edgeCases/initialStage.js

@@ -32,7 +32,7 @@ module.exports = {
   'Step 03': function (browser) {
     const blueActivityPage = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
     // Check the run itself
-    blueActivityPage.waitForRunRunningVisible(jobName + '-1');
+    blueActivityPage.waitForRunRunningVisible(jobName, '1');
     const blueRunDetailPage = browser.page.bluePipelineRunDetail().forRun(jobName, 'jenkins', 1);
 
     blueRunDetailPage.assertBasicLayoutOkay();

acceptance-tests/src/test/js/failing.js

@@ -69,7 +69,7 @@ module.exports = {
      */
     'Step 04' : function(browser) {
         var blueActivityPage = browser.page.bluePipelineActivity().forJob(JOB, 'jenkins');
-        blueActivityPage.waitForRunFailureVisible(JOB + '-1');
+        blueActivityPage.waitForRunFailureVisible(JOB, '1');
         blueActivityPage.waitForElementVisible('.replay-button');
     },
 

acceptance-tests/src/test/js/failingStages.js

@@ -65,7 +65,7 @@ module.exports = {
      */
     'Step 04' : function(browser) {
         var blueActivityPage = browser.page.bluePipelineActivity().forJob(JOB, 'jenkins');
-        blueActivityPage.waitForRunFailureVisible(JOB + '-1');
+        blueActivityPage.waitForRunFailureVisible(JOB, '1');
         blueActivityPage.waitForElementVisible('.replay-button');
     },
 

acceptance-tests/src/test/js/log-karaoke/freestyle.js

@@ -23,7 +23,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob('hijo', 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible('hijo-1');
+        blueActivityPage.waitForRunRunningVisible('hijo', '1');
         const blueRunDetailPage = browser.page.bluePipelineRunDetail().forRun('hijo', 'jenkins', 1);
         // assert basic page style
         blueRunDetailPage.assertBasicLayoutOkay();

acceptance-tests/src/test/js/log-karaoke/input.js

@@ -25,7 +25,7 @@ module.exports = {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
         // Check the run is turning to pause
         blueActivityPage.waitForJobRunPaused(jobName, function () {
-            blueActivityPage.waitForRunPausedVisible(jobName + '-1');
+            blueActivityPage.waitForRunPausedVisible(jobName, '1');
         });
     },
     /** Check Job Blue Ocean Pipeline Activity Page has run  - then go to the detail page and validate the input form

acceptance-tests/src/test/js/log-karaoke/noStages.js

@@ -25,7 +25,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible('noStages-1');
+        blueActivityPage.waitForRunRunningVisible('noStages', '1');
         const blueRunDetailPage = browser.page.bluePipelineRunDetail().forRun(jobName, 'jenkins', 1);
 
         // Wait for the table of pipeline steps to start rendering with

acceptance-tests/src/test/js/log-karaoke/parallelStages.js

@@ -30,7 +30,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible('parallelStages-1');
+        blueActivityPage.waitForRunRunningVisible('parallelStages', '1');
         const blueRunDetailPage = browser.page.bluePipelineRunDetail().forRun(jobName, 'jenkins', 1);
         blueRunDetailPage.validateGraph();
         // if we have the first stage finished we can go on

acceptance-tests/src/test/js/log-karaoke/parametrisedPipeline.js

@@ -34,7 +34,7 @@ module.exports = {
 
     const blueActivityPage = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
     blueActivityPage.click('.branches');
-    blueActivityPage.waitForElementVisible('tr[id^="master"]');
+    blueActivityPage.waitForElementVisible('.JTable-row[data-branch="master"]');
     blueActivityPage.waitForElementVisible('a.run-button');
     blueActivityPage.click('a.run-button');
     blueActivityPage.waitForElementVisible('button.inputStepSubmit');
@@ -94,4 +94,4 @@ module.exports = {
       })
     });
   }
-};
+};

acceptance-tests/src/test/js/log-karaoke/stages-block.js

@@ -39,7 +39,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(useCase.name, 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible(useCase.name + '-1');
+        blueActivityPage.waitForRunRunningVisible(useCase.name, '1');
     },
 /** Check Job Blue Ocean Pipeline run detail page - karaoke*/
     'Step 04': function (browser) {

acceptance-tests/src/test/js/log-karaoke/stages-new.js

@@ -39,7 +39,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(useCase.name, 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible(useCase.name + '-1');
+        blueActivityPage.waitForRunRunningVisible(useCase.name, '1');
     },
 /** Check Job Blue Ocean Pipeline run detail page - karaoke*/
     'Step 04': function (browser) {

acceptance-tests/src/test/js/log-karaoke/stages-old.js

@@ -44,7 +44,7 @@ module.exports = {
     'Step 03': function (browser) {
         const blueActivityPage = browser.page.bluePipelineActivity().forJob(useCase.name, 'jenkins');
         // Check the run itself
-        blueActivityPage.waitForRunRunningVisible(useCase.name + '-1');
+        blueActivityPage.waitForRunRunningVisible(useCase.name, '1');
     },
 /** Check Job Blue Ocean Pipeline run detail page - karaoke*/
     'Step 04': function (browser) {

acceptance-tests/src/test/js/matrix.js

@@ -15,6 +15,6 @@ module.exports = {
 
         pipelinePage.waitForElementVisible('.pipelineRedirectLink');
 
-        browser.useXpath().waitForElementVisible(`//*/a[@class="pipelineRedirectLink" and contains(@href, "/job/${jobName}/")]`)
+        browser.useXpath().waitForElementVisible(`//*/a[contains(@class, "pipelineRedirectLink") and contains(@href, "/job/${jobName}/")]`)
     }
-}
+}

acceptance-tests/src/test/js/multibranch/filtering.js

@@ -27,7 +27,7 @@ module.exports = {
     'Step 2 - view all runs on Activity tab': function (browser) {
         activity = browser.page.bluePipelineActivity().forJob(jobName, 'jenkins');
         activity.waitForElementVisible('@activityTable');
-        browser.elements('css selector', 'tbody tr', function(res) {
+        browser.elements('css selector', '.activity-table .JTable-row[data-pipeline]', function(res) {
             browser.assert.equal(res.value.length, 2, 'Correct number of runs shown initially');
         });
     },
@@ -37,7 +37,7 @@ module.exports = {
         activity.waitForElementVisible('.item[title=master]');
         activity.click('.item[title=master]');
         activity.waitForElementVisible('input.autocomplete[value=master');
-        browser.elements('css selector', 'tbody tr', function(res) {
+        browser.elements('css selector', '.activity-table .JTable-row[data-pipeline]', function(res) {
             browser.assert.equal(res.value.length, 1, 'Correct number of runs filtered down');
         });
     }