From 3e23dceb64b04c348ca2585e4b4fdd5faed75e4b Mon Sep 17 00:00:00 2001 From: Shefali Joshi Date: Thu, 17 Oct 2024 14:24:26 -0700 Subject: [PATCH] fix(#7892): restore "now" (marcus bains) line to planning views (#7898) * Initialize alignment offset to 0. (it was undefined). Also handle a small bug with swimlane configuration not getting replaced when the plan used by a gantt chart was changed * lint: fix * test: update visual tests to mock clock and show now line --------- Co-authored-by: Mazzella, Jesse D. (ARC-TI)[KBR Wyle Services, LLC] --- e2e/helper/planningUtils.js | 3 +++ e2e/tests/visual-a11y/planning-gantt.visual.spec.js | 13 ++++++++++++- .../visual-a11y/planning-timestrip.visual.spec.js | 9 ++++++++- e2e/tests/visual-a11y/planning-view.visual.spec.js | 6 ++++++ src/plugins/plan/components/PlanView.vue | 1 + src/ui/components/TimeSystemAxis.vue | 2 ++ 6 files changed, 32 insertions(+), 2 deletions(-) diff --git a/e2e/helper/planningUtils.js b/e2e/helper/planningUtils.js index 43988532f3..2e1d8a8a70 100644 --- a/e2e/helper/planningUtils.js +++ b/e2e/helper/planningUtils.js @@ -129,6 +129,7 @@ export async function setBoundsToSpanAllActivities(page, planJson, planObjectUrl */ export function getEarliestStartTime(planJson) { const activities = Object.values(planJson).flat(); + return Math.min(...activities.map((activity) => activity.start)); } @@ -139,6 +140,7 @@ export function getEarliestStartTime(planJson) { */ export function getLatestEndTime(planJson) { const activities = Object.values(planJson).flat(); + return Math.max(...activities.map((activity) => activity.end)); } @@ -151,6 +153,7 @@ export function getFirstActivity(planJson) { const groups = Object.keys(planJson); const firstGroupKey = groups[0]; const firstGroupItems = planJson[firstGroupKey]; + return firstGroupItems[0]; } diff --git a/e2e/tests/visual-a11y/planning-gantt.visual.spec.js b/e2e/tests/visual-a11y/planning-gantt.visual.spec.js index f41cfa23fd..7af9942404 100644 --- a/e2e/tests/visual-a11y/planning-gantt.visual.spec.js +++ b/e2e/tests/visual-a11y/planning-gantt.visual.spec.js @@ -26,14 +26,25 @@ import fs from 'fs'; import { createDomainObjectWithDefaults, createPlanFromJSON } from '../../appActions.js'; import { scanForA11yViolations, test } from '../../avpFixtures.js'; import { VISUAL_FIXED_URL } from '../../constants.js'; -import { setBoundsToSpanAllActivities, setDraftStatusForPlan } from '../../helper/planningUtils.js'; +import { + getFirstActivity, + setBoundsToSpanAllActivities, + setDraftStatusForPlan +} from '../../helper/planningUtils.js'; const examplePlanSmall2 = JSON.parse( fs.readFileSync(new URL('../../test-data/examplePlans/ExamplePlan_Small2.json', import.meta.url)) ); +const FIRST_ACTIVITY_SMALL_2 = getFirstActivity(examplePlanSmall2); + test.describe('Visual - Gantt Chart @a11y', () => { test.beforeEach(async ({ page }) => { + // Set the clock to the end of the first activity in the plan + // This is so we can see the "now" line in the plan view + await page.clock.install({ time: FIRST_ACTIVITY_SMALL_2.end + 10000 }); + await page.clock.resume(); + await page.goto(VISUAL_FIXED_URL, { waitUntil: 'domcontentloaded' }); }); test('Gantt Chart View', async ({ page, theme }) => { diff --git a/e2e/tests/visual-a11y/planning-timestrip.visual.spec.js b/e2e/tests/visual-a11y/planning-timestrip.visual.spec.js index f0a6c9a90c..2ea1e25478 100644 --- a/e2e/tests/visual-a11y/planning-timestrip.visual.spec.js +++ b/e2e/tests/visual-a11y/planning-timestrip.visual.spec.js @@ -27,14 +27,21 @@ import { createDomainObjectWithDefaults, createPlanFromJSON } from '../../appAct import { scanForA11yViolations, test } from '../../avpFixtures.js'; import { waitForAnimations } from '../../baseFixtures.js'; import { VISUAL_FIXED_URL } from '../../constants.js'; -import { setBoundsToSpanAllActivities } from '../../helper/planningUtils.js'; +import { getFirstActivity, setBoundsToSpanAllActivities } from '../../helper/planningUtils.js'; const examplePlanSmall2 = JSON.parse( fs.readFileSync(new URL('../../test-data/examplePlans/ExamplePlan_Small2.json', import.meta.url)) ); +const FIRST_ACTIVITY_SMALL_2 = getFirstActivity(examplePlanSmall2); + test.describe('Visual - Time Strip @a11y', () => { test.beforeEach(async ({ page }) => { + // Set the clock to the end of the first activity in the plan + // This is so we can see the "now" line in the plan view + await page.clock.install({ time: FIRST_ACTIVITY_SMALL_2.end + 10000 }); + await page.clock.resume(); + await page.goto(VISUAL_FIXED_URL, { waitUntil: 'domcontentloaded' }); }); test('Time Strip View', async ({ page, theme }) => { diff --git a/e2e/tests/visual-a11y/planning-view.visual.spec.js b/e2e/tests/visual-a11y/planning-view.visual.spec.js index 7ca1200c03..6386f0cca4 100644 --- a/e2e/tests/visual-a11y/planning-view.visual.spec.js +++ b/e2e/tests/visual-a11y/planning-view.visual.spec.js @@ -42,6 +42,7 @@ const examplePlanSmall2 = JSON.parse( ); const FIRST_ACTIVITY_SMALL_1 = getFirstActivity(examplePlanSmall1); +const FIRST_ACTIVITY_SMALL_2 = getFirstActivity(examplePlanSmall2); test.describe('Visual - Timelist progress bar @clock @a11y', () => { test.beforeEach(async ({ page }) => { @@ -59,6 +60,11 @@ test.describe('Visual - Timelist progress bar @clock @a11y', () => { test.describe('Visual - Plan View @a11y', () => { test.beforeEach(async ({ page }) => { + // Set the clock to the end of the first activity in the plan + // This is so we can see the "now" line in the plan view + await page.clock.install({ time: FIRST_ACTIVITY_SMALL_2.end + 10000 }); + await page.clock.resume(); + await page.goto(VISUAL_FIXED_URL, { waitUntil: 'domcontentloaded' }); }); diff --git a/src/plugins/plan/components/PlanView.vue b/src/plugins/plan/components/PlanView.vue index f54082b895..fab47328b1 100644 --- a/src/plugins/plan/components/PlanView.vue +++ b/src/plugins/plan/components/PlanView.vue @@ -248,6 +248,7 @@ export default { } }, handleConfigurationChange(newConfiguration) { + this.configuration = this.planViewConfiguration.getConfiguration(); Object.keys(newConfiguration).forEach((key) => { this[key] = newConfiguration[key]; }); diff --git a/src/ui/components/TimeSystemAxis.vue b/src/ui/components/TimeSystemAxis.vue index e86f27f43c..92014e54df 100644 --- a/src/ui/components/TimeSystemAxis.vue +++ b/src/ui/components/TimeSystemAxis.vue @@ -79,6 +79,7 @@ export default { const svgWidth = ref(0); const svgHeight = ref(0); const axisTransform = ref('translate(0,20)'); + const alignmentOffset = ref(0); const nowMarkerStyle = reactive({ height: '0px', left: '0px' @@ -100,6 +101,7 @@ export default { svgWidth, svgHeight, axisTransform, + alignmentOffset, nowMarkerStyle, openmct };