From 045b246610424cc3587912a759ee190a48e99a85 Mon Sep 17 00:00:00 2001 From: Pratham Jain Date: Mon, 9 Oct 2023 06:26:45 +0800 Subject: [PATCH 1/4] Dynamically position all tooltips --- frontend/src/components/c-summary-charts.vue | 109 ++++++++++++++----- frontend/src/mixin/dynamicTooltipMixin.ts | 19 ++++ frontend/src/views/c-authorship.vue | 37 +++---- frontend/src/views/c-zoom.vue | 10 +- 4 files changed, 125 insertions(+), 50 deletions(-) create mode 100644 frontend/src/mixin/dynamicTooltipMixin.ts diff --git a/frontend/src/components/c-summary-charts.vue b/frontend/src/components/c-summary-charts.vue index ea52675ddb..5569c73397 100644 --- a/frontend/src/components/c-summary-charts.vue +++ b/frontend/src/components/c-summary-charts.vue @@ -21,47 +21,64 @@ v-bind:class=" { warn: repo[0].name === '-' }" ) {{ getAuthorDisplayName(repo) }} ({{ repo[0].name }}) .summary-charts__title--contribution - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-total-contribution`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-total-contribution`)" + ) | [{{ getGroupTotalContribution(repo) }} lines] span.tooltip-text( v-if="filterGroupSelection === 'groupByRepos' && !isChartGroupWidgetMode" - ) Total contribution of group + )(v-bind:ref="`summary-charts-${i}-total-contribution`") Total contribution of group span.tooltip-text( v-else-if="filterGroupSelection === 'groupByAuthors' && !isChartGroupWidgetMode" - ) Total contribution of author + )(v-bind:ref="`summary-charts-${i}-total-contribution`") Total contribution of author a( v-if="!isGroupMerged(getGroupName(repo)) && !isChartGroupWidgetMode", v-on:click="handleMergeGroup(getGroupName(repo))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-merge-group`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-merge-group`)" + ) font-awesome-icon.icon-button(:icon="['fas', 'chevron-up']") - span.tooltip-text Click to merge group + span.tooltip-text(v-bind:ref="`summary-charts-${i}-merge-group`") Click to merge group a( v-if="isGroupMerged(getGroupName(repo)) && !isChartGroupWidgetMode", v-on:click="handleExpandGroup(getGroupName(repo))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-expand-group`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-expand-group`)" + ) font-awesome-icon.icon-button(:icon="['fas', 'chevron-down']") - span.tooltip-text Click to expand group + span.tooltip-text(v-bind:ref="`summary-charts-${i}-expand-group`") Click to expand group a( v-if="filterGroupSelection === 'groupByRepos'", v-bind:class="!isBrokenLink(getRepoLink(repo[0])) ? '' : 'broken-link'", v-bind:href="getRepoLink(repo[0])", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-repo-link`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-repo-link`)" + ) font-awesome-icon.icon-button(:icon="getRepoIcon(repo[0])") span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`summary-charts-${i}-repo-link`" ) {{getGroupRepoLinkMessage(repo[0])}} a( v-else-if="filterGroupSelection === 'groupByAuthors'", v-bind:class="!isBrokenLink(getAuthorProfileLink(repo[0], repo[0].name)) ? '' : 'broken-link'", v-bind:href="getAuthorProfileLink(repo[0], repo[0].name)", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-author-link`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-author-link`)" + ) font-awesome-icon.icon-button(icon="user") span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`summary-charts-${i}-author-link`" ) {{getAuthorProfileLinkMessage(repo[0])}} template(v-if="isGroupMerged(getGroupName(repo))") a( @@ -69,41 +86,54 @@ onclick="deactivateAllOverlays()", v-on:click="openTabAuthorship(repo[0], repo, 0, isGroupMerged(getGroupName(repo)))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-group-code`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-group-code`)" + ) font-awesome-icon.icon-button( icon="code", v-bind:class="{ 'active-icon': isSelectedTab(repo[0].name, repo[0].repoName, 'authorship', true) }" ) - span.tooltip-text Click to view group's code + span.tooltip-text(v-bind:ref="`summary-charts-${i}-group-code`") Click to view group's code a( v-if="!isChartGroupWidgetMode", onclick="deactivateAllOverlays()", v-on:click="openTabZoom(repo[0], filterSinceDate, filterUntilDate, isGroupMerged(getGroupName(repo)))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-commit-breakdown`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-commit-breakdown`)" + ) font-awesome-icon.icon-button( icon="list-ul", v-bind:class="{ 'active-icon': isSelectedTab(repo[0].name, repo[0].repoName, 'zoom', true) }" ) - span.tooltip-text Click to view breakdown of commits + span.tooltip-text(v-bind:ref="`summary-charts-${i}-commit-breakdown`") Click to view breakdown of commits a( v-if="isChartGroupWidgetMode && !isChartWidgetMode", v-bind:href="getReportLink()", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`summary-charts-${i}-commit-breakdown-group-widget`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-commit-breakdown-group-widget`)" + ) font-awesome-icon.icon-button( icon="arrow-up-right-from-square", ) span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`summary-charts-${i}-commit-breakdown-group-widget`" ) Click to view breakdown of commits on RepoSense a( v-if="!isChartGroupWidgetMode", v-on:click="getEmbeddedIframe(i)" ) - .tooltip(v-bind:id="'tooltip-' + i") + .tooltip(v-bind:id="'tooltip-' + i", + v-on:mouseover="onTooltipHover(`summary-charts-${i}-copy-iframe`)", + v-on:mouseout="resetTooltip(`summary-charts-${i}-copy-iframe`)" + ) font-awesome-icon.icon-button(icon="clipboard") - span.tooltip-text Click to copy iframe link for group + span.tooltip-text(v-bind:ref="`summary-charts-${i}-copy-iframe`") Click to copy iframe link for group .tooltip.summary-chart__title--percentile( v-if="sortGroupSelection.includes('totalCommits')" @@ -143,61 +173,87 @@ v-bind:class="!isBrokenLink(getRepoLink(user)) ? '' : 'broken-link'", v-bind:href="getRepoLink(user)", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-repo-link`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-repo-link`)" + ) font-awesome-icon.icon-button(:icon="getRepoIcon(repo[0])") span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`repo-${i}-author-${j}-repo-link`" ) {{getRepoLinkMessage(user)}} a( v-if="filterGroupSelection !== 'groupByAuthors'", v-bind:class="!isBrokenLink(getAuthorProfileLink(user, user.name)) ? '' : 'broken-link'", v-bind:href="getAuthorProfileLink(user, user.name)", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-author-link`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-author-link`)" + ) font-awesome-icon.icon-button(icon="user") span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`repo-${i}-author-${j}-author-link`" ) {{getAuthorProfileLinkMessage(user)}} a( v-if="!isChartGroupWidgetMode", onclick="deactivateAllOverlays()", v-on:click="openTabAuthorship(user, repo, j, isGroupMerged(getGroupName(repo)))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-author-contribution`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-author-contribution`)" + ) font-awesome-icon.icon-button( icon="code", v-bind:class="{ 'active-icon': isSelectedTab(user.name, user.repoName, 'authorship', false) }" ) - span.tooltip-text Click to view author's contribution. + span.tooltip-text( + v-bind:ref="`repo-${i}-author-${j}-author-contribution`" + ) Click to view author's contribution. a( v-if="!isChartGroupWidgetMode", onclick="deactivateAllOverlays()", v-on:click="openTabZoom(user, filterSinceDate, filterUntilDate, isGroupMerged(getGroupName(repo)))" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-commit-breakdown`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-commit-breakdown`)" + ) font-awesome-icon.icon-button( icon="list-ul", v-bind:class="{ 'active-icon': isSelectedTab(user.name, user.repoName, 'zoom', false) }" ) - span.tooltip-text Click to view breakdown of commits + span.tooltip-text( + v-bind:ref="`repo-${i}-author-${j}-commit-breakdown`" + ) Click to view breakdown of commits a( v-if="isChartGroupWidgetMode", v-bind:href="getReportLink()", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-commit-breakdown-group-widget`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-commit-breakdown-group-widget`)" + ) font-awesome-icon.icon-button( icon="arrow-up-right-from-square", ) span.tooltip-text( v-if="!isChartGroupWidgetMode", + v-bind:ref="`repo-${i}-author-${j}-commit-breakdown-group-widget`" ) Click to view breakdown of commits on RepoSense a( v-if="!isChartGroupWidgetMode", v-on:click="getEmbeddedIframe(i , j)" ) - .tooltip(v-bind:id="'tooltip-' + i + '-' + j") + .tooltip( + v-bind:id="'tooltip-' + i + '-' + j", + v-on:mouseover="onTooltipHover(`repo-${i}-author-${j}-iframe-link`)", + v-on:mouseout="resetTooltip(`repo-${i}-author-${j}-iframe-link`)" + ) font-awesome-icon.icon-button(icon="clipboard") - span.tooltip-text Click to copy iframe link + span.tooltip-text(v-bind:ref="`repo-${i}-author-${j}-iframe-link`") Click to copy iframe link .tooltip.summary-chart__title--percentile( v-if="filterGroupSelection === 'groupByNone' && sortGroupSelection.includes('totalCommits')" ) {{ getPercentile(j) }} %  @@ -239,6 +295,7 @@ import { defineComponent } from 'vue'; import { mapState } from 'vuex'; import brokenLinkDisabler from '../mixin/brokenLinkMixin'; +import tooltipPositioner from '../mixin/dynamicTooltipMixin'; import cRamp from './c-ramp.vue'; import cStackedBarChart from './c-stacked-bar-chart.vue'; import { Bar, Repo, User } from '../types/types'; @@ -252,7 +309,7 @@ export default defineComponent({ cRamp, cStackedBarChart, }, - mixins: [brokenLinkDisabler], + mixins: [brokenLinkDisabler, tooltipPositioner], props: { checkedFileTypes: { type: Array, diff --git a/frontend/src/mixin/dynamicTooltipMixin.ts b/frontend/src/mixin/dynamicTooltipMixin.ts new file mode 100644 index 0000000000..5d504c9f8f --- /dev/null +++ b/frontend/src/mixin/dynamicTooltipMixin.ts @@ -0,0 +1,19 @@ +import { defineComponent } from 'vue'; + +export default defineComponent({ + methods: { + onTooltipHover(refName: string): void { + const tooltipTextElement = (this.$refs[refName] as HTMLElement[])[0]; + if (this.isElementAboveViewport(tooltipTextElement)) { + tooltipTextElement.classList.add('bottom-aligned'); + } + }, + resetTooltip(refName: string): void { + const tooltipTextElement = (this.$refs[refName] as HTMLElement[])[0]; + tooltipTextElement.classList.remove('bottom-aligned'); + }, + isElementAboveViewport(el: Element): boolean { + return el.getBoundingClientRect().top <= 0; + }, + }, +}); diff --git a/frontend/src/views/c-authorship.vue b/frontend/src/views/c-authorship.vue index 3bba9eb22e..9911831d72 100644 --- a/frontend/src/views/c-authorship.vue +++ b/frontend/src/views/c-authorship.vue @@ -148,18 +148,28 @@ v-bind:class="!isBrokenLink(getHistoryLink(file)) ? '' : 'broken-link'", v-bind:href="getHistoryLink(file)", target="_blank" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`${file.path}-view-history-tooltip`)", + v-on:mouseout="resetTooltip(`${file.path}-view-history-tooltip`)" + ) font-awesome-icon.button(icon="history") - span.tooltip-text {{getLinkMessage(getHistoryLink(file), 'Click to view the history view of file')}} + span.tooltip-text( + v-bind:ref="`${file.path}-view-history-tooltip`" + ) {{getLinkMessage(getHistoryLink(file), 'Click to view the history view of file')}} a( v-if='!file.isBinary', v-bind:class="!isBrokenLink(getBlameLink(file)) ? '' : 'broken-link'", v-bind:href="getBlameLink(file)", target="_blank", title="click to view the blame view of file" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`${file.path}-view-blame-tooltip`)", + v-on:mouseout="resetTooltip(`${file.path}-view-blame-tooltip`)" + ) font-awesome-icon.button(icon="user-edit") - span.tooltip-text {{getLinkMessage(getBlameLink(file), 'Click to view the blame view of file')}} + span.tooltip-text( + v-bind:ref="`${file.path}-view-blame-tooltip`" + ) {{getLinkMessage(getBlameLink(file), 'Click to view the blame view of file')}} .author-breakdown(v-if="info.isMergeGroup") .author-breakdown__legend( v-for="author in getAuthors(file)", @@ -186,6 +196,7 @@ import { defineComponent } from 'vue'; import { mapState } from 'vuex'; import minimatch from 'minimatch'; import brokenLinkDisabler from '../mixin/brokenLinkMixin'; +import tooltipPositioner from '../mixin/dynamicTooltipMixin'; import cSegmentCollection from '../components/c-segment-collection.vue'; import Segment from '../utils/segment'; import getNonRepeatingColor from '../utils/random-color-generator'; @@ -229,7 +240,7 @@ export default defineComponent({ components: { cSegmentCollection, }, - mixins: [brokenLinkDisabler], + mixins: [brokenLinkDisabler, tooltipPositioner], emits: [ 'deactivate-tab', ], @@ -488,22 +499,6 @@ export default defineComponent({ } }, - onTooltipHover(refName: string): void { - const tooltipTextElement = (this.$refs[refName] as HTMLElement[])[0]; - if (this.isElementAboveViewport(tooltipTextElement)) { - tooltipTextElement.classList.add('bottom-aligned'); - } - }, - - resetTooltip(refName: string): void { - const tooltipTextElement = (this.$refs[refName] as HTMLElement[])[0]; - tooltipTextElement.classList.remove('bottom-aligned'); - }, - - isElementAboveViewport(el: Element): boolean { - return el.getBoundingClientRect().top <= 0; - }, - isUnknownAuthor(name: string): boolean { return name === '-'; }, diff --git a/frontend/src/views/c-zoom.vue b/frontend/src/views/c-zoom.vue index ec8ee458c0..53d22c6243 100644 --- a/frontend/src/views/c-zoom.vue +++ b/frontend/src/views/c-zoom.vue @@ -126,9 +126,12 @@ v-if="slice.messageBody !== ''", v-on:click="toggleSelectedCommitMessageBody(slice)" ) - .tooltip + .tooltip( + v-on:mouseover="onTooltipHover(`${slice.hash}-show-hide-message-body`)", + v-on:mouseout="resetTooltip(`${slice.hash}-show-hide-message-body`)" + ) font-awesome-icon.commit-message--button(icon="ellipsis-h") - span.tooltip-text Click to show/hide the commit message body + span.tooltip-text(v-bind:ref="`${slice.hash}-show-hide-message-body`") Click to show/hide the commit message body .body(v-if="slice.messageBody !== ''", v-show="slice.isOpen") pre {{ slice.messageBody }} .dashed-border @@ -145,6 +148,7 @@ import { defineComponent } from 'vue'; import { mapState } from 'vuex'; import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import brokenLinkDisabler from '../mixin/brokenLinkMixin'; +import tooltipPositioner from '../mixin/dynamicTooltipMixin'; import cRamp from '../components/c-ramp.vue'; import cStackedBarChart from '../components/c-stacked-bar-chart.vue'; import User from '../utils/user'; @@ -177,7 +181,7 @@ export default defineComponent({ cRamp, cStackedBarChart, }, - mixins: [brokenLinkDisabler], + mixins: [brokenLinkDisabler, tooltipPositioner], data() { return { ...zoomInitialState(), From 5ded7b2ec79f23e2e0cc22cc10f59e529c3000c2 Mon Sep 17 00:00:00 2001 From: Pratham Jain Date: Mon, 9 Oct 2023 06:56:24 +0800 Subject: [PATCH 2/4] Fix style error --- frontend/src/views/c-zoom.vue | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/frontend/src/views/c-zoom.vue b/frontend/src/views/c-zoom.vue index 53d22c6243..08509740b4 100644 --- a/frontend/src/views/c-zoom.vue +++ b/frontend/src/views/c-zoom.vue @@ -131,7 +131,9 @@ v-on:mouseout="resetTooltip(`${slice.hash}-show-hide-message-body`)" ) font-awesome-icon.commit-message--button(icon="ellipsis-h") - span.tooltip-text(v-bind:ref="`${slice.hash}-show-hide-message-body`") Click to show/hide the commit message body + span.tooltip-text( + v-bind:ref="`${slice.hash}-show-hide-message-body`" + ) Click to show/hide the commit message body .body(v-if="slice.messageBody !== ''", v-show="slice.isOpen") pre {{ slice.messageBody }} .dashed-border From c649aabd81204df85f568c55d358a9344f1c15c9 Mon Sep 17 00:00:00 2001 From: Pratham Jain Date: Tue, 10 Oct 2023 00:28:50 +0800 Subject: [PATCH 3/4] Fix z-index of tooltips --- frontend/src/styles/_z-indices.scss | 1 + frontend/src/styles/style.scss | 1 - frontend/src/views/c-authorship.vue | 37 ++++++++++++++++++++++------- 3 files changed, 29 insertions(+), 10 deletions(-) diff --git a/frontend/src/styles/_z-indices.scss b/frontend/src/styles/_z-indices.scss index aca88ed396..b918fe10b6 100644 --- a/frontend/src/styles/_z-indices.scss +++ b/frontend/src/styles/_z-indices.scss @@ -16,4 +16,5 @@ $z-indices: ( 'header': 100, 'loader': 10, 'tooltip': 100, + 'max-value': 250, ); diff --git a/frontend/src/styles/style.scss b/frontend/src/styles/style.scss index e3a6789c60..5cd38a53a7 100644 --- a/frontend/src/styles/style.scss +++ b/frontend/src/styles/style.scss @@ -107,7 +107,6 @@ a.broken-link { } &.bottom-aligned { - @include medium-font; bottom: auto; top: 125%; } diff --git a/frontend/src/views/c-authorship.vue b/frontend/src/views/c-authorship.vue index 9911831d72..9fe5082b4c 100644 --- a/frontend/src/views/c-authorship.vue +++ b/frontend/src/views/c-authorship.vue @@ -101,19 +101,22 @@ .empty(v-if="info.files.length === 0") nothing to see here :( template(v-for="(file, i) in selectedFiles", v-bind:key="file.path") .file(v-bind:ref="file.path") - .title(v-bind:class="{'sticky':\ file.active}") + .title( + v-bind:class="{'sticky':\ file.active}", + v-bind:ref="`${file.path}-title`" + ) span.caret(v-on:click="toggleFileActiveProperty(file)") .tooltip( v-show="file.active", - v-on:mouseover="onTooltipHover(`${file.path}-hide-file-tooltip`)", - v-on:mouseout="resetTooltip(`${file.path}-hide-file-tooltip`)" + v-on:mouseover="onTitleTooltipHover(`${file.path}-hide-file-tooltip`, `${file.path}-title`)", + v-on:mouseout="resetTitleTooltip(`${file.path}-hide-file-tooltip`, `${file.path}-title`)" ) font-awesome-icon(icon="caret-down", fixed-width) span.tooltip-text(v-bind:ref="`${file.path}-hide-file-tooltip`") Click to hide file details .tooltip( v-show="!file.active", - v-on:mouseover="onTooltipHover(`${file.path}-show-file-tooltip`)", - v-on:mouseout="resetTooltip(`${file.path}-show-file-tooltip`)" + v-on:mouseover="onTitleTooltipHover(`${file.path}-show-file-tooltip`, `${file.path}-title`)", + v-on:mouseout="resetTitleTooltip(`${file.path}-show-file-tooltip`, `${file.path}-title`)" ) font-awesome-icon(icon="caret-right", fixed-width) span.tooltip-text(v-bind:ref="`${file.path}-show-file-tooltip`") Click to show file details @@ -149,8 +152,8 @@ v-bind:href="getHistoryLink(file)", target="_blank" ) .tooltip( - v-on:mouseover="onTooltipHover(`${file.path}-view-history-tooltip`)", - v-on:mouseout="resetTooltip(`${file.path}-view-history-tooltip`)" + v-on:mouseover="onTitleTooltipHover(`${file.path}-view-history-tooltip`, `${file.path}-title`)", + v-on:mouseout="resetTitleTooltip(`${file.path}-view-history-tooltip`, `${file.path}-title`)" ) font-awesome-icon.button(icon="history") span.tooltip-text( @@ -163,8 +166,8 @@ title="click to view the blame view of file" ) .tooltip( - v-on:mouseover="onTooltipHover(`${file.path}-view-blame-tooltip`)", - v-on:mouseout="resetTooltip(`${file.path}-view-blame-tooltip`)" + v-on:mouseover="onTitleTooltipHover(`${file.path}-view-blame-tooltip`, `${file.path}-title`)", + v-on:mouseout="resetTitleTooltip(`${file.path}-view-blame-tooltip`, `${file.path}-title`)" ) font-awesome-icon.button(icon="user-edit") span.tooltip-text( @@ -499,6 +502,18 @@ export default defineComponent({ } }, + onTitleTooltipHover(tooltipTextElement: string, titleTextElement: string): void { + this.onTooltipHover(tooltipTextElement); + const titleElement = (this.$refs[titleTextElement] as HTMLElement[])[0]; + titleElement.classList.add('max-zIndex'); + }, + + resetTitleTooltip(tooltipTextElement: string, titleTextElement: string): void { + this.resetTooltip(tooltipTextElement); + const titleElement = (this.$refs[titleTextElement] as HTMLElement[])[0]; + titleElement.classList.remove('max-zIndex'); + }, + isUnknownAuthor(name: string): boolean { return name === '-'; }, @@ -882,6 +897,10 @@ export default defineComponent({ position: sticky; } + &.max-zIndex { + z-index: z-index('max-value'); + } + .caret { cursor: pointer; order: -2; From 5f51653734699db55fe45de319a43846dd02c48a Mon Sep 17 00:00:00 2001 From: Pratham Jain Date: Wed, 8 Nov 2023 04:26:24 +0800 Subject: [PATCH 4/4] Fix Cypress test --- .../cypress/tests/chartView/chartView_zoomFeature.cy.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/cypress/tests/chartView/chartView_zoomFeature.cy.js b/frontend/cypress/tests/chartView/chartView_zoomFeature.cy.js index 5915db587e..ac8599ef95 100644 --- a/frontend/cypress/tests/chartView/chartView_zoomFeature.cy.js +++ b/frontend/cypress/tests/chartView/chartView_zoomFeature.cy.js @@ -281,7 +281,7 @@ describe('range changes in chartview should reflect in zoom', () => { .get('#summary-charts .summary-chart__ramp .ramp') .first() .click(120, 20) - .click(185, 20); + .click(170, 20); cy.get('#tab-zoom') .should('be.visible'); @@ -306,7 +306,7 @@ describe('range changes in chartview should reflect in zoom', () => { cy.get('body').type(zoomKey, { release: false }) .get('#summary-charts .summary-chart__ramp .ramp') .first() - .click(185, 20) + .click(170, 20) .click(250, 20); cy.get('#tab-zoom') @@ -333,7 +333,7 @@ describe('range changes in chartview should reflect in zoom', () => { cy.get('body').type(zoomKey, { release: false }) .get('#summary-charts .summary-chart__ramp .ramp') .first() - .click(185, 20) + .click(170, 20) .click(225, 20); cy.get('#tab-zoom')