From 2b8673941a8e81c5ac6d4ffb580a17870ceac2c5 Mon Sep 17 00:00:00 2001
From: Shefali Joshi <simplyrender@gmail.com>
Date: Fri, 11 Oct 2024 16:17:29 -0700
Subject: [PATCH] Don't persist current tab  when display is locked (#7882)

Check if a display is locked before saving current tab.

---------

Co-authored-by: Andrew Henry <akhenry@gmail.com>
---
 .../functional/plugins/tabs/tabs.e2e.spec.js  | 34 ++++++++++++++++++-
 e2e/tests/performance/tabs.perf.spec.js       |  2 +-
 src/plugins/tabs/components/TabsComponent.vue | 11 +++---
 src/ui/layout/BrowseBar.vue                   |  1 +
 4 files changed, 42 insertions(+), 6 deletions(-)

diff --git a/e2e/tests/functional/plugins/tabs/tabs.e2e.spec.js b/e2e/tests/functional/plugins/tabs/tabs.e2e.spec.js
index 8e9a3bb586..9a5349dc58 100644
--- a/e2e/tests/functional/plugins/tabs/tabs.e2e.spec.js
+++ b/e2e/tests/functional/plugins/tabs/tabs.e2e.spec.js
@@ -57,7 +57,7 @@ test.describe('Tabs View', () => {
     await page.goto(tabsView.url);
 
     // select first tab
-    await page.getByLabel(`${table.name} tab`, { exact: true }).click();
+    await page.getByLabel(`${table.name} tab - selected`, { exact: true }).click();
     // ensure table header visible
     await expect(page.getByRole('searchbox', { name: 'message filter input' })).toBeVisible();
 
@@ -92,6 +92,38 @@ test.describe('Tabs View', () => {
     // no canvas (i.e., sine wave generator) in the document should be visible
     await expect(page.locator('canvas[id=webglContext]')).toBeHidden();
   });
+
+  test('Changing the displayed tab should not be persisted if the view is locked', async ({
+    page
+  }) => {
+    await page.goto(tabsView.url);
+    //lock the view
+    await page.getByLabel('Unlocked for editing, click to lock.', { exact: true }).click();
+    // get the initial tab index
+    const initialTab = page.getByLabel(/- selected/);
+    // switch to a different tab in the view
+    const swgTab = page.getByLabel(`${sineWaveGenerator.name} tab`, { exact: true });
+    await swgTab.click();
+    await page.getByLabel(`${sineWaveGenerator.name} Object View`).isVisible();
+    // navigate away from the tabbed view and back
+    await page.getByRole('treeitem', { name: 'My Items' }).click();
+    await page.goto(tabsView.url);
+    // check that the initial tab is displayed
+    const lockedSelectedTab = page.getByLabel(/- selected/);
+    await expect(lockedSelectedTab).toHaveText(await initialTab.textContent());
+
+    //unlock the view
+    await page.getByLabel('Locked for editing. Click to unlock.', { exact: true }).click();
+    // switch to a different tab in the view
+    await swgTab.click();
+    await page.getByLabel(`${sineWaveGenerator.name} Object View`).isVisible();
+    // navigate away from the tabbed view and back
+    await page.getByRole('treeitem', { name: 'My Items' }).click();
+    await page.goto(tabsView.url);
+    // check that the newly selected tab is displayed
+    const unlockedSelectedTab = page.getByLabel(/- selected/);
+    await expect(unlockedSelectedTab).toBeVisible();
+  });
 });
 
 test.describe('Tabs View CRUD', () => {
diff --git a/e2e/tests/performance/tabs.perf.spec.js b/e2e/tests/performance/tabs.perf.spec.js
index 6141bf61ee..e9655a45e9 100644
--- a/e2e/tests/performance/tabs.perf.spec.js
+++ b/e2e/tests/performance/tabs.perf.spec.js
@@ -64,7 +64,7 @@ test.describe('Tabs View', () => {
     page.goto(tabsView.url);
 
     // select first tab
-    await page.getByLabel(`${table.name} tab`, { exact: true }).click();
+    await page.getByLabel(`${table.name} tab - selected`, { exact: true }).click();
     // ensure table header visible
     await expect(page.getByRole('searchbox', { name: 'message filter input' })).toBeVisible();
 
diff --git a/src/plugins/tabs/components/TabsComponent.vue b/src/plugins/tabs/components/TabsComponent.vue
index 722f8950ad..38dd560c10 100644
--- a/src/plugins/tabs/components/TabsComponent.vue
+++ b/src/plugins/tabs/components/TabsComponent.vue
@@ -38,11 +38,11 @@
         v-for="(tab, index) in tabsList"
         :ref="tab.keyString"
         :key="tab.keyString"
-        :aria-label="`${tab.domainObject.name} tab`"
+        :aria-label="`${tab.domainObject.name} tab${tab.keyString === currentTab.keyString ? ' - selected' : ''}`"
         class="c-tab c-tabs-view__tab js-tab"
         role="tab"
         :class="{
-          'is-current': isCurrent(tab)
+          'is-current': tab.keyString === currentTab.keyString
         }"
         @click="showTab(tab, index)"
         @mouseover.ctrl="showToolTip(tab)"
@@ -74,7 +74,7 @@
       :key="tab.keyString"
       :style="getTabStyles(tab)"
       class="c-tabs-view__object-holder"
-      :class="{ 'c-tabs-view__object-holder--hidden': !isCurrent(tab) }"
+      :class="{ 'c-tabs-view__object-holder--hidden': tab.keyString !== currentTab.keyString }"
     >
       <ObjectView
         v-if="shouldLoadTab(tab)"
@@ -353,7 +353,10 @@ export default {
       this.internalDomainObject = domainObject;
     },
     persistCurrentTabIndex(index) {
-      this.openmct.objects.mutate(this.internalDomainObject, 'currentTabIndex', index);
+      //only persist if the domain object is not locked. The object mutate API will deal with whether the object is persistable or not.
+      if (!this.internalDomainObject.locked) {
+        this.openmct.objects.mutate(this.internalDomainObject, 'currentTabIndex', index);
+      }
     },
     storeCurrentTabIndexInURL(index) {
       let currentTabIndexInURL = this.openmct.router.getSearchParam(this.searchTabKey);
diff --git a/src/ui/layout/BrowseBar.vue b/src/ui/layout/BrowseBar.vue
index f9ea214732..088f60e01c 100644
--- a/src/ui/layout/BrowseBar.vue
+++ b/src/ui/layout/BrowseBar.vue
@@ -24,6 +24,7 @@
     <div class="l-browse-bar__start">
       <button
         v-if="hasParent"
+        aria-label="Navigate up to parent"
         class="l-browse-bar__nav-to-parent-button c-icon-button c-icon-button--major icon-arrow-nav-to-parent"
         title="Navigate up to parent"
         @click="goToParent"