[#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

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

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,19 +31,19 @@ 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()
  .should('be.visible')
  .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,15 +62,15 @@ 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) => {
  // calculate the percentage of the width relative to the parent container
  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);
  });
  });
  });

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();

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);
+ });
+ });
 });

frontend/src/components/c-summary-charts.vue

@@ -980,7 +980,7 @@ export default defineComponent({
  },
 
  getTags(repo: Array<User>, user?: User): Array<string> {
- 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<string>;
  },