diff --git a/e2e/tests/functional/tooltips.e2e.spec.js b/e2e/tests/functional/tooltips.e2e.spec.js index dffe60c109..2bc7de906f 100644 --- a/e2e/tests/functional/tooltips.e2e.spec.js +++ b/e2e/tests/functional/tooltips.e2e.spec.js @@ -48,7 +48,7 @@ test.describe('Verify tooltips', () => { const swg2Path = 'My Items / Folder Foo / Folder Bar / SWG 2'; const swg3Path = 'My Items / Folder Foo / Folder Bar / Folder Baz / SWG 3'; - test.beforeEach(async ({ page, openmctConfig }) => { + test.beforeEach(async ({ page }) => { await page.goto('./', { waitUntil: 'domcontentloaded' }); folder1 = await createDomainObjectWithDefaults(page, { @@ -102,21 +102,22 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.c-lad-table-wrapper'); await page.dragAndDrop(`text=${sineWaveObject2.name}`, '.c-lad-table-wrapper'); await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.c-lad-table-wrapper'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); - async function getToolTip(object) { - await page.locator('.c-create-button').hover(); + async function getToolTipFromCell(object) { + //I'm not exactly sure why this create hover is necessary + await page.getByRole('button', { name: 'Create' }).hover(); await page.getByRole('cell', { name: object.name }).hover(); - let tooltipText = await page.locator('.c-tooltip').innerText(); + let tooltipText = await page.getByRole().innerText(); return tooltipText.replace('\n', '').trim(); } - expect(await getToolTip(sineWaveObject1)).toBe(sineWaveObject1.path); - expect(await getToolTip(sineWaveObject2)).toBe(sineWaveObject2.path); - expect(await getToolTip(sineWaveObject3)).toBe(sineWaveObject3.path); + expect(await getToolTipFromCell(sineWaveObject1)).toBe(sineWaveObject1.path); + expect(await getToolTipFromCell(sineWaveObject2)).toBe(sineWaveObject2.path); + expect(await getToolTipFromCell(sineWaveObject3)).toBe(sineWaveObject3.path); }); test('display correct paths for expanded and collapsed plot legend items', async ({ page }) => { @@ -132,7 +133,7 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.gl-plot'); await page.dragAndDrop(`text=${sineWaveObject2.name}`, '.gl-plot'); await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.gl-plot'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); @@ -199,7 +200,7 @@ test.describe('Verify tooltips', () => { // Edit Overlay Plot await page.getByLabel('Edit Object').click(); await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.gl-plot'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); // Create Stacked Plot @@ -210,7 +211,7 @@ test.describe('Verify tooltips', () => { // Edit Stacked Plot await page.getByLabel('Edit Object').click(); await page.dragAndDrop(`text=${sineWaveObject2.name}`, '.c-plot--stacked.holder'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); // Create Display Layout @@ -230,7 +231,7 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.l-layout__grid-holder', { targetPosition: { x: 500, y: 200 } }); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); @@ -268,7 +269,7 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.c-fl__container >> nth=0'); await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.c-fl__container >> nth=1'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); @@ -292,19 +293,16 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.c-tabs-view__tabs-holder'); await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.c-tabs-view__tabs-holder'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); await page.getByText('SWG 1').nth(2).hover(); - let tooltipText = await page.locator('.c-tooltip').innerText(); - tooltipText = tooltipText.replace('\n', '').trim(); - expect(tooltipText).toBe(sineWaveObject1.path); + + expect(page.locator('.c-tooltip')).toHaveText(sineWaveObject1.path); await page.getByText('SWG 3').nth(2).hover(); - tooltipText = await page.locator('.c-tooltip').innerText(); - tooltipText = tooltipText.replace('\n', '').trim(); - expect(tooltipText).toBe(sineWaveObject3.path); + expect(page.locator('.c-tooltip')).toHaveText(sineWaveObject3.path); }); test('display correct paths when hovering tree items', async ({ page }) => { @@ -381,7 +379,7 @@ test.describe('Verify tooltips', () => { await page.dragAndDrop(`text=${sineWaveObject1.name}`, '.c-telemetry-table'); await page.dragAndDrop(`text=${sineWaveObject3.name}`, '.c-telemetry-table'); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); @@ -445,7 +443,7 @@ test.describe('Verify tooltips', () => { `text=${sineWaveObject3.name}`, '.c-object-view.is-object-type-time-strip' ); - await page.locator('button[title="Save"]').click(); + await page.getByRole('button', { name: 'Save' }).click(); await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click(); await page.keyboard.down('Control'); diff --git a/e2e/tests/functional/tree.e2e.spec.js b/e2e/tests/functional/tree.e2e.spec.js index 64106f275d..034ccd1f5e 100644 --- a/e2e/tests/functional/tree.e2e.spec.js +++ b/e2e/tests/functional/tree.e2e.spec.js @@ -112,7 +112,7 @@ test.describe('Main Tree', () => { .getByRole('treeitem', { name: page1Folder.name }) ).toBeVisible(); }); - + // eslint-disable-next-line playwright/expect-expect test('Renaming an object reorders the tree @unstable', async ({ page, openmctConfig }) => { const { myItemsFolderName } = openmctConfig; diff --git a/e2e/tests/mobile/smoke.e2e.spec.js b/e2e/tests/mobile/smoke.e2e.spec.js index cd0ad707a4..dc26f72d6f 100644 --- a/e2e/tests/mobile/smoke.e2e.spec.js +++ b/e2e/tests/mobile/smoke.e2e.spec.js @@ -82,14 +82,14 @@ test.describe('Smoke tests for @mobile', () => { await page.getByTitle('Collapse Browse Pane').click(); await expect(page.getByRole('main').getByText('Parent Display Layout')).toBeVisible(); //Verify both objects are in view - await expect(await page.getByLabel('Child Layout 1 Layout')).toBeVisible(); - await expect(await page.getByLabel('Child Layout 2 Layout')).toBeVisible(); + await expect(page.getByLabel('Child Layout 1 Layout')).toBeVisible(); + await expect(page.getByLabel('Child Layout 2 Layout')).toBeVisible(); //Remove First Object to bring up confirmation dialog await page.getByLabel('View menu items').nth(1).click(); await page.getByLabel('Remove').click(); await page.getByRole('button', { name: 'OK' }).click(); //Verify that the object is removed - await expect(await page.getByLabel('Child Layout 1 Layout')).toBeVisible(); + await expect(page.getByLabel('Child Layout 1 Layout')).toBeVisible(); expect(await page.getByLabel('Child Layout 2 Layout').count()).toBe(0); }); }); diff --git a/src/api/tooltips/components/TooltipComponent.vue b/src/api/tooltips/components/TooltipComponent.vue index 48c1c74dcf..1eea954989 100644 --- a/src/api/tooltips/components/TooltipComponent.vue +++ b/src/api/tooltips/components/TooltipComponent.vue @@ -20,7 +20,13 @@ this source code distribution or the Licensing information page available at runtime from the About dialog for additional information. -->