From 324e0f4ffd46fdc1dd02e93eb6af035234c4caf5 Mon Sep 17 00:00:00 2001 From: Daniel Roux Date: Sat, 4 May 2024 22:25:20 +0200 Subject: [PATCH] Add logo, fix jobRow.finishedAt and test CronJobRow/JobRow elements --- .changelog/54.txt | 3 + .github/workflows/k8s-test.yml | 5 +- cypress/integration/sk8l.spec.js | 202 +++++++++++++++++++++++---- index.html | 3 +- src/components/CronJobRow.vue | 18 +-- src/components/CronjobListHeader.vue | 3 +- src/components/JobRow.vue | 50 +++++-- src/components/PodRow.vue | 2 +- testdata/sk8l-demo-job.yml | 16 +++ 9 files changed, 245 insertions(+), 57 deletions(-) create mode 100644 .changelog/54.txt diff --git a/.changelog/54.txt b/.changelog/54.txt new file mode 100644 index 0000000..16da9bf --- /dev/null +++ b/.changelog/54.txt @@ -0,0 +1,3 @@ +```release-note:enhancement +Add logo, fix jobRow.finishedAt and test CronJobRow/JobRow elements +``` diff --git a/.github/workflows/k8s-test.yml b/.github/workflows/k8s-test.yml index d393f3a..a5fb2d8 100644 --- a/.github/workflows/k8s-test.yml +++ b/.github/workflows/k8s-test.yml @@ -48,7 +48,7 @@ jobs: - name: Update config files with dev docker image tag if: run: | - pr_image_tag=pre-${{ inputs.image_tag }} + pr_image_tag=pre-${{ inputs.pull_request_number }}-v1.29.2 cp testdata/sk8l-values.yml testdata/sk8l-values.yml.bak yq e -i ".sk8lUi.imageTag = \"$pr_image_tag\"" testdata/sk8l-values.yml set +e @@ -66,7 +66,8 @@ jobs: - name: ui smoke tests id: ui_smoke_tests run: | - ./ci/ui_smoke_tests.sh ghcr.io/danroux/sk8l-ui:ui-test-${{ inputs.image_tag }} + image_tag=ui-test-${{ inputs.pull_request_number }}-v1.29.2 + ./ci/ui_smoke_tests.sh ghcr.io/danroux/sk8l-ui:$image_tag - name: ui smoke tests error output if: ${{ failure() && steps.ui_smoke_tests.conclusion == 'failure' }} run: | diff --git a/cypress/integration/sk8l.spec.js b/cypress/integration/sk8l.spec.js index 059559d..0b92144 100644 --- a/cypress/integration/sk8l.spec.js +++ b/cypress/integration/sk8l.spec.js @@ -19,8 +19,60 @@ describe('Home Test', () => { cy.contains('Cronjob activity') cy.contains('33%') cy.contains('Latest completions') - }) + }); + + describe('CronJobRow Details', () => { + it('displays details for a working cronjob correctly', () => { + cy.visit('https://sk8l-ui:8001/') + const cronJobName = 'process-videos'; + cy.get(`#cronjob-${cronJobName}`).as('cronJobElement'); + + cy.get('@cronJobElement') + .should('exist'); + + cy.get('@cronJobElement') + .find('.cronjob-namespace') + .should('exist') + .contains('sk8l'); + + cy.get('@cronJobElement') + .find('.cronjob-completions') + .should('exist') + .contains('1'); + + cy.get('@cronJobElement') + .find('.cronjob-parallelism') + .should('exist') + .contains('1'); + + cy.get('@cronJobElement') + .find('.cronjob-creation-time') + .should('exist') + .contains(/\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}Z/) + + cy.get('@cronJobElement') + .find('.cronjob-last-duration') + .should('exist') + .contains(/\d+ sec|(\d+ min, \d+ sec)/); + cy.get('@cronJobElement') + .find('.cronjob-successful-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + + cy.get('@cronJobElement') + .find('.cronjob-completion-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + + // cy.get('@cronJobElement') + // .find('.cronjob-failure-time') + // .should('exist'); + }); + }); +}); + +describe('/cronjobs/:namespace', () => { it('visits a cronjob', () => { cy.visit('https://sk8l-ui:8001/cronjob/sk8l/download-report-files') cy.contains('Overview') @@ -55,33 +107,127 @@ describe('Home Test', () => { cy.contains('Host:') cy.contains('Pod Ips:') }) +}); - describe('/jobs/:namespace', () => { - it("visits /jobs/:namespace ", () => { - cy.visit('https://sk8l-ui:8001/jobs/sk8l/') - cy.get('#jobs-timeline').should('exist') - cy.contains('Job activity') - cy.get('.job-row').should('have.length', 2) - cy.get('.completed-job').should('have.length.gt', 0) - - cy.get('.completed-job') - .should('have.length.gt', 0) - .its('length') - .then((count) => { - expect(count).to.be.greaterThan(0) - cy.log(`Found ${count} elements with class '.completed-job'`) - }) - - cy.get('#job-cypress-job.job-row') - .find('strong.job-name') +describe('/jobs/:namespace', () => { + it("visits /jobs/:namespace ", () => { + cy.visit('https://sk8l-ui:8001/jobs/sk8l/') + cy.get('#jobs-timeline').should('exist') + cy.contains('Job activity') + cy.get('.job-row').should('have.length', 3) + cy.get('.completed-job').should('have.length.gt', 0) + + cy.get('.completed-job') + .should('have.length.gt', 0) + .its('length') + .then((count) => { + expect(count).to.be.greaterThan(0) + cy.log(`Found ${count} elements with class '.completed-job'`) + }) + + cy.get('#job-cypress-job.job-row') + .find('strong.job-name') + .should('exist') + .and('have.text', 'cypress-job'); + + cy.get('#job-sk8l-demo-job.job-row').within(() => { + cy.get('strong.job-name') .should('exist') - .and('have.text', 'cypress-job'); - - cy.get('#job-sk8l-demo-job.job-row').within(() => { - cy.get('strong.job-name') - .should('exist') - .and('have.text', 'sk8l-demo-job'); - }); - }) + .and('have.text', 'sk8l-demo-job'); + }); }) -}) + + describe('JobRow Details', () => { + it('displays details for a working job correctly', () => { + cy.visit('https://sk8l-ui:8001/jobs/sk8l/') + cy.get('#job-sk8l-demo-job').as('jobElement'); + + cy.get('@jobElement') + .find('.job-uuid') + .should('exist'); + + cy.get('@jobElement') + .find('.job-row-footer') + .should('exist'); + + cy.get('@jobElement') + .find('.job-completions') + .should('exist'); + + cy.get('@jobElement') + .find('.job-parallelism') + .should('exist'); + + cy.get('@jobElement') + .find('.job-suspend') + .should('exist'); + + cy.get('@jobElement') + .find('.job-start-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + + cy.get('@jobElement') + .find('.job-duration-time') + .should('exist') + .contains(/\d+ sec|(\d+ min, \d+ sec)/); + + cy.get('@jobElement') + .find('.job-completion-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + }); + + it('displays details for a failing job correctly', () => { + cy.visit('https://sk8l-ui:8001/jobs/sk8l/') + cy.get('#job-sk8l-failing-demo-job').as('jobElement'); + + // ['job-uuid', 'job-failure-condition', 'job-row-footer', 'job-completions', 'job-parallelism', + // 'job-suspend', 'job-start-time', 'job-duration-time', 'job-failure-time', 'job-completion-time'] + // .forEach(className => { + // cy.get('@jobElement') + // .find(`.${className}`) + // .should('exist'); + // }); + + cy.get('@jobElement') + .find('.job-uuid') + .should('exist'); + + cy.get('@jobElement') + .find('.job-failure-condition') + .should('exist'); + + cy.get('@jobElement') + .find('.job-row-footer') + .should('exist'); + + cy.get('@jobElement') + .find('.job-completions') + .should('exist'); + + cy.get('@jobElement') + .find('.job-parallelism') + .should('exist'); + + cy.get('@jobElement') + .find('.job-suspend') + .should('exist'); + + cy.get('@jobElement') + .find('.job-start-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + + cy.get('@jobElement') + .find('.job-duration-time') + .should('exist') + .contains(/\d+ sec|(\d+ min, \d+ sec)/); + + cy.get('@jobElement') + .find('.job-failure-time') + .should('exist') + .contains(/\d+ (?:second|minute)(s)? ago/); + }); + }); +}); diff --git a/index.html b/index.html index 767d32b..4185b97 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,8 @@ - + diff --git a/src/components/CronJobRow.vue b/src/components/CronJobRow.vue index dc3e46c..4cd7d3e 100644 --- a/src/components/CronJobRow.vue +++ b/src/components/CronJobRow.vue @@ -6,7 +6,7 @@