From 4735dcf2a96b11fcd02023a12873f64657d2ca6e Mon Sep 17 00:00:00 2001 From: jonasongg <120372506+jonasongg@users.noreply.github.com> Date: Sun, 12 May 2024 16:53:22 +0800 Subject: [PATCH] [#2195] Add cypress tests for show tag when grouping by author and by none (#2197) Add cypress tests for show tag when grouping by author and by none There are no Cypress tests to test the behaviour of the show tag feature when the report is grouped by author or grouped by none. Let's add a test for this to ensure the feature is working properly. --- frontend/cypress/config/author-config.csv | 2 + .../chartView/chartView_mergeGroup.cy.js | 16 ++-- .../chartView_scrollToActiveRepo.cy.js | 2 +- .../tests/chartView/chartView_showTags.cy.js | 87 +++++++++++++++++++ frontend/src/components/c-summary-charts.vue | 2 +- 5 files changed, 99 insertions(+), 10 deletions(-) create mode 100644 frontend/cypress/config/author-config.csv diff --git a/frontend/cypress/config/author-config.csv b/frontend/cypress/config/author-config.csv new file mode 100644 index 0000000000..1c1e437180 --- /dev/null +++ b/frontend/cypress/config/author-config.csv @@ -0,0 +1,2 @@ +Repository's Location,Branch,Author's Git Host ID,Author's Emails,Author's Display Name,Author's Git Author Name,Ignore Glob List +https://github.com/reposense/publish-RepoSense.git,master,yong24s,,,Yong Hao TENG;yong24s, diff --git a/frontend/cypress/tests/chartView/chartView_mergeGroup.cy.js b/frontend/cypress/tests/chartView/chartView_mergeGroup.cy.js index 9c3a9bc460..4d9f483be5 100644 --- a/frontend/cypress/tests/chartView/chartView_mergeGroup.cy.js +++ b/frontend/cypress/tests/chartView/chartView_mergeGroup.cy.js @@ -17,9 +17,9 @@ describe('merge group', () => { .uncheck() .should('not.be.checked'); - // after un-checking merge group, all 14 summary charts will show + // after un-checking merge group, all 9 summary charts will show cy.get('#summary-charts').find('.summary-chart') - .should('have.length', 14); + .should('have.length', 9); }); it('check and uncheck merge group when group by authors', () => { @@ -31,9 +31,9 @@ describe('merge group', () => { .check() .should('be.checked'); - // after checking merge group, 14 merged author groups will show + // after checking merge group, 8 merged author groups will show cy.get('#summary-charts').find('.summary-chart') - .should('have.length', 14); + .should('have.length', 8); cy.get('#summary label.merge-group > input:visible') .first() @@ -41,9 +41,9 @@ describe('merge group', () => { .uncheck() .should('not.be.checked'); - // after un-checking merge group, all 14 summary charts will show + // after un-checking merge group, all 9 summary charts will show cy.get('#summary-charts').find('.summary-chart') - .should('have.length', 14); + .should('have.length', 9); }); it('merge group option should be disabled when group by none', () => { @@ -62,7 +62,7 @@ describe('merge group', () => { .should('be.checked'); // get the chart bars and assert they have the correct initial widths - const expectedWidths = [100, 100, 100, 15, 100, 100, 90, 30, 15]; + const expectedWidths = [100, 100, 20, 100, 100, 3, 20, 5]; cy.get('.stacked-bar__contrib--bar') .should('have.length', expectedWidths.length) .then(($bars) => { @@ -70,7 +70,7 @@ describe('merge group', () => { const parentWidth = $bars.eq(0).parent().width(); expectedWidths.forEach((expectedWidth, index) => { const width = (parseFloat(window.getComputedStyle($bars[index]).width) / parentWidth) * 100; - expect(width).to.be.closeTo(expectedWidth, 1); + expect(width).to.be.closeTo(expectedWidth, 2); }); }); }); diff --git a/frontend/cypress/tests/chartView/chartView_scrollToActiveRepo.cy.js b/frontend/cypress/tests/chartView/chartView_scrollToActiveRepo.cy.js index aa7d3a887a..b2c0dfb4b5 100644 --- a/frontend/cypress/tests/chartView/chartView_scrollToActiveRepo.cy.js +++ b/frontend/cypress/tests/chartView/chartView_scrollToActiveRepo.cy.js @@ -49,7 +49,7 @@ describe('scroll to active repo', () => { }); cy.url() - .should('contain', 'tabAuthor=Yong%20Hao%20TENG') + .should('contain', 'tabAuthor=yong24s') .should('contain', 'tabRepo=reposense%2Fpublish-RepoSense%5Bmaster%5D'); cy.reload(); diff --git a/frontend/cypress/tests/chartView/chartView_showTags.cy.js b/frontend/cypress/tests/chartView/chartView_showTags.cy.js index 0e5ed49e67..265c290cd3 100644 --- a/frontend/cypress/tests/chartView/chartView_showTags.cy.js +++ b/frontend/cypress/tests/chartView/chartView_showTags.cy.js @@ -64,4 +64,91 @@ describe('show tags', () => { .should('equal', 'https://github.com/reposense/RepoSense/releases/tag/v1.0'); }); }); + + it('group by authors works with show tags', () => { + cy.get('div.mui-select.grouping > select:visible') + .select('groupByAuthors'); + + cy.get('div.mui-select.sort-within-group > select:visible') + .select('title dsc'); + + cy.get('#summary label.show-tags > input:visible') + .should('be.visible') + .check() + .should('be.checked'); + + cy.get('.summary-chart') + .first() + .find('.summary-chart__title--tags') + .find('a') + .should('have.length', 0); + + cy.get('.summary-chart') + .eq(1) + .find('.summary-chart__title--tags') + .find('a') + .should('have.length.gt', 0); + + cy.get('.icon-button.fa-list-ul') + .should('exist') + .eq(1) + .click(); + + const correctTags = []; + + cy.get('.zoom__title--tags') + .find('.tag') + .each(($tag) => correctTags.push($tag.text().trim())) + .then(() => { + cy.get('.summary-chart') + .eq(1) + .find('.summary-chart__title--tags') + .find('.tag') + .each(($tag) => { + expect(correctTags).to.include($tag.text().trim()); + }); + + cy.get('.summary-chart') + .eq(1) + .find('.summary-chart__title--tags') + .find('.tag') + .should('have.length', correctTags.length); + }); + }); + + it('group by none works with show tags', () => { + cy.get('div.mui-select.grouping > select:visible') + .select('groupByNone'); + + cy.get('#summary label.show-tags > input:visible') + .should('be.visible') + .check() + .should('be.checked'); + + cy.get('.icon-button.fa-list-ul') + .should('exist') + .first() + .click(); + + const correctTags = []; + + cy.get('.zoom__title--tags') + .find('.tag') + .each(($tag) => correctTags.push($tag.text().trim())) + .then(() => { + cy.get('.summary-chart') + .first() + .find('.summary-chart__title--tags') + .find('.tag') + .each(($tag) => { + expect(correctTags).to.include($tag.text().trim()); + }); + + cy.get('.summary-chart') + .first() + .find('.summary-chart__title--tags') + .find('.tag') + .should('have.length', correctTags.length); + }); + }); }); diff --git a/frontend/src/components/c-summary-charts.vue b/frontend/src/components/c-summary-charts.vue index c4a7f78307..437b23e5ea 100644 --- a/frontend/src/components/c-summary-charts.vue +++ b/frontend/src/components/c-summary-charts.vue @@ -980,7 +980,7 @@ export default defineComponent({ }, getTags(repo: Array, user?: User): Array { - if (user) repo = repo.filter((r) => r.name === user.name); + if (user) repo = repo.filter((r) => r.name === user.name && r.repoId === user.repoId); return [...new Set(repo.flatMap((r) => r.commits).flatMap((c) => c.commitResults).flatMap((r) => r.tags))] .filter(Boolean) as Array; },