Don't re-request historical data on ticks (#5701)

Don't rerequest telemetry on ticks.

.circleci/config.yml

@@ -2,11 +2,10 @@ version: 2.1
 executors:
   pw-focal-development:
     docker:
-      - image: mcr.microsoft.com/playwright:v1.25.2-focal
+      - image: mcr.microsoft.com/playwright:v1.23.0-focal
     environment:
       NODE_ENV: development # Needed to ensure 'dist' folder created and devDependencies installed
       PERCY_POSTINSTALL_BROWSER: 'true' # Needed to store the percy browser in cache deps
-      PERCY_LOGLEVEL: 'debug' # Enable DEBUG level logging for Percy (Issue: https://github.com/nasa/openmct/issues/5742)
 parameters:
   BUST_CACHE:
     description: "Set this with the CircleCI UI Trigger Workflow button (boolean = true) to bust the cache!"

.github/dependabot.yml

@@ -7,13 +7,12 @@ updates:
       interval: "daily"  
     open-pull-requests-limit: 10
     labels:
-      - "pr:e2e"
       - "type:maintenance"
       - "dependencies"
+      - "pr:e2e"
       - "pr:daveit"
+      - "pr:visual"
       - "pr:platform"
-    ignore:
-      - dependency-name: "@playwright/test" #we source the container instead of the dependency in CI
 
   - package-ecosystem: "github-actions"
     directory: "/"

.github/workflows/e2e-couchdb.yml

@@ -17,13 +17,12 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
-      - run : docker-compose -f src/plugins/persistence/couch/couchdb-compose.yaml up --detach
-      - run : sleep 3 # wait until CouchDB has started (TODO: there must be a better way)
-      - run : bash src/plugins/persistence/couch/setup-couchdb.sh
+      - run : docker-compose up -d -f src/plugins/persistence/couch/couchdb-compose.yaml
+      - run : sh src/plugins/persistence/couch/setup-couchdb.sh
       - uses: actions/setup-node@v3
         with:
           node-version: '16'
-      - run: npx playwright@1.25.2 install
+      - run: npx playwright@1.23.0 install
       - run: npm install
       - run: sh src/plugins/persistence/couch/replace-localstorage-with-couchdb-indexhtml.sh
       - run: npm run test:e2e:couchdb

.github/workflows/e2e-pr.yml

@@ -30,7 +30,7 @@ jobs:
       - uses: actions/setup-node@v3
         with:
           node-version: '16'
-      - run: npx playwright@1.25.2 install
+      - run: npx playwright@1.23.0 install
       - run: npx playwright install chrome-beta
       - run: npm install
       - run: npm run test:e2e:full

.gitignore

@@ -36,10 +36,6 @@ report.*.json
 test-results
 html-test-results
 
-# couchdb scripting artifacts
-src/plugins/persistence/couch/.env.local
-index.html.bak
-
 # codecov artifacts
 .nyc_output
 coverage

API.md

@@ -390,7 +390,7 @@ A telemetry object is a domain object with a telemetry property.  To take an exa
             {
                 "key": "value",
                 "name": "Value",
-                "unit": "kilograms",
+                "units": "kilograms",
                 "format": "float",
                 "min": 0,
                 "max": 100,
@@ -425,7 +425,7 @@ attribute      | type   | flags    | notes
 `name`         | string | optional | a human readable label for this field.  If omitted, defaults to `key`.
 `source`       | string | optional | identifies the property of a datum where this value is stored.  If omitted, defaults to `key`.
 `format`       | string | optional | a specific format identifier, mapping to a formatter.  If omitted, uses a default formatter.  For enumerations, use `enum`.  For timestamps, use `utc` if you are using utc dates, otherwise use a key mapping to your custom date format.  
-`unit`        | string | optional | the unit of this value, e.g. `km`, `seconds`, `parsecs`
+`units`        | string | optional | the units of this value, e.g. `km`, `seconds`, `parsecs`
 `min`          | number | optional | the minimum possible value of this measurement.  Will be used by plots, gauges, etc to automatically set a min value.
 `max`          | number | optional | the maximum possible value of this measurement.  Will be used by plots, gauges, etc to automatically set a max value.
 `enumerations` | array  | optional | for objects where `format` is `"enum"`, this array tracks all possible enumerations of the value.  Each entry in this array is an object, with a `value` property that is the numerical value of the enumeration, and a `string` property that is the text value of the enumeration.  ex: `{"value": 0, "string": "OFF"}`.  If you use an enumerations array, `min` and `max` will be set automatically for you.
@@ -1082,4 +1082,4 @@ View provider Example:
         return openmct.priority.HIGH;
     }
 }
-```
+```

e2e/README.md

@@ -23,23 +23,21 @@ If this is your first time ever using the Playwright framework, we recommend goi
 Once you've got an understanding of Playwright, you'll need a baseline understanding of Open MCT:
 
 1. Follow the steps [Building and Running Open MCT Locally](../README.md#building-and-running-open-mct-locally)
-2. Once you're serving Open MCT locally, create a 'Display Layout' object. Save it.
+2. Once you're serving Open MCT locally, create an Example Telemetry Object (e.g.: 'Sine Wave Generator')
 3. Create a 'Plot' Object (e.g.: 'Stacked Plot')
-4. Create an Example Telemetry Object (e.g.: 'Sine Wave Generator')
-5. Expand the Tree and note the hierarchy of objects which were created.
-6. Navigate to the Demo Display Layout Object to edit and modify the embedded plot.
-7. Modify the embedded plot with Telemetry Data.
+4. Expand the Tree on the left-hand nav and drag and drop the Example Telemetry Object into the Plot Object
+5. Create a 'Display Layout' object
+6. From the Tree, Drag the Plot object into the Display Layout
 
 What you've created is a display which mimics the display that a mission control operator might use to understand and model telemetry data.
 
 Recreate the steps above with Playwright's codegen tool:
 
-1. `npm run start` in a terminal window to serve Open MCT locally
-2. `npx @playwright/test install` to install playwright and dependencies
-3. Open another terminal window and start the Playwright codegen application `npx playwright codegen`
-4. Navigate the browser to `http://localhost:8080`
-5. Click the Create button and notice how your actions in the browser are being recorded in the Playwright Inspector
-6. Continue through the steps 2-6 above
+1. `npm run start` in a terminal window
+2. Open another terminal window and start the Playwright codegen application `npx playwright codegen`
+3. Navigate the browser to `http://localhost:8080`
+4. Click the Create button and notice how your actions in the browser are being recorded in the Playwright Inspector
+5. Continue through the steps 2-6 above
 
 What you've created is an automated test which mimics the creation of a mission control display.
 

e2e/appActions.js

@@ -45,8 +45,6 @@
  * @property {string} url the relative url to the object (for use with `page.goto()`)
  */
 
-const Buffer = require('buffer').Buffer;
-
 /**
  * This common function creates a domain object with the default options. It is the preferred way of creating objects
  * in the e2e suite when uninterested in properties of the objects themselves.
@@ -102,59 +100,6 @@ async function createDomainObjectWithDefaults(page, { type, name, parent = 'mine
     };
 }
 
-/**
- * Create a Plan object from JSON with the provided options.
- * @param {import('@playwright/test').Page} page
- * @param {*} options
- * @returns {Promise<CreatedObjectInfo>} An object containing information about the newly created domain object.
- */
-async function createPlanFromJSON(page, { name, json, parent = 'mine' }) {
-    const parentUrl = await getHashUrlToDomainObject(page, parent);
-
-    // Navigate to the parent object. This is necessary to create the object
-    // in the correct location, such as a folder, layout, or plot.
-    await page.goto(`${parentUrl}?hideTree=true`);
-
-    //Click the Create button
-    await page.click('button:has-text("Create")');
-
-    // Click 'Plan' menu option
-    await page.click(`li:text("Plan")`);
-
-    // Modify the name input field of the domain object to accept 'name'
-    if (name) {
-        const nameInput = page.locator('form[name="mctForm"] .first input[type="text"]');
-        await nameInput.fill("");
-        await nameInput.fill(name);
-    }
-
-    // Upload buffer from memory
-    await page.locator('input#fileElem').setInputFiles({
-        name: 'plan.txt',
-        mimeType: 'text/plain',
-        buffer: Buffer.from(JSON.stringify(json))
-    });
-
-    // Click OK button and wait for Navigate event
-    await Promise.all([
-        page.waitForLoadState(),
-        page.click('[aria-label="Save"]'),
-        // Wait for Save Banner to appear
-        page.waitForSelector('.c-message-banner__message')
-    ]);
-
-    // Wait until the URL is updated
-    await page.waitForURL(`**/mine/*`);
-    const uuid = await getFocusedObjectUuid(page);
-    const objectUrl = await getHashUrlToDomainObject(page, uuid);
-
-    return {
-        uuid,
-        name,
-        url: objectUrl
-    };
-}
-
 /**
 * Open the given `domainObject`'s context menu from the object tree.
 * Expands the path to the object and scrolls to it if necessary.
@@ -313,7 +258,6 @@ async function setEndOffset(page, offset) {
 // eslint-disable-next-line no-undef
 module.exports = {
     createDomainObjectWithDefaults,
-    createPlanFromJSON,
     openObjectTreeContextMenu,
     getHashUrlToDomainObject,
     getFocusedObjectUuid,

e2e/playwright-visual.config.js

@@ -7,8 +7,8 @@ const config = {
     retries: 0, // visual tests should never retry due to snapshot comparison errors
     testDir: 'tests/visual',
     testMatch: '**/*.visual.spec.js', // only run visual tests
-    timeout: 90 * 1000,
-    workers: 1, //Limit to 1 for CircleCI Agent
+    timeout: 60 * 1000,
+    workers: 2, //Limit to 2 for CircleCI Agent
     webServer: {
         command: 'cross-env NODE_ENV=test npm run start',
         url: 'http://localhost:8080/#',

e2e/tests/functional/example/generator/sineWaveLimitProvider.e2e.spec.js

@@ -28,8 +28,7 @@ const { test, expect } = require('../../../../baseFixtures');
 
 test.describe('Sine Wave Generator', () => {
     test('Create new Sine Wave Generator Object and validate create Form Logic', async ({ page, browserName }) => {
-        // eslint-disable-next-line playwright/no-skipped-test
-        test.skip(browserName === 'firefox', 'This test needs to be updated to work with firefox');
+        test.fixme(browserName === 'firefox', 'This test needs to be updated to work with firefox');
 
         //Go to baseURL
         await page.goto('./', { waitUntil: 'networkidle' });

e2e/tests/functional/menu.e2e.spec.js

@@ -42,7 +42,7 @@ test.describe('Persistence operations @addInit', () => {
             button: 'right'
         });
 
-        const menuOptions = page.locator('.c-menu li');
+        const menuOptions = page.locator('.c-menu ul');
 
         await expect.soft(menuOptions).toContainText(['Open In New Tab', 'View', 'Create Link']);
         await expect(menuOptions).not.toContainText(['Move', 'Duplicate', 'Remove', 'Add New Folder', 'Edit Properties...', 'Export as JSON', 'Import from JSON']);

e2e/tests/functional/planning/plan.e2e.spec.js

@@ -1,87 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2022, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-const { test, expect } = require('../../../pluginFixtures');
-const { createPlanFromJSON } = require('../../../appActions');
-
-const testPlan = {
-    "TEST_GROUP": [
-        {
-            "name": "Past event 1",
-            "start": 1660320408000,
-            "end": 1660343797000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 2",
-            "start": 1660406808000,
-            "end": 1660429160000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 3",
-            "start": 1660493208000,
-            "end": 1660503981000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 4",
-            "start": 1660579608000,
-            "end": 1660624108000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 5",
-            "start": 1660666008000,
-            "end": 1660681529000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        }
-    ]
-};
-
-test.describe("Plan", () => {
-    test("Create a Plan and display all plan events @unstable", async ({ page }) => {
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        const plan = await createPlanFromJSON(page, {
-            name: 'Test Plan',
-            json: testPlan
-        });
-        const startBound = testPlan.TEST_GROUP[0].start;
-        const endBound = testPlan.TEST_GROUP[testPlan.TEST_GROUP.length - 1].end;
-
-        // Switch to fixed time mode with all plan events within the bounds
-        await page.goto(`${plan.url}?tc.mode=fixed&tc.startBound=${startBound}&tc.endBound=${endBound}&tc.timeSystem=utc&view=plan.view`);
-        const eventCount = await page.locator('.activity-bounds').count();
-        expect(eventCount).toEqual(testPlan.TEST_GROUP.length);
-    });
-});
-

e2e/tests/functional/planning/timestrip.e2e.spec.js

@@ -1,181 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2022, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-const { test, expect } = require('../../../pluginFixtures');
-const { createDomainObjectWithDefaults, createPlanFromJSON } = require('../../../appActions');
-
-const testPlan = {
-    "TEST_GROUP": [
-        {
-            "name": "Past event 1",
-            "start": 1660320408000,
-            "end": 1660343797000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 2",
-            "start": 1660406808000,
-            "end": 1660429160000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 3",
-            "start": 1660493208000,
-            "end": 1660503981000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 4",
-            "start": 1660579608000,
-            "end": 1660624108000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        },
-        {
-            "name": "Past event 5",
-            "start": 1660666008000,
-            "end": 1660681529000,
-            "type": "TEST-GROUP",
-            "color": "orange",
-            "textColor": "white"
-        }
-    ]
-};
-
-test.describe("Time Strip", () => {
-    test("Create two Time Strips, add a single Plan to both, and verify they can have separate Indepdenent Time Contexts @unstable", async ({ page }) => {
-        test.info().annotations.push({
-            type: 'issue',
-            description: 'https://github.com/nasa/openmct/issues/5627'
-        });
-
-        // Constant locators
-        const independentTimeConductorInputs = page.locator('.l-shell__main-independent-time-conductor .c-input--datetime');
-        const activityBounds = page.locator('.activity-bounds');
-
-        // Goto baseURL
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        const timestrip = await test.step("Create a Time Strip", async () => {
-            const createdTimeStrip = await createDomainObjectWithDefaults(page, { type: 'Time Strip' });
-            const objectName = await page.locator('.l-browse-bar__object-name').innerText();
-            expect(objectName).toBe(createdTimeStrip.name);
-
-            return createdTimeStrip;
-        });
-
-        const plan = await test.step("Create a Plan and add it to the timestrip", async () => {
-            const createdPlan = await createPlanFromJSON(page, {
-                name: 'Test Plan',
-                json: testPlan
-            });
-
-            await page.goto(timestrip.url);
-            // Expand the tree to show the plan
-            await page.click("button[title='Show selected item in tree']");
-            await page.dragAndDrop(`role=treeitem[name=/${createdPlan.name}/]`, '.c-object-view');
-            await page.click("button[title='Save']");
-            await page.click("li[title='Save and Finish Editing']");
-            const startBound = testPlan.TEST_GROUP[0].start;
-            const endBound = testPlan.TEST_GROUP[testPlan.TEST_GROUP.length - 1].end;
-
-            // Switch to fixed time mode with all plan events within the bounds
-            await page.goto(`${timestrip.url}?tc.mode=fixed&tc.startBound=${startBound}&tc.endBound=${endBound}&tc.timeSystem=utc&view=time-strip.view`);
-
-            // Verify all events are displayed
-            const eventCount = await page.locator('.activity-bounds').count();
-            expect(eventCount).toEqual(testPlan.TEST_GROUP.length);
-
-            return createdPlan;
-        });
-
-        await test.step("TimeStrip can use the Independent Time Conductor", async () => {
-            // Activate Independent Time Conductor in Fixed Time Mode
-            await page.click('.c-toggle-switch__slider');
-            expect(await activityBounds.count()).toEqual(0);
-
-            // Set the independent time bounds so that only one event is shown
-            const startBound = testPlan.TEST_GROUP[0].start;
-            const endBound = testPlan.TEST_GROUP[0].end;
-            const startBoundString = new Date(startBound).toISOString().replace('T', ' ');
-            const endBoundString = new Date(endBound).toISOString().replace('T', ' ');
-
-            await independentTimeConductorInputs.nth(0).fill('');
-            await independentTimeConductorInputs.nth(0).fill(startBoundString);
-            await page.keyboard.press('Enter');
-            await independentTimeConductorInputs.nth(1).fill('');
-            await independentTimeConductorInputs.nth(1).fill(endBoundString);
-            await page.keyboard.press('Enter');
-            expect(await activityBounds.count()).toEqual(1);
-        });
-
-        await test.step("Can have multiple TimeStrips with the same plan linked and different Independent Time Contexts", async () => {
-            // Create another Time Strip and verify that it has been created
-            const createdTimeStrip = await createDomainObjectWithDefaults(page, {
-                type: 'Time Strip',
-                name: "Another Time Strip"
-            });
-
-            const objectName = await page.locator('.l-browse-bar__object-name').innerText();
-            expect(objectName).toBe(createdTimeStrip.name);
-
-            // Drag the existing Plan onto the newly created Time Strip, and save.
-            await page.dragAndDrop(`role=treeitem[name=/${plan.name}/]`, '.c-object-view');
-            await page.click("button[title='Save']");
-            await page.click("li[title='Save and Finish Editing']");
-
-            // Activate Independent Time Conductor in Fixed Time Mode
-            await page.click('.c-toggle-switch__slider');
-
-            // All events should be displayed at this point because the
-            // initial independent context bounds will match the global bounds
-            expect(await activityBounds.count()).toEqual(5);
-
-            // Set the independent time bounds so that two events are shown
-            const startBound = testPlan.TEST_GROUP[0].start;
-            const endBound = testPlan.TEST_GROUP[1].end;
-            const startBoundString = new Date(startBound).toISOString().replace('T', ' ');
-            const endBoundString = new Date(endBound).toISOString().replace('T', ' ');
-
-            await independentTimeConductorInputs.nth(0).fill('');
-            await independentTimeConductorInputs.nth(0).fill(startBoundString);
-            await page.keyboard.press('Enter');
-            await independentTimeConductorInputs.nth(1).fill('');
-            await independentTimeConductorInputs.nth(1).fill(endBoundString);
-            await page.keyboard.press('Enter');
-
-            // Verify that two events are displayed
-            expect(await activityBounds.count()).toEqual(2);
-
-            // Switch to the previous Time Strip and verify that only one event is displayed
-            await page.goto(timestrip.url);
-            expect(await activityBounds.count()).toEqual(1);
-        });
-    });
-});

e2e/tests/functional/plugins/clocks/clock.e2e.spec.js

@@ -50,7 +50,7 @@ test.describe('Clock Generator CRUD Operations', () => {
         await page.locator('.icon-arrow-down').click();
 
         // Verify clicking on the autocomplete arrow collapses the dropdown
-        await expect(page.locator(".c-input--autocomplete__options")).toBeHidden();
+        await expect(page.locator(".c-input--autocomplete__options")).not.toBeVisible();
 
         // Click timezone input to open dropdown
         await page.locator('.c-input--autocomplete__input').click();
@@ -60,7 +60,7 @@ test.describe('Clock Generator CRUD Operations', () => {
         // Verify clicking outside the autocomplete dropdown collapses it
         await page.locator('text=Timezone').click();
         // Verify clicking on the autocomplete arrow collapses the dropdown
-        await expect(page.locator(".c-input--autocomplete__options")).toBeHidden();
+        await expect(page.locator(".c-input--autocomplete__options")).not.toBeVisible();
 
     });
 });

e2e/tests/functional/plugins/faultManagement/faultManagement.e2e.spec.js

@@ -28,14 +28,14 @@ test.describe('The Fault Management Plugin using example faults', () => {
         await utils.navigateToFaultManagementWithExample(page);
     });
 
-    test('Shows a criticality icon for every fault @unstable', async ({ page }) => {
+    test('Shows a criticality icon for every fault', async ({ page }) => {
         const faultCount = await page.locator('c-fault-mgmt__list').count();
         const criticalityIconCount = await page.locator('c-fault-mgmt__list-severity').count();
 
         expect.soft(faultCount).toEqual(criticalityIconCount);
     });
 
-    test('When selecting a fault, it has an "is-selected" class and it\'s information shows in the inspector @unstable', async ({ page }) => {
+    test('When selecting a fault, it has an "is-selected" class and it\'s information shows in the inspector', async ({ page }) => {
         await utils.selectFaultItem(page, 1);
 
         const selectedFaultName = await page.locator('.c-fault-mgmt__list.is-selected .c-fault-mgmt__list-faultname').textContent();
@@ -45,7 +45,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(inspectorFaultNameCount).toEqual(1);
     });
 
-    test('When selecting multiple faults, no specific fault information is shown in the inspector @unstable', async ({ page }) => {
+    test('When selecting multiple faults, no specific fault information is shown in the inspector', async ({ page }) => {
         await utils.selectFaultItem(page, 1);
         await utils.selectFaultItem(page, 2);
 
@@ -61,7 +61,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(secondNameInInspectorCount).toEqual(0);
     });
 
-    test('Allows you to shelve a fault @unstable', async ({ page }) => {
+    test('Allows you to shelve a fault', async ({ page }) => {
         const shelvedFaultName = await utils.getFaultName(page, 2);
         const beforeShelvedFault = utils.getFaultByName(page, shelvedFaultName);
 
@@ -80,7 +80,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(await shelvedViewFault.count()).toBe(1);
     });
 
-    test('Allows you to acknowledge a fault @unstable', async ({ page }) => {
+    test('Allows you to acknowledge a fault', async ({ page }) => {
         const acknowledgedFaultName = await utils.getFaultName(page, 3);
 
         await utils.acknowledgeFault(page, 3);
@@ -94,7 +94,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(acknowledgedFaultName).toEqual(acknowledgedViewFaultName);
     });
 
-    test('Allows you to shelve multiple faults @unstable', async ({ page }) => {
+    test('Allows you to shelve multiple faults', async ({ page }) => {
         const shelvedFaultNameOne = await utils.getFaultName(page, 1);
         const shelvedFaultNameFour = await utils.getFaultName(page, 4);
 
@@ -121,7 +121,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(await shelvedViewFaultFour.count()).toBe(1);
     });
 
-    test('Allows you to acknowledge multiple faults @unstable', async ({ page }) => {
+    test('Allows you to acknowledge multiple faults', async ({ page }) => {
         const acknowledgedFaultNameTwo = await utils.getFaultName(page, 2);
         const acknowledgedFaultNameFive = await utils.getFaultName(page, 5);
 
@@ -143,7 +143,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(await acknowledgedViewFaultFive.count()).toBe(1);
     });
 
-    test('Allows you to search faults @unstable', async ({ page }) => {
+    test('Allows you to search faults', async ({ page }) => {
         const faultThreeNamespace = await utils.getFaultNamespace(page, 3);
         const faultTwoName = await utils.getFaultName(page, 2);
         const faultFiveTriggerTime = await utils.getFaultTriggerTime(page, 5);
@@ -184,7 +184,7 @@ test.describe('The Fault Management Plugin using example faults', () => {
         expect.soft(await utils.getFaultTriggerTime(page, 1)).toEqual(faultFiveTriggerTime);
     });
 
-    test('Allows you to sort faults @unstable', async ({ page }) => {
+    test('Allows you to sort faults', async ({ page }) => {
         const highestSeverity = await utils.getHighestSeverity(page);
         const lowestSeverity = await utils.getLowestSeverity(page);
         const faultOneName = 'Example Fault 1';
@@ -213,7 +213,7 @@ test.describe('The Fault Management Plugin without using example faults', () =>
         await utils.navigateToFaultManagementWithoutExample(page);
     });
 
-    test('Shows no faults when no faults are provided @unstable', async ({ page }) => {
+    test('Shows no faults when no faults are provided', async ({ page }) => {
         const faultCount = await page.locator('c-fault-mgmt__list').count();
 
         expect.soft(faultCount).toEqual(0);
@@ -227,7 +227,7 @@ test.describe('The Fault Management Plugin without using example faults', () =>
         expect.soft(shelvedCount).toEqual(0);
     });
 
-    test('Will return no faults when searching @unstable', async ({ page }) => {
+    test('Will return no faults when searching', async ({ page }) => {
         await utils.enterSearchTerm(page, 'fault');
 
         const faultCount = await page.locator('c-fault-mgmt__list').count();

e2e/tests/functional/plugins/flexibleLayout/flexibleLayout.e2e.spec.js

@@ -1,66 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2022, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-const { test, expect } = require('../../../../pluginFixtures');
-const { createDomainObjectWithDefaults } = require('../../../../appActions');
-
-test.describe('Testing Flexible Layout @unstable', () => {
-    test.beforeEach(async ({ page }) => {
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        // Create Sine Wave Generator
-        await createDomainObjectWithDefaults(page, {
-            type: 'Sine Wave Generator',
-            name: "Test Sine Wave Generator"
-        });
-
-        // Create Clock Object
-        await createDomainObjectWithDefaults(page, {
-            type: 'Clock',
-            name: "Test Clock"
-        });
-    });
-    test('panes have the appropriate draggable attribute while in Edit and Browse modes', async ({ page }) => {
-        // Create a Flexible Layout
-        await createDomainObjectWithDefaults(page, {
-            type: 'Flexible Layout',
-            name: "Test Flexible Layout"
-        });
-        // Edit Flexible Layout
-        await page.locator('[title="Edit"]').click();
-
-        // Expand the 'My Items' folder in the left tree
-        await page.locator('.c-tree__item__view-control.c-disclosure-triangle').first().click();
-        // Add the Sine Wave Generator and Clock to the Flexible Layout
-        await page.dragAndDrop('text=Test Sine Wave Generator', '.c-fl__container.is-empty');
-        await page.dragAndDrop('text=Test Clock', '.c-fl__container.is-empty');
-        // Check that panes can be dragged while Flexible Layout is in Edit mode
-        let dragWrapper = await page.locator('.c-fl-container__frames-holder .c-fl-frame__drag-wrapper').first();
-        await expect(dragWrapper).toHaveAttribute('draggable', 'true');
-        // Save Flexible Layout
-        await page.locator('button[title="Save"]').click();
-        await page.locator('text=Save and Finish Editing').click();
-        // Check that panes are not draggable while Flexible Layout is in Browse mode
-        dragWrapper = await page.locator('.c-fl-container__frames-holder .c-fl-frame__drag-wrapper').first();
-        await expect(dragWrapper).toHaveAttribute('draggable', 'false');
-    });
-});

e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js

@@ -35,29 +35,49 @@ const expectedAltText = process.platform === 'linux' ? 'Ctrl+Alt drag to pan' :
 
 //The following block of tests verifies the basic functionality of example imagery and serves as a template for Imagery objects embedded in other objects.
 test.describe('Example Imagery Object', () => {
+
     test.beforeEach(async ({ page }) => {
         //Go to baseURL
         await page.goto('./', { waitUntil: 'networkidle' });
 
         // Create a default 'Example Imagery' object
-        await createDomainObjectWithDefaults(page, { type: 'Example Imagery' });
+        createDomainObjectWithDefaults(page, { type: 'Example Imagery' });
+
+        await Promise.all([
+            page.waitForNavigation(),
+            page.locator(backgroundImageSelector).hover({trial: true}),
+            // eslint-disable-next-line playwright/missing-playwright-await
+            expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery')
+        ]);
 
         // Verify that the created object is focused
-        await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
-        await page.locator(backgroundImageSelector).hover({trial: true});
     });
 
     test('Can use Mouse Wheel to zoom in and out of latest image', async ({ page }) => {
-        // Zoom in x2 and assert
-        await mouseZoomOnImageAndAssert(page, 2);
+        const deltaYStep = 100; //equivalent to 1x zoom
+        await page.locator(backgroundImageSelector).hover({trial: true});
+        const originalImageDimensions = await page.locator(backgroundImageSelector).boundingBox();
+        // zoom in
+        await page.locator(backgroundImageSelector).hover({trial: true});
+        await page.mouse.wheel(0, deltaYStep * 2);
+        // wait for zoom animation to finish
+        await page.locator(backgroundImageSelector).hover({trial: true});
+        const imageMouseZoomedIn = await page.locator(backgroundImageSelector).boundingBox();
+        // zoom out
+        await page.locator(backgroundImageSelector).hover({trial: true});
+        await page.mouse.wheel(0, -deltaYStep);
+        // wait for zoom animation to finish
+        await page.locator(backgroundImageSelector).hover({trial: true});
+        const imageMouseZoomedOut = await page.locator(backgroundImageSelector).boundingBox();
 
-        // Zoom out x2 and assert
-        await mouseZoomOnImageAndAssert(page, -2);
+        expect(imageMouseZoomedIn.height).toBeGreaterThan(originalImageDimensions.height);
+        expect(imageMouseZoomedIn.width).toBeGreaterThan(originalImageDimensions.width);
+        expect(imageMouseZoomedOut.height).toBeLessThan(imageMouseZoomedIn.height);
+        expect(imageMouseZoomedOut.width).toBeLessThan(imageMouseZoomedIn.width);
     });
 
     test('Can adjust image brightness/contrast by dragging the sliders', async ({ page, browserName }) => {
-        // eslint-disable-next-line playwright/no-skipped-test
-        test.skip(browserName === 'firefox', 'This test needs to be updated to work with firefox');
+        test.fixme(browserName === 'firefox', 'This test needs to be updated to work with firefox');
         // Open the image filter menu
         await page.locator('[role=toolbar] button[title="Brightness and contrast"]').click();
 
@@ -130,7 +150,30 @@ test.describe('Example Imagery Object', () => {
     });
 
     test('Can use + - buttons to zoom on the image @unstable', async ({ page }) => {
-        await buttonZoomOnImageAndAssert(page);
+        // Get initial image dimensions
+        const initialBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+
+        // Zoom in twice via button
+        await zoomIntoImageryByButton(page);
+        await zoomIntoImageryByButton(page);
+
+        // Get and assert zoomed in image dimensions
+        const zoomedInBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+        expect(zoomedInBoundingBox.height).toBeGreaterThan(initialBoundingBox.height);
+        expect(zoomedInBoundingBox.width).toBeGreaterThan(initialBoundingBox.width);
+
+        // Zoom out once via button
+        await zoomOutOfImageryByButton(page);
+
+        // Get and assert zoomed out image dimensions
+        const zoomedOutBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+        expect(zoomedOutBoundingBox.height).toBeLessThan(zoomedInBoundingBox.height);
+        expect(zoomedOutBoundingBox.width).toBeLessThan(zoomedInBoundingBox.width);
+
+        // Zoom out again via button, assert against the initial image dimensions
+        await zoomOutOfImageryByButton(page);
+        const finalBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+        expect(finalBoundingBox).toEqual(initialBoundingBox);
     });
 
     test('Can use the reset button to reset the image @unstable', async ({ page }, testInfo) => {
@@ -167,223 +210,47 @@ test.describe('Example Imagery Object', () => {
         await zoomIntoImageryByButton(page);
         await expect(pausePlayButton).not.toHaveClass(/is-paused/);
     });
+
 });
 
-test.describe('Example Imagery in Display Layout', () => {
-    let displayLayout;
-    test.beforeEach(async ({ page }) => {
-        // Go to baseURL
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        displayLayout = await createDomainObjectWithDefaults(page, { type: 'Display Layout' });
-        await page.goto(displayLayout.url);
-
-        /* Create Sine Wave Generator with minimum Image Load Delay */
-        // Click the Create button
-        await page.click('button:has-text("Create")');
-
-        // Click text=Example Imagery
-        await page.click('text=Example Imagery');
-
-        // Clear and set Image load delay to minimum value
-        await page.locator('input[type="number"]').fill('');
-        await page.locator('input[type="number"]').fill('5000');
-
-        // Click text=OK
-        await Promise.all([
-            page.waitForNavigation({waitUntil: 'networkidle'}),
-            page.click('text=OK'),
-            //Wait for Save Banner to appear
-            page.waitForSelector('.c-message-banner__message')
-        ]);
-
-        await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
-
-        await page.goto(displayLayout.url);
+// The following test case will cover these scenarios
+// ('Can use Mouse Wheel to zoom in and out of previous image');
+// ('Can use alt+drag to move around image once zoomed in');
+// ('Clicking on the left arrow should pause the imagery and go to previous image');
+// ('If the imagery view is in pause mode, it should not be updated when new images come in');
+// ('If the imagery view is not in pause mode, it should be updated when new images come in');
+test('Example Imagery in Display layout @unstable', async ({ page }) => {
+    test.info().annotations.push({
+        type: 'issue',
+        description: 'https://github.com/nasa/openmct/issues/5265'
     });
 
-    test('Imagery View operations @unstable', async ({ page }) => {
-        test.info().annotations.push({
-            type: 'issue',
-            description: 'https://github.com/nasa/openmct/issues/5265'
-        });
+    // Go to baseURL
+    await page.goto('./', { waitUntil: 'networkidle' });
 
-        // Edit mode
-        await page.click('button[title="Edit"]');
+    // Click the Create button
+    await page.click('button:has-text("Create")');
 
-        // Click on example imagery to expose toolbar
-        await page.locator('.c-so-view__header').click();
+    // Click text=Example Imagery
+    await page.click('text=Example Imagery');
 
-        // Adjust object height
-        await page.locator('div[title="Resize object height"] > input').click();
-        await page.locator('div[title="Resize object height"] > input').fill('50');
+    // Clear and set Image load delay to minimum value
+    await page.locator('input[type="number"]').fill('');
+    await page.locator('input[type="number"]').fill('5000');
 
-        // Adjust object width
-        await page.locator('div[title="Resize object width"] > input').click();
-        await page.locator('div[title="Resize object width"] > input').fill('50');
+    // Click text=OK
+    await Promise.all([
+        page.waitForNavigation({waitUntil: 'networkidle'}),
+        page.click('text=OK'),
+        //Wait for Save Banner to appear
+        page.waitForSelector('.c-message-banner__message')
+    ]);
 
-        await performImageryViewOperationsAndAssert(page);
-    });
+    // Wait until Save Banner is gone
+    await page.waitForSelector('.c-message-banner__message', { state: 'detached'});
+    await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
+    await page.locator(backgroundImageSelector).hover({trial: true});
 
-    test('Resizing the layout changes thumbnail visibility and size', async ({ page }) => {
-        const thumbsWrapperLocator = page.locator('.c-imagery__thumbs-wrapper');
-        // Edit mode
-        await page.click('button[title="Edit"]');
-
-        // Click on example imagery to expose toolbar
-        await page.locator('.c-so-view__header').click();
-
-        // expect thumbnails not be visible when first added
-        expect.soft(thumbsWrapperLocator.isHidden()).toBeTruthy();
-
-        // Resize the example imagery vertically to change the thumbnail visibility
-        /*
-        The following arbitrary values are added to observe the separate visual
-        conditions of the thumbnails (hidden, small thumbnails, regular thumbnails).
-        Specifically, height is set to 50px for small thumbs and 100px for regular
-        */
-        await page.locator('div[title="Resize object height"] > input').click();
-        await page.locator('div[title="Resize object height"] > input').fill('50');
-
-        expect(thumbsWrapperLocator.isVisible()).toBeTruthy();
-        await expect(thumbsWrapperLocator).toHaveClass(/is-small-thumbs/);
-
-        // Resize the example imagery vertically to change the thumbnail visibility
-        await page.locator('div[title="Resize object height"] > input').click();
-        await page.locator('div[title="Resize object height"] > input').fill('100');
-
-        expect(thumbsWrapperLocator.isVisible()).toBeTruthy();
-        await expect(thumbsWrapperLocator).not.toHaveClass(/is-small-thumbs/);
-    });
-});
-
-test.describe('Example Imagery in Flexible layout', () => {
-    let flexibleLayout;
-    test.beforeEach(async ({ page }) => {
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        flexibleLayout = await createDomainObjectWithDefaults(page, { type: 'Flexible Layout' });
-        await page.goto(flexibleLayout.url);
-
-        /* Create Sine Wave Generator with minimum Image Load Delay */
-        // Click the Create button
-        await page.click('button:has-text("Create")');
-
-        // Click text=Example Imagery
-        await page.click('text=Example Imagery');
-
-        // Clear and set Image load delay to minimum value
-        await page.locator('input[type="number"]').fill('');
-        await page.locator('input[type="number"]').fill('5000');
-
-        // Click text=OK
-        await Promise.all([
-            page.waitForNavigation({waitUntil: 'networkidle'}),
-            page.click('text=OK'),
-            //Wait for Save Banner to appear
-            page.waitForSelector('.c-message-banner__message')
-        ]);
-
-        await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
-
-        await page.goto(flexibleLayout.url);
-    });
-    test('Imagery View operations @unstable', async ({ page, browserName }) => {
-        test.fixme(browserName === 'firefox', 'This test needs to be updated to work with firefox');
-        test.info().annotations.push({
-            type: 'issue',
-            description: 'https://github.com/nasa/openmct/issues/5326'
-        });
-
-        await performImageryViewOperationsAndAssert(page);
-    });
-});
-
-test.describe('Example Imagery in Tabs View', () => {
-    let tabsView;
-    test.beforeEach(async ({ page }) => {
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        tabsView = await createDomainObjectWithDefaults(page, { type: 'Tabs View' });
-        await page.goto(tabsView.url);
-
-        /* Create Sine Wave Generator with minimum Image Load Delay */
-        // Click the Create button
-        await page.click('button:has-text("Create")');
-
-        // Click text=Example Imagery
-        await page.click('text=Example Imagery');
-
-        // Clear and set Image load delay to minimum value
-        await page.locator('input[type="number"]').fill('');
-        await page.locator('input[type="number"]').fill('5000');
-
-        // Click text=OK
-        await Promise.all([
-            page.waitForNavigation({waitUntil: 'networkidle'}),
-            page.click('text=OK'),
-            //Wait for Save Banner to appear
-            page.waitForSelector('.c-message-banner__message')
-        ]);
-
-        await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
-
-        await page.goto(tabsView.url);
-    });
-    test('Imagery View operations @unstable', async ({ page }) => {
-        await performImageryViewOperationsAndAssert(page);
-    });
-});
-
-test.describe('Example Imagery in Time Strip', () => {
-    let timeStripObject;
-    test.beforeEach(async ({ page }) => {
-        await page.goto('./', { waitUntil: 'networkidle' });
-        timeStripObject = await createDomainObjectWithDefaults(page, {
-            type: 'Time Strip',
-            name: 'Time Strip'.concat(' ', uuid())
-        });
-
-        await createDomainObjectWithDefaults(page, {
-            type: 'Example Imagery',
-            name: 'Example Imagery'.concat(' ', uuid()),
-            parent: timeStripObject.uuid
-        });
-        // Navigate to timestrip
-        await page.goto(timeStripObject.url);
-    });
-    test('Clicking a thumbnail loads the image in large view', async ({ page, browserName }) => {
-        test.info().annotations.push({
-            type: 'issue',
-            description: 'https://github.com/nasa/openmct/issues/5632'
-        });
-        await page.locator('.c-imagery-tsv-container').hover();
-        // get url of the hovered image
-        const hoveredImg = page.locator('.c-imagery-tsv div.c-imagery-tsv__image-wrapper:hover img');
-        const hoveredImgSrc = await hoveredImg.getAttribute('src');
-        expect(hoveredImgSrc).toBeTruthy();
-        await page.locator('.c-imagery-tsv-container').click();
-        // get image of view large container
-        const viewLargeImg = page.locator('img.c-imagery__main-image__image');
-        const viewLargeImgSrc = await viewLargeImg.getAttribute('src');
-        expect(viewLargeImgSrc).toBeTruthy();
-        expect(viewLargeImgSrc).toEqual(hoveredImgSrc);
-    });
-});
-
-/**
- * Perform the common actions and assertions for the Imagery View.
- * This function verifies the following in order:
- * 1. Can zoom in/out using the zoom buttons
- * 2. Can zoom in/out using the mouse wheel
- * 3. Can pan the image using the pan hotkey + mouse drag
- * 4. Clicking on the left arrow button pauses imagery and moves to the previous image
- * 5. Imagery is updated as new images stream in, regardless of pause status
- * 6. Old images are discarded when new images stream in
- * 7. Image brightness/contrast can be adjusted by dragging the sliders
- * @param {import('@playwright/test').Page} page
- */
-async function performImageryViewOperationsAndAssert(page) {
     // Click previous image button
     const previousImageButton = page.locator('.c-nav--prev');
     await previousImageButton.click();
@@ -392,17 +259,27 @@ async function performImageryViewOperationsAndAssert(page) {
     const selectedImage = page.locator('.selected');
     await expect(selectedImage).toBeVisible();
 
-    // Use the zoom buttons to zoom in and out
-    await buttonZoomOnImageAndAssert(page);
+    // Zoom in
+    const originalImageDimensions = await page.locator(backgroundImageSelector).boundingBox();
+    await page.locator(backgroundImageSelector).hover({trial: true});
+    const deltaYStep = 100; // equivalent to 1x zoom
+    await page.mouse.wheel(0, deltaYStep * 2);
+    const zoomedBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+    const imageCenterX = zoomedBoundingBox.x + zoomedBoundingBox.width / 2;
+    const imageCenterY = zoomedBoundingBox.y + zoomedBoundingBox.height / 2;
 
-    // Use Mouse Wheel to zoom in to previous image
-    await mouseZoomOnImageAndAssert(page, 2);
+    // Wait for zoom animation to finish
+    await page.locator(backgroundImageSelector).hover({trial: true});
+    const imageMouseZoomedIn = await page.locator(backgroundImageSelector).boundingBox();
+    expect(imageMouseZoomedIn.height).toBeGreaterThan(originalImageDimensions.height);
+    expect(imageMouseZoomedIn.width).toBeGreaterThan(originalImageDimensions.width);
 
-    // Use alt+drag to move around image once zoomed in
-    await panZoomAndAssertImageProperties(page);
+    // Center the mouse pointer
+    await page.mouse.move(imageCenterX, imageCenterY);
 
-    // Use Mouse Wheel to zoom out of previous image
-    await mouseZoomOnImageAndAssert(page, -2);
+    // Pan Imagery Hints
+    const imageryHintsText = await page.locator('.c-imagery__hints').innerText();
+    expect(expectedAltText).toEqual(imageryHintsText);
 
     // Click next image button
     const nextImageButton = page.locator('.c-nav--next');
@@ -415,14 +292,21 @@ async function performImageryViewOperationsAndAssert(page) {
     await page.locator('[data-testid=conductor-modeOption-realtime]').click();
 
     // Zoom in on next image
-    await mouseZoomOnImageAndAssert(page, 2);
+    await page.locator(backgroundImageSelector).hover({trial: true});
+    await page.mouse.wheel(0, deltaYStep * 2);
 
-    // Clicking on the left arrow should pause the imagery and go to previous image
+    // Wait for zoom animation to finish
+    await page.locator(backgroundImageSelector).hover({trial: true});
+    const imageNextMouseZoomedIn = await page.locator(backgroundImageSelector).boundingBox();
+    expect(imageNextMouseZoomedIn.height).toBeGreaterThan(originalImageDimensions.height);
+    expect(imageNextMouseZoomedIn.width).toBeGreaterThan(originalImageDimensions.width);
+
+    // Click previous image button
     await previousImageButton.click();
-    await expect(page.locator('.c-button.pause-play')).toHaveClass(/is-paused/);
+
+    // Verify previous image
     await expect(selectedImage).toBeVisible();
 
-    // The imagery view should be updated when new images come in
     const imageCount = await page.locator('.c-imagery__thumb').count();
     await expect.poll(async () => {
         const newImageCount = await page.locator('.c-imagery__thumb').count();
@@ -430,7 +314,7 @@ async function performImageryViewOperationsAndAssert(page) {
         return newImageCount;
     }, {
         message: "verify that old images are discarded",
-        timeout: 7 * 1000
+        timeout: 6 * 1000
     }).toBe(imageCount);
 
     // Verify selected image is still displayed
@@ -448,6 +332,287 @@ async function performImageryViewOperationsAndAssert(page) {
     // Drag the brightness and contrast sliders around and assert filter values
     await dragBrightnessSliderAndAssertFilterValues(page);
     await dragContrastSliderAndAssertFilterValues(page);
+});
+
+test.describe('Example imagery thumbnails resize in display layouts', () => {
+    test('Resizing the layout changes thumbnail visibility and size', async ({ page }) => {
+        await page.goto('./', { waitUntil: 'networkidle' });
+
+        const thumbsWrapperLocator = page.locator('.c-imagery__thumbs-wrapper');
+        // Click button:has-text("Create")
+        await page.locator('button:has-text("Create")').click();
+
+        // Click li:has-text("Display Layout")
+        await page.locator('li:has-text("Display Layout")').click();
+        const displayLayoutTitleField = page.locator('text=Properties Title Notes Horizontal grid (px) Vertical grid (px) Horizontal size ( >> input[type="text"]');
+        await displayLayoutTitleField.click();
+
+        await displayLayoutTitleField.fill('Thumbnail Display Layout');
+
+        // Click text=OK
+        await Promise.all([
+            page.waitForNavigation(),
+            page.locator('text=OK').click()
+        ]);
+
+        // Click text=Snapshot Save and Finish Editing Save and Continue Editing >> button >> nth=1
+        await page.locator('text=Snapshot Save and Finish Editing Save and Continue Editing >> button').nth(1).click();
+
+        // Click text=Save and Finish Editing
+        await page.locator('text=Save and Finish Editing').click();
+
+        // Click button:has-text("Create")
+        await page.locator('button:has-text("Create")').click();
+
+        // Click li:has-text("Example Imagery")
+        await page.locator('li:has-text("Example Imagery")').click();
+
+        const imageryTitleField = page.locator('text=Properties Title Notes Images url list (comma separated) Image load delay (milli >> input[type="text"]');
+        // Click text=Properties Title Notes Images url list (comma separated) Image load delay (milli >> input[type="text"]
+        await imageryTitleField.click();
+
+        // Fill text=Properties Title Notes Images url list (comma separated) Image load delay (milli >> input[type="text"]
+        await imageryTitleField.fill('Thumbnail Example Imagery');
+
+        // Click text=OK
+        await Promise.all([
+            page.waitForNavigation(),
+            page.locator('text=OK').click()
+        ]);
+
+        // Click text=Thumbnail Example Imagery Imagery Layout Snapshot >> button >> nth=0
+        await Promise.all([
+            page.waitForNavigation(),
+            page.locator('text=Thumbnail Example Imagery Imagery Layout Snapshot >> button').first().click()
+        ]);
+
+        // Edit mode
+        await page.locator('text=Thumbnail Display Layout Snapshot >> button').nth(3).click();
+
+        // Click on example imagery to expose toolbar
+        await page.locator('text=Thumbnail Example Imagery Snapshot Large View').click();
+
+        // expect thumbnails not be visible when first added
+        expect.soft(thumbsWrapperLocator.isHidden()).toBeTruthy();
+
+        // Resize the example imagery vertically to change the thumbnail visibility
+        /*
+        The following arbitrary values are added to observe the separate visual
+        conditions of the thumbnails (hidden, small thumbnails, regular thumbnails).
+        Specifically, height is set to 50px for small thumbs and 100px for regular
+        */
+        // Click #mct-input-id-103
+        await page.locator('#mct-input-id-103').click();
+
+        // Fill #mct-input-id-103
+        await page.locator('#mct-input-id-103').fill('50');
+
+        expect(thumbsWrapperLocator.isVisible()).toBeTruthy();
+        await expect(thumbsWrapperLocator).toHaveClass(/is-small-thumbs/);
+
+        // Resize the example imagery vertically to change the thumbnail visibility
+        // Click #mct-input-id-103
+        await page.locator('#mct-input-id-103').click();
+
+        // Fill #mct-input-id-103
+        await page.locator('#mct-input-id-103').fill('100');
+
+        expect(thumbsWrapperLocator.isVisible()).toBeTruthy();
+        await expect(thumbsWrapperLocator).not.toHaveClass(/is-small-thumbs/);
+    });
+});
+
+// test.fixme('Can use Mouse Wheel to zoom in and out of previous image');
+// test.fixme('Can use alt+drag to move around image once zoomed in');
+// test.fixme('Clicking on the left arrow should pause the imagery and go to previous image');
+// test.fixme('If the imagery view is in pause mode, images still come in');
+// test.fixme('If the imagery view is not in pause mode, it should be updated when new images come in');
+test.describe('Example Imagery in Flexible layout', () => {
+    test('Example Imagery in Flexible layout @unstable', async ({ page, browserName, openmctConfig }) => {
+        const { myItemsFolderName } = openmctConfig;
+
+        test.fixme(browserName === 'firefox', 'This test needs to be updated to work with firefox');
+        test.info().annotations.push({
+            type: 'issue',
+            description: 'https://github.com/nasa/openmct/issues/5326'
+        });
+
+        // Go to baseURL
+        await page.goto('./', { waitUntil: 'networkidle' });
+
+        // Click the Create button
+        await page.click('button:has-text("Create")');
+
+        // Click text=Example Imagery
+        await page.click('text=Example Imagery');
+
+        // Clear and set Image load delay (milliseconds)
+        await page.click('input[type="number"]', {clickCount: 3});
+        await page.type('input[type="number"]', "20");
+
+        // Click text=OK
+        await Promise.all([
+            page.waitForNavigation({waitUntil: 'networkidle'}),
+            page.click('text=OK'),
+            //Wait for Save Banner to appear
+            page.waitForSelector('.c-message-banner__message')
+        ]);
+        // Wait until Save Banner is gone
+        await page.waitForSelector('.c-message-banner__message', { state: 'detached'});
+        await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Example Imagery');
+        await page.locator(backgroundImageSelector).hover({trial: true});
+
+        // Click the Create button
+        await page.click('button:has-text("Create")');
+
+        // Click text=Flexible Layout
+        await page.click('text=Flexible Layout');
+
+        // Assert Flexible layout
+        await expect(page.locator('.js-form-title')).toHaveText('Create a New Flexible Layout');
+
+        await page.locator(`form[name="mctForm"] >> text=${myItemsFolderName}`).click();
+
+        // Click My Items
+        await Promise.all([
+            page.locator('text=OK').click(),
+            page.waitForNavigation({waitUntil: 'networkidle'})
+        ]);
+
+        // Click My Items
+        await page.locator('.c-disclosure-triangle').click();
+
+        // Right click example imagery
+        await page.click(('text=Unnamed Example Imagery'), { button: 'right' });
+
+        // Click move
+        await page.locator('.icon-move').click();
+
+        // Click triangle to open sub menu
+        await page.locator('.c-form__section .c-disclosure-triangle').click();
+
+        // Click Flexable Layout
+        await page.click('.c-overlay__outer >> text=Unnamed Flexible Layout');
+
+        // Click text=OK
+        await page.locator('text=OK').click();
+
+        // Save template
+        await saveTemplate(page);
+
+        // Zoom in
+        await mouseZoomIn(page);
+
+        // Center the mouse pointer
+        const zoomedBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
+        const imageCenterX = zoomedBoundingBox.x + zoomedBoundingBox.width / 2;
+        const imageCenterY = zoomedBoundingBox.y + zoomedBoundingBox.height / 2;
+        await page.mouse.move(imageCenterX, imageCenterY);
+
+        // Pan zoom
+        await panZoomAndAssertImageProperties(page);
+
+        // Click previous image button
+        const previousImageButton = page.locator('.c-nav--prev');
+        await previousImageButton.click();
+
+        // Verify previous image
+        const selectedImage = page.locator('.selected');
+        await expect(selectedImage).toBeVisible();
+
+        // Click time conductor mode button
+        await page.locator('.c-mode-button').click();
+
+        // Select local clock mode
+        await page.locator('[data-testid=conductor-modeOption-realtime]').nth(0).click();
+
+        // Zoom in on next image
+        await mouseZoomIn(page);
+
+        // Click previous image button
+        await previousImageButton.click();
+
+        // Verify previous image
+        await expect(selectedImage).toBeVisible();
+
+        const imageCount = await page.locator('.c-imagery__thumb').count();
+        await expect.poll(async () => {
+            const newImageCount = await page.locator('.c-imagery__thumb').count();
+
+            return newImageCount;
+        }, {
+            message: "verify that old images are discarded",
+            timeout: 6 * 1000
+        }).toBe(imageCount);
+
+        // Verify selected image is still displayed
+        await expect(selectedImage).toBeVisible();
+
+        // Unpause imagery
+        await page.locator('.pause-play').click();
+
+        //Get background-image url from background-image css prop
+        await assertBackgroundImageUrlFromBackgroundCss(page);
+
+        // Open the image filter menu
+        await page.locator('[role=toolbar] button[title="Brightness and contrast"]').click();
+
+        // Drag the brightness and contrast sliders around and assert filter values
+        await dragBrightnessSliderAndAssertFilterValues(page);
+        await dragContrastSliderAndAssertFilterValues(page);
+    });
+});
+
+test.describe('Example Imagery in Tabs view', () => {
+    test.fixme('Can use Mouse Wheel to zoom in and out of previous image');
+    test.fixme('Can use alt+drag to move around image once zoomed in');
+    test.fixme('Can zoom into the latest image and the real-time/fixed-time imagery will pause');
+    test.fixme('Can zoom into a previous image from thumbstrip in real-time or fixed-time');
+    test.fixme('Clicking on the left arrow should pause the imagery and go to previous image');
+    test.fixme('If the imagery view is in pause mode, it should not be updated when new images come in');
+    test.fixme('If the imagery view is not in pause mode, it should be updated when new images come in');
+});
+
+test.describe('Example Imagery in Time Strip', () => {
+    test('ensure that clicking a thumbnail loads the image in large view', async ({ page, browserName }) => {
+        test.info().annotations.push({
+            type: 'issue',
+            description: 'https://github.com/nasa/openmct/issues/5632'
+        });
+        await page.goto('./', { waitUntil: 'networkidle' });
+        const timeStripObject = await createDomainObjectWithDefaults(page, {
+            type: 'Time Strip',
+            name: 'Time Strip'.concat(' ', uuid())
+        });
+
+        await createDomainObjectWithDefaults(page, {
+            type: 'Example Imagery',
+            name: 'Example Imagery'.concat(' ', uuid()),
+            parent: timeStripObject.uuid
+        });
+        // Navigate to timestrip
+        await page.goto(timeStripObject.url);
+
+        await page.locator('.c-imagery-tsv-container').hover();
+        // get url of the hovered image
+        const hoveredImg = page.locator('.c-imagery-tsv div.c-imagery-tsv__image-wrapper:hover img');
+        const hoveredImgSrc = await hoveredImg.getAttribute('src');
+        expect(hoveredImgSrc).toBeTruthy();
+        await page.locator('.c-imagery-tsv-container').click();
+        // get image of view large container
+        const viewLargeImg = page.locator('img.c-imagery__main-image__image');
+        const viewLargeImgSrc = await viewLargeImg.getAttribute('src');
+        expect(viewLargeImgSrc).toBeTruthy();
+        expect(viewLargeImgSrc).toEqual(hoveredImgSrc);
+    });
+});
+
+/**
+ * @param {import('@playwright/test').Page} page
+ */
+async function saveTemplate(page) {
+    await page.locator('.c-button--menu.c-button--major.icon-save').click();
+    await page.locator('text=Save and Finish Editing').click();
 }
 
 /**
@@ -530,7 +695,7 @@ async function assertBackgroundImageUrlFromBackgroundCss(page) {
         return backgroundImageUrl2;
     }, {
         message: "verify next image has updated",
-        timeout: 7 * 1000
+        timeout: 6 * 1000
     }).not.toBe(backgroundImageUrl1);
     console.log('backgroundImageUrl2 ' + backgroundImageUrl2);
 }
@@ -584,17 +749,14 @@ async function panZoomAndAssertImageProperties(page) {
 }
 
 /**
- * Use the mouse wheel to zoom in or out of an image and assert that the image
- * has successfully zoomed in or out.
  * @param {import('@playwright/test').Page} page
- * @param {number} [factor = 2] The zoom factor. Positive for zoom in, negative for zoom out.
 */
-async function mouseZoomOnImageAndAssert(page, factor = 2) {
+async function mouseZoomIn(page) {
     // Zoom in
     const originalImageDimensions = await page.locator(backgroundImageSelector).boundingBox();
     await page.locator(backgroundImageSelector).hover({trial: true});
     const deltaYStep = 100; // equivalent to 1x zoom
-    await page.mouse.wheel(0, deltaYStep * factor);
+    await page.mouse.wheel(0, deltaYStep * 2);
     const zoomedBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
     const imageCenterX = zoomedBoundingBox.x + zoomedBoundingBox.width / 2;
     const imageCenterY = zoomedBoundingBox.y + zoomedBoundingBox.height / 2;
@@ -604,47 +766,9 @@ async function mouseZoomOnImageAndAssert(page, factor = 2) {
 
     // Wait for zoom animation to finish
     await page.locator(backgroundImageSelector).hover({trial: true});
-    const imageMouseZoomed = await page.locator(backgroundImageSelector).boundingBox();
-
-    if (factor > 0) {
-        expect(imageMouseZoomed.height).toBeGreaterThan(originalImageDimensions.height);
-        expect(imageMouseZoomed.width).toBeGreaterThan(originalImageDimensions.width);
-    } else {
-        expect(imageMouseZoomed.height).toBeLessThan(originalImageDimensions.height);
-        expect(imageMouseZoomed.width).toBeLessThan(originalImageDimensions.width);
-    }
-}
-
-/**
- * Zoom in and out of the image using the buttons, and assert that the image has
- * been successfully zoomed in or out.
- * @param {import('@playwright/test').Page} page
- */
-async function buttonZoomOnImageAndAssert(page) {
-    // Get initial image dimensions
-    const initialBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
-
-    // Zoom in twice via button
-    await zoomIntoImageryByButton(page);
-    await zoomIntoImageryByButton(page);
-
-    // Get and assert zoomed in image dimensions
-    const zoomedInBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
-    expect(zoomedInBoundingBox.height).toBeGreaterThan(initialBoundingBox.height);
-    expect(zoomedInBoundingBox.width).toBeGreaterThan(initialBoundingBox.width);
-
-    // Zoom out once via button
-    await zoomOutOfImageryByButton(page);
-
-    // Get and assert zoomed out image dimensions
-    const zoomedOutBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
-    expect(zoomedOutBoundingBox.height).toBeLessThan(zoomedInBoundingBox.height);
-    expect(zoomedOutBoundingBox.width).toBeLessThan(zoomedInBoundingBox.width);
-
-    // Zoom out again via button, assert against the initial image dimensions
-    await zoomOutOfImageryByButton(page);
-    const finalBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
-    expect(finalBoundingBox).toEqual(initialBoundingBox);
+    const imageMouseZoomedIn = await page.locator(backgroundImageSelector).boundingBox();
+    expect(imageMouseZoomedIn.height).toBeGreaterThan(originalImageDimensions.height);
+    expect(imageMouseZoomedIn.width).toBeGreaterThan(originalImageDimensions.width);
 }
 
 /**

e2e/tests/functional/plugins/notebook/notebook.e2e.spec.js

@@ -27,7 +27,6 @@ This test suite is dedicated to tests which verify the basic operations surround
 // FIXME: Remove this eslint exception once tests are implemented
 // eslint-disable-next-line no-unused-vars
 const { test, expect } = require('../../../../baseFixtures');
-const { createDomainObjectWithDefaults } = require('../../../../appActions');
 
 test.describe('Notebook CRUD Operations', () => {
     test.fixme('Can create a Notebook Object', async ({ page }) => {
@@ -68,32 +67,10 @@ test.describe('Default Notebook', () => {
 
 test.describe('Notebook section tests', () => {
     //The following test cases are associated with Notebook Sections
-    test.beforeEach(async ({ page }) => {
-        //Navigate to baseURL
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        // Create Notebook
-        await createDomainObjectWithDefaults(page, {
-            type: 'Notebook',
-            name: "Test Notebook"
-        });
-    });
-    test('Default and new sections are automatically named Unnamed Section with Unnamed Page', async ({ page }) => {
-        // Check that the default section and page are created and the name matches the defaults
-        const defaultSectionName = await page.locator('.c-notebook__sections .c-list__item__name').textContent();
-        expect(defaultSectionName).toBe('Unnamed Section');
-        const defaultPageName = await page.locator('.c-notebook__pages .c-list__item__name').textContent();
-        expect(defaultPageName).toBe('Unnamed Page');
-
-        // Expand sidebar and add a section
-        await page.locator('.c-notebook__toggle-nav-button').click();
-        await page.locator('.js-sidebar-sections .c-icon-button.icon-plus').click();
-
-        // Check that new section and page within the new section match the defaults
-        const newSectionName = await page.locator('.c-notebook__sections .c-list__item__name').nth(1).textContent();
-        expect(newSectionName).toBe('Unnamed Section');
-        const newPageName = await page.locator('.c-notebook__pages .c-list__item__name').textContent();
-        expect(newPageName).toBe('Unnamed Page');
+    test.fixme('New sections are automatically named Unnamed Section with Unnamed Page', async ({ page }) => {
+        //Create new notebook A
+        //Add section
+        //Verify new section and new page details
     });
     test.fixme('Section selection operations and associated behavior', async ({ page }) => {
         //Create new notebook A
@@ -109,59 +86,10 @@ test.describe('Notebook section tests', () => {
         //Delete 3rd section
         //1st is selected and there is no default notebook
     });
-    test.fixme('Section rename operations', async ({ page }) => {
-        // Create a new notebook
-        // Add a section
-        // Rename the section but do not confirm
-        // Keyboard press 'Escape'
-        // Verify that the section name reverts to the default name
-        // Rename the section but do not confirm
-        // Keyboard press 'Enter'
-        // Verify that the section name is updated
-        // Rename the section to "" (empty string)
-        // Keyboard press 'Enter' to confirm
-        // Verify that the section name reverts to the default name
-        // Rename the section to something long that overflows the text box
-        // Verify that the section name is not truncated while input is active
-        // Confirm the section name edit
-        // Verify that the section name is truncated now that input is not active
-    });
 });
 
 test.describe('Notebook page tests', () => {
     //The following test cases are associated with Notebook Pages
-    test.beforeEach(async ({ page }) => {
-        //Navigate to baseURL
-        await page.goto('./', { waitUntil: 'networkidle' });
-
-        // Create Notebook
-        await createDomainObjectWithDefaults(page, {
-            type: 'Notebook',
-            name: "Test Notebook"
-        });
-    });
-    //Test will need to be implemented after a refactor in #5713
-    // eslint-disable-next-line playwright/no-skipped-test
-    test.skip('Delete page popup is removed properly on clicking dropdown again', async ({ page }) => {
-        test.info().annotations.push({
-            type: 'issue',
-            description: 'https://github.com/nasa/openmct/issues/5713'
-        });
-        // Expand sidebar and add a second page
-        await page.locator('.c-notebook__toggle-nav-button').click();
-        await page.locator('text=Page Add >> button').click();
-
-        // Click on the 2nd page dropdown button and expect the Delete Page option to appear
-        await page.locator('button[title="Open context menu"]').nth(2).click();
-        await expect(page.locator('text=Delete Page')).toBeEnabled();
-        // Clicking on the same page a second time causes the same Delete Page option to recreate
-        await page.locator('button[title="Open context menu"]').nth(2).click();
-        await expect(page.locator('text=Delete Page')).toBeEnabled();
-        // Clicking on the first page causes the first delete button to detach and recreate on the first page
-        await page.locator('button[title="Open context menu"]').nth(1).click();
-        const numOfDeletePagePopups = await page.locator('li[title="Delete Page"]').count();
-        expect(numOfDeletePagePopups).toBe(1);
-    });
     test.fixme('Page selection operations and associated behavior', async ({ page }) => {
         //Create new notebook A
         //Delete existing Page
@@ -179,23 +107,6 @@ test.describe('Notebook page tests', () => {
         //Delete 3rd page
         //First is now selected and there is no default notebook
     });
-    test.fixme('Page rename operations', async ({ page }) => {
-        // Create a new notebook
-        // Add a page
-        // Rename the page but do not confirm
-        // Keyboard press 'Escape'
-        // Verify that the page name reverts to the default name
-        // Rename the page but do not confirm
-        // Keyboard press 'Enter'
-        // Verify that the page name is updated
-        // Rename the page to "" (empty string)
-        // Keyboard press 'Enter' to confirm
-        // Verify that the page name reverts to the default name
-        // Rename the page to something long that overflows the text box
-        // Verify that the page name is not truncated while input is active
-        // Confirm the page name edit
-        // Verify that the page name is truncated now that input is not active
-    });
 });
 
 test.describe('Notebook search tests', () => {

e2e/tests/functional/plugins/notebook/restrictedNotebook.e2e.spec.js

@@ -86,8 +86,7 @@ test.describe('Restricted Notebook with at least one entry and with the page loc
     });
 
     test('Locked page should now be in a locked state @addInit @unstable', async ({ page }, testInfo) => {
-        // eslint-disable-next-line playwright/no-skipped-test
-        test.skip(testInfo.project === 'chrome-beta', "Test is unreliable on chrome-beta");
+        test.fixme(testInfo.project === 'chrome-beta', "Test is unreliable on chrome-beta");
         // main lock message on page
         const lockMessage = page.locator('text=This page has been committed and cannot be modified or removed');
         expect.soft(await lockMessage.count()).toEqual(1);

e2e/tests/functional/plugins/notebook/tags.e2e.spec.js

@@ -126,8 +126,8 @@ test.describe('Tagging in Notebooks @addInit', () => {
         await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').click();
         // Fill [aria-label="OpenMCT Search"] input[type="search"]
         await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('Xq');
-        await expect(page.locator('[aria-label="Search Result"]')).toBeHidden();
-        await expect(page.locator('[aria-label="Search Result"]')).toBeHidden();
+        await expect(page.locator('[aria-label="Search Result"]')).not.toBeVisible();
+        await expect(page.locator('[aria-label="Search Result"]')).not.toBeVisible();
     });
 
     test('Can delete tags', async ({ page }) => {

e2e/tests/functional/plugins/plot/missingPlotObj.e2e.spec.js

@@ -28,10 +28,9 @@ const { test, expect } = require('../../../../pluginFixtures');
 
 test.describe('Handle missing object for plots', () => {
     test('Displays empty div for missing stacked plot item @unstable', async ({ page, browserName, openmctConfig }) => {
-        // eslint-disable-next-line playwright/no-skipped-test
-        test.skip(browserName === 'firefox', 'Firefox failing due to console events being missed');
-
         const { myItemsFolderName } = openmctConfig;
+
+        test.fixme(browserName === 'firefox', 'Firefox failing due to console events being missed');
         const errorLogs = [];
 
         page.on("console", (message) => {

e2e/tests/functional/search.e2e.spec.js

@@ -43,7 +43,7 @@ test.describe('Grand Search', () => {
         await expect(page.locator('[aria-label="Search Result"] >> nth=3')).toContainText(`Clock D ${myItemsFolderName} Red Folder Blue Folder`);
         // Click text=Elements >> nth=0
         await page.locator('text=Elements').first().click();
-        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeHidden();
+        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).not.toBeVisible();
 
         await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').click();
         await page.locator('[aria-label="Clock A clock result"] >> text=Clock A').click();
@@ -56,11 +56,11 @@ test.describe('Grand Search', () => {
 
         // Click [aria-label="OpenMCT Search"] a >> nth=0
         await page.locator('[aria-label="OpenMCT Search"] a').first().click();
-        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeHidden();
+        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).not.toBeVisible();
 
         // Fill [aria-label="OpenMCT Search"] input[type="search"]
         await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('foo');
-        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeHidden();
+        await expect(page.locator('[aria-label="Search Result"] >> nth=0')).not.toBeVisible();
 
         // Click text=Snapshot Save and Finish Editing Save and Continue Editing >> button >> nth=1
         await page.locator('text=Snapshot Save and Finish Editing Save and Continue Editing >> button').nth(1).click();

e2e/tests/visual/default.visual.spec.js

@@ -67,7 +67,7 @@ test.describe('Visual - Default', () => {
         await percySnapshot(page, `About (theme: '${theme}')`);
     });
 
-    test('Visual - Default Condition Set @unstable', async ({ page, theme }) => {
+    test.fixme('Visual - Default Condition Set', async ({ page, theme }) => {
 
         await createDomainObjectWithDefaults(page, { type: 'Condition Set' });
 
@@ -75,7 +75,7 @@ test.describe('Visual - Default', () => {
         await percySnapshot(page, `Default Condition Set (theme: '${theme}')`);
     });
 
-    test('Visual - Default Condition Widget @unstable', async ({ page, theme }) => {
+    test.fixme('Visual - Default Condition Widget', async ({ page, theme }) => {
         test.info().annotations.push({
             type: 'issue',
             description: 'https://github.com/nasa/openmct/issues/5349'
@@ -137,7 +137,7 @@ test.describe('Visual - Default', () => {
         await percySnapshot(page, `removed amplitude property value (theme: '${theme}')`);
     });
 
-    test('Visual - Save Successful Banner @unstable', async ({ page, theme }) => {
+    test.fixme('Visual - Save Successful Banner', async ({ page, theme }) => {
         await createDomainObjectWithDefaults(page, { type: 'Timer' });
 
         await page.locator('.c-message-banner__message').hover({ trial: true });
@@ -159,7 +159,7 @@ test.describe('Visual - Default', () => {
 
     });
 
-    test('Visual - Default Gauge is correct @unstable', async ({ page, theme }) => {
+    test.fixme('Visual - Default Gauge is correct', async ({ page, theme }) => {
         await createDomainObjectWithDefaults(page, { type: 'Gauge' });
 
         // Take a snapshot of the newly created Gauge object

package.json

@@ -5,9 +5,9 @@
   "devDependencies": {
     "@babel/eslint-parser": "7.18.9",
     "@braintree/sanitize-url": "6.0.0",
-    "@percy/cli": "1.7.2",
+    "@percy/cli": "1.8.1",
     "@percy/playwright": "1.0.4",
-    "@playwright/test": "1.25.2",
+    "@playwright/test": "1.23.0",
     "@types/eventemitter3": "^1.0.0",
     "@types/jasmine": "^4.0.1",
     "@types/karma": "^6.3.2",
@@ -23,9 +23,9 @@
     "d3-axis": "3.0.0",
     "d3-scale": "3.3.0",
     "d3-selection": "3.0.0",
-    "eslint": "8.23.0",
+    "eslint": "8.18.0",
     "eslint-plugin-compat": "4.0.2",
-    "eslint-plugin-playwright": "0.11.1",
+    "eslint-plugin-playwright": "0.10.0",
     "eslint-plugin-vue": "9.3.0",
     "eslint-plugin-you-dont-need-lodash-underscore": "6.12.0",
     "eventemitter3": "1.2.0",
@@ -33,8 +33,9 @@
     "file-saver": "2.0.5",
     "git-rev-sync": "3.0.2",
     "html2canvas": "1.4.1",
-    "imports-loader": "4.0.1",
-    "jasmine-core": "4.4.0",
+    "imports-loader": "0.8.0",
+    "jasmine-core": "4.3.0",
+    "jsdoc": "3.6.11",
     "karma": "6.3.20",
     "karma-chrome-launcher": "3.1.1",
     "karma-cli": "2.0.0",
@@ -45,24 +46,26 @@
     "karma-sourcemap-loader": "0.3.8",
     "karma-spec-reporter": "0.0.34",
     "karma-webpack": "5.0.0",
+    "lighthouse": "9.6.1",
     "location-bar": "3.0.1",
     "lodash": "4.17.21",
     "mini-css-extract-plugin": "2.6.1",
     "moment": "2.29.4",
     "moment-duration-format": "2.3.2",
-    "moment-timezone": "0.5.37",
+    "moment-timezone": "0.5.34",
+    "node-bourbon": "4.2.3",
     "nyc":"15.1.0",
     "painterro": "1.2.78",
-    "plotly.js-basic-dist": "2.14.0",
-    "plotly.js-gl2d-dist": "2.14.0",
+    "plotly.js-basic-dist": "2.12.0",
+    "plotly.js-gl2d-dist": "2.12.0",
     "printj": "1.3.1",
     "request": "2.88.2",
     "resolve-url-loader": "5.0.0",
-    "sass": "1.54.4",
+    "sass": "1.52.2",
     "sass-loader": "13.0.2",
     "sinon": "14.0.0",
     "style-loader": "^1.0.1",
-    "uuid": "9.0.0",
+    "uuid": "8.3.2",
     "vue": "2.6.14",
     "vue-eslint-parser": "9.0.2",
     "vue-loader": "15.9.8",
@@ -93,11 +96,14 @@
     "test:e2e:local": "npx playwright test --config=e2e/playwright-local.config.js --project=chrome",
     "test:e2e:updatesnapshots": "npx playwright test --config=e2e/playwright-ci.config.js --project=chrome --grep @snapshot --update-snapshots",
     "test:e2e:visual": "percy exec --config ./e2e/.percy.yml -- npx playwright test --config=e2e/playwright-visual.config.js --grep-invert @unstable",
-    "test:e2e:full": "npx playwright test --config=e2e/playwright-ci.config.js --grep-invert @couchdb",
+    "test:e2e:full": "npx playwright test --config=e2e/playwright-ci.config.js",
     "test:perf": "npx playwright test --config=e2e/playwright-performance.config.js",
     "test:watch": "cross-env NODE_ENV=test NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --no-single-run",
+    "jsdoc": "jsdoc -c jsdoc.json -R API.md -r -d dist/docs/api",
     "update-about-dialog-copyright": "perl -pi -e 's/20\\d\\d\\-202\\d/2014\\-2022/gm' ./src/ui/layout/AboutDialog.vue",
     "update-copyright-date": "npm run update-about-dialog-copyright && grep -lr --null --include=*.{js,scss,vue,ts,sh,html,md,frag} 'Copyright (c) 20' . | xargs -r0 perl -pi -e 's/Copyright\\s\\(c\\)\\s20\\d\\d\\-20\\d\\d/Copyright \\(c\\)\\ 2014\\-2022/gm'",
+    "otherdoc": "node docs/gendocs.js --in docs/src --out dist/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",
+    "docs": "npm run jsdoc ; npm run otherdoc",
     "cov:e2e:report":"nyc report --reporter=lcovonly --report-dir=./coverage/e2e",
     "cov:e2e:full:publish":"codecov --disable=gcov -f ./coverage/e2e/lcov.info -F e2e-full",
     "cov:e2e:stable:publish":"codecov --disable=gcov -f ./coverage/e2e/lcov.info -F e2e-stable",

src/api/time/TimeAPI.js

@@ -171,38 +171,27 @@ class TimeAPI extends GlobalTimeContext {
      * @memberof module:openmct.TimeAPI#
      * @method getContextForView
      */
-    getContextForView(objectPath) {
-        if (!objectPath || !Array.isArray(objectPath)) {
-            throw new Error('No objectPath provided');
-        }
-
+    getContextForView(objectPath = []) {
         const viewKey = objectPath.length && this.openmct.objects.makeKeyString(objectPath[0].identifier);
 
-        if (!viewKey) {
-            // Return the global time context
-            return this;
-        }
-
-        let viewTimeContext = this.getIndependentContext(viewKey);
-        if (!viewTimeContext) {
-            // If the context doesn't exist yet, create it.
-            viewTimeContext = new IndependentTimeContext(this.openmct, this, objectPath);
-            this.independentContexts.set(viewKey, viewTimeContext);
-        } else {
-            // If it already exists, compare the objectPath to see if it needs to be updated.
-            const currentPath = this.openmct.objects.getRelativePath(viewTimeContext.objectPath);
-            const newPath = this.openmct.objects.getRelativePath(objectPath);
-
-            if (currentPath !== newPath) {
-                // If the path has changed, update the context.
+        if (viewKey) {
+            let viewTimeContext = this.getIndependentContext(viewKey);
+            if (viewTimeContext) {
                 this.independentContexts.delete(viewKey);
+            } else {
                 viewTimeContext = new IndependentTimeContext(this.openmct, this, objectPath);
-                this.independentContexts.set(viewKey, viewTimeContext);
             }
+
+            // return a new IndependentContext in case the objectPath is different
+            this.independentContexts.set(viewKey, viewTimeContext);
+
+            return viewTimeContext;
         }
 
-        return viewTimeContext;
+        // always follow the global time context
+        return this;
     }
+
 }
 
 export default TimeAPI;

src/plugins/URLTimeSettingsSynchronizer/pluginSpec.js

@@ -56,76 +56,85 @@ describe("The URLTimeSettingsSynchronizer", () => {
     it("initial clock is set to fixed is reflected in URL", (done) => {
         resolveFunction = () => {
             oldHash = window.location.hash;
-            expect(window.location.hash).toContain('tc.mode=fixed');
+            expect(window.location.hash.includes('tc.mode=fixed')).toBe(true);
 
             openmct.router.removeListener('change:hash', resolveFunction);
             done();
         };
 
-        // We have a debounce set to 300ms on setHash, so if we don't flush,
-        // the above resolve function sometimes doesn't fire due to a race condition.
-        openmct.router.setHash.flush();
         openmct.router.on('change:hash', resolveFunction);
     });
 
     it("when the clock is set via the time API, it is reflected in the URL", (done) => {
+        let success;
+
         resolveFunction = () => {
             openmct.time.clock('local', {
                 start: -2000,
                 end: 200
             });
-            openmct.router.setHash.flush();
-            const urlHash = window.location.hash;
-            expect(urlHash).toContain('tc.startDelta=2000');
-            expect(urlHash).toContain('tc.endDelta=200');
-            expect(urlHash).toContain('tc.mode=local');
-            openmct.router.removeListener('change:hash', resolveFunction);
-            done();
+
+            const hasStartDelta = window.location.hash.includes('tc.startDelta=2000');
+            const hasEndDelta = window.location.hash.includes('tc.endDelta=200');
+            const hasLocalClock = window.location.hash.includes('tc.mode=local');
+            success = hasStartDelta && hasEndDelta && hasLocalClock;
+            if (success) {
+                expect(success).toBe(true);
+
+                openmct.router.removeListener('change:hash', resolveFunction);
+                done();
+            }
         };
 
-        // We have a debounce set to 300ms on setHash, so if we don't flush,
-        // the above resolve function sometimes doesn't fire due to a race condition.
-        openmct.router.setHash.flush();
         openmct.router.on('change:hash', resolveFunction);
     });
 
     it("when the clock mode is set to local, it is reflected in the URL", (done) => {
+        let success;
+
         resolveFunction = () => {
             let hash = window.location.hash;
             hash = hash.replace('tc.mode=fixed', 'tc.mode=local');
             window.location.hash = hash;
 
-            expect(window.location.hash).toContain('tc.mode=local');
-            done();
+            success = window.location.hash.includes('tc.mode=local');
+            if (success) {
+                expect(success).toBe(true);
+                done();
+            }
         };
 
-        // We have a debounce set to 300ms on setHash, so if we don't flush,
-        // the above resolve function sometimes doesn't fire due to a race condition.
-        openmct.router.setHash.flush();
         openmct.router.on('change:hash', resolveFunction);
     });
 
     it("when the clock mode is set to local, it is reflected in the URL", (done) => {
+        let success;
+
         resolveFunction = () => {
             let hash = window.location.hash;
 
             hash = hash.replace('tc.mode=fixed', 'tc.mode=local');
             window.location.hash = hash;
-            expect(window.location.hash).toContain('tc.mode=local');
-            done();
+            success = window.location.hash.includes('tc.mode=local');
+            if (success) {
+                expect(success).toBe(true);
+                done();
+            }
         };
 
-        // We have a debounce set to 300ms on setHash, so if we don't flush,
-        // the above resolve function sometimes doesn't fire due to a race condition.
-        openmct.router.setHash.flush();
         openmct.router.on('change:hash', resolveFunction);
     });
 
     it("reset hash", (done) => {
+        let success;
+
         window.location.hash = oldHash;
         resolveFunction = () => {
-            expect(window.location.hash).toBe(oldHash);
-            done();
+            success = window.location.hash === oldHash;
+            if (success) {
+                expect(success).toBe(true);
+                done();
+            }
         };
 
         openmct.router.on('change:hash', resolveFunction);

src/plugins/flexibleLayout/components/flexibleLayout.vue

@@ -281,10 +281,6 @@ export default {
                 return false;
             }
 
-            if (!this.isEditing) {
-                return false;
-            }
-
             let containerId = event.dataTransfer.getData('containerid');
             let container = this.containers.filter((c) => c.id === containerId)[0];
             let containerPos = this.containers.indexOf(container);

src/plugins/flexibleLayout/components/frame.vue

@@ -31,7 +31,7 @@
     <div
         ref="frame"
         class="c-frame c-fl-frame__drag-wrapper is-selectable u-inspectable is-moveable"
-        :draggable="draggable"
+        draggable="true"
         @dragstart="initDrag"
     >
         <object-frame
@@ -93,9 +93,6 @@ export default {
     computed: {
         hasFrame() {
             return !this.frame.noFrame;
-        },
-        draggable() {
-            return this.isEditing;
         }
     },
     mounted() {

src/plugins/notebook/components/PageComponent.vue

@@ -12,10 +12,8 @@
     <template v-if="!page.isLocked">
         <div
             class="c-list__item__name js-list__item__name"
-            :class="[{ 'c-input-inline': isSelected }]"
             :data-id="page.id"
-            :contenteditable="isSelected"
-            @keydown.escape="updateName"
+            :contenteditable="true"
             @keydown.enter="updateName"
             @blur="updateName"
         >{{ pageName }}</div>
@@ -34,9 +32,8 @@
 </template>
 
 <script>
-import { KEY_ENTER, KEY_ESCAPE } from '../utils/notebook-key-code';
-import RemoveDialog from '../utils/removeDialog';
 import PopupMenu from './PopupMenu.vue';
+import RemoveDialog from '../utils/removeDialog';
 
 export default {
     components: {
@@ -110,39 +107,36 @@ export default {
             removeDialog.show();
         },
         selectPage(event) {
-            const { target: { dataset: { id } } } = event;
+            const target = event.target;
+            const id = target.dataset.id;
 
-            if (this.isSelected || !id) {
+            if (!this.page.isLocked) {
+                const page = target.closest('.js-list__item');
+                const input = page.querySelector('.js-list__item__name');
+
+                if (page.className.indexOf('is-selected') > -1) {
+                    input.classList.add('c-input-inline');
+
+                    return;
+                }
+            }
+
+            if (!id) {
                 return;
             }
 
             this.$emit('selectPage', id);
         },
-        renamePage(target) {
-            if (!target) {
-                return;
-            }
-
-            target.textContent = target.textContent ? target.textContent.trim() : `Unnamed ${this.pageTitle}`;
-
-            if (this.page.name === target.textContent) {
-                return;
-            }
-
-            this.$emit('renamePage', Object.assign(this.page, { name: target.textContent }));
-        },
         updateName(event) {
-            const { target, keyCode, type } = event;
+            const target = event.target;
+            const name = target.textContent.toString();
+            target.classList.remove('c-input-inline');
 
-            if (keyCode === KEY_ESCAPE) {
-                target.textContent = this.page.name;
-            } else if (keyCode === KEY_ENTER || type === 'blur') {
-                this.renamePage(target);
+            if (name === '' || this.page.name === name) {
+                return;
             }
 
-            target.scrollLeft = '0';
-
-            target.blur();
+            this.$emit('renamePage', Object.assign(this.page, { name }));
         }
     }
 };

src/plugins/notebook/components/PopupMenu.vue

@@ -1,7 +1,7 @@
 <template>
 <button
     class="c-popup-menu-button c-disclosure-button"
-    title="Open context menu"
+    title="popup menu"
     @click="showMenuItems"
 >
 </button>
@@ -65,10 +65,6 @@ export default {
             return;
         },
         showMenuItems($event) {
-            if (this.menuItems) {
-                this.hideMenuItems();
-            }
-
             const menuItems = new Vue({
                 components: {
                     MenuItems

src/plugins/notebook/components/SectionComponent.vue

@@ -7,10 +7,8 @@
 >
     <span
         class="c-list__item__name js-list__item__name"
-        :class="[{ 'c-input-inline': isSelected && !section.isLocked }]"
         :data-id="section.id"
-        :contenteditable="isSelected && !section.isLocked"
-        @keydown.escape="updateName"
+        contenteditable="true"
         @keydown.enter="updateName"
         @blur="updateName"
     >{{ sectionName }}</span>
@@ -22,9 +20,8 @@
 </template>
 
 <script>
-import { KEY_ENTER, KEY_ESCAPE } from '../utils/notebook-key-code';
-import RemoveDialog from '../utils/removeDialog';
 import PopupMenu from './PopupMenu.vue';
+import RemoveDialog from '../utils/removeDialog';
 
 export default {
     components: {
@@ -99,39 +96,36 @@ export default {
             removeDialog.show();
         },
         selectSection(event) {
-            const { target: { dataset: { id } } } = event;
+            const target = event.target;
+            const id = target.dataset.id;
 
-            if (this.isSelected || !id) {
+            if (!this.section.isLocked) {
+                const section = target.closest('.js-list__item');
+                const input = section.querySelector('.js-list__item__name');
+
+                if (section.className.indexOf('is-selected') > -1) {
+                    input.classList.add('c-input-inline');
+
+                    return;
+                }
+            }
+
+            if (!id) {
                 return;
             }
 
             this.$emit('selectSection', id);
         },
-        renameSection(target) {
-            if (!target) {
-                return;
-            }
-
-            target.textContent = target.textContent ? target.textContent.trim() : `Unnamed ${this.sectionTitle}`;
-
-            if (this.section.name === target.textContent) {
-                return;
-            }
-
-            this.$emit('renameSection', Object.assign(this.section, { name: target.textContent }));
-        },
         updateName(event) {
-            const { target, keyCode, type } = event;
+            const target = event.target;
+            target.classList.remove('c-input-inline');
+            const name = target.textContent.trim();
 
-            if (keyCode === KEY_ESCAPE) {
-                target.textContent = this.section.name;
-            } else if (keyCode === KEY_ENTER || type === 'blur') {
-                this.renameSection(target);
+            if (name === '' || this.section.name === name) {
+                return;
             }
 
-            target.scrollLeft = '0';
-
-            target.blur();
+            this.$emit('renameSection', Object.assign(this.section, { name }));
         }
     }
 };

src/plugins/notebook/components/sidebar.scss

@@ -88,7 +88,7 @@
         }
 
         &__name {
-            flex: 1 1 auto;
+            flex: 0 1 auto;
         }
 
         &__menu-indicator {

src/plugins/notebook/utils/notebook-key-code.js

@@ -1,3 +0,0 @@
-// Key codes for `KeyboardEvent.keyCode`.
-export const KEY_ENTER = 13;
-export const KEY_ESCAPE = 27;

src/plugins/persistence/couch/setup-couchdb.sh

@@ -83,18 +83,6 @@ create_admin_user () {
     curl -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/admins/$COUCH_ADMIN_USER -d \'"$COUCH_ADMIN_PASSWORD"\'
 }
 
-is_cors_enabled() {
-    resource_exists $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/httpd/enable_cors
-}
-
-enable_cors () {
-    curl -su "${CURL_USERPASS_ARG}" -o /dev/null -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/httpd/enable_cors -d '"true"'
-    curl -su "${CURL_USERPASS_ARG}" -o /dev/null -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/cors/origins -d '"*"'
-    curl -su "${CURL_USERPASS_ARG}" -o /dev/null -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/cors/credentials -d '"true"'
-    curl -su "${CURL_USERPASS_ARG}" -o /dev/null -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/cors/methods -d '"GET, PUT, POST, HEAD, DELETE"'
-    curl -su "${CURL_USERPASS_ARG}" -o /dev/null -X PUT $COUCH_BASE_LOCAL/_node/$COUCH_NODE_NAME/_config/cors/headers -d '"accept, authorization, content-type, origin, referer, x-csrf-token"'
-}
-
 if [ "$(admin_user_exists)" == "FALSE" ]; then
     echo "Admin user does not exist, creating..."
     create_admin_user
@@ -135,10 +123,3 @@ if [ "{\"ok\":true}" == "${response}" ]; then
 else
     echo "Database permissions not updated"
 fi
-
-if [ "FALSE" == $(is_cors_enabled) ]; then
-    echo "Enabling CORS"
-    enable_cors
-else
-    echo "CORS enabled, nothing to do"
-fi

src/plugins/plot/inspector/PlotOptionsBrowse.vue

@@ -136,7 +136,7 @@
                     <span v-if="showValueWhenExpanded">Value</span>
                     <span v-if="showMinimumWhenExpanded">Min</span>
                     <span v-if="showMaximumWhenExpanded">Max</span>
-                    <span v-if="showUnitsWhenExpanded">Unit</span>
+                    <span v-if="showUnitsWhenExpanded">Units</span>
                 </div>
             </li>
         </ul>

src/plugins/plot/inspector/forms/LegendForm.vue

@@ -54,7 +54,7 @@
                 <option value="nearestValue">Nearest value</option>
                 <option value="min">Minimum value</option>
                 <option value="max">Maximum value</option>
-                <option value="unit">Unit</option>
+                <option value="units">Units</option>
             </select>
         </div>
     </li>
@@ -89,7 +89,7 @@
                     v-model="showUnitsWhenExpanded"
                     type="checkbox"
                     @change="updateForm('showUnitsWhenExpanded')"
-                > Unit</li>
+                > Units</li>
             </ul>
 
         </div>

src/plugins/plot/legend/PlotLegendItemCollapsed.vue

@@ -41,7 +41,7 @@
         <span class="plot-series-name">{{ nameWithUnit }}</span>
     </div>
     <div
-        v-show="!!highlights.length && (valueToShowWhenCollapsed !== 'none' && valueToShowWhenCollapsed !== 'unit')"
+        v-show="!!highlights.length && (valueToShowWhenCollapsed !== 'none' && valueToShowWhenCollapsed !== 'units')"
         class="plot-series-value hover-value-enabled"
         :class="[{ 'cursor-hover': notNearest }, valueToDisplayWhenCollapsedClass, mctLimitStateClass]"
     >

src/plugins/plugins.js

@@ -58,6 +58,7 @@ define([
     './condition/plugin',
     './conditionWidget/plugin',
     './themes/espresso',
+    './themes/maelstrom',
     './themes/snow',
     './URLTimeSettingsSynchronizer/plugin',
     './notificationIndicator/plugin',
@@ -121,6 +122,7 @@ define([
     ConditionPlugin,
     ConditionWidgetPlugin,
     Espresso,
+    Maelstrom,
     Snow,
     URLTimeSettingsSynchronizer,
     NotificationIndicator,
@@ -205,6 +207,7 @@ define([
     plugins.ClearData = ClearData;
     plugins.WebPage = WebPagePlugin.default;
     plugins.Espresso = Espresso.default;
+    plugins.Maelstrom = Maelstrom.default;
     plugins.Snow = Snow.default;
     plugins.Condition = ConditionPlugin.default;
     plugins.ConditionWidget = ConditionWidgetPlugin.default;

src/plugins/remoteClock/requestInterceptor.js

@@ -20,15 +20,17 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-function remoteClockRequestInterceptor(openmct, _remoteClockIdentifier, waitForBounds) {
+function remoteClockRequestInterceptor(openmct, remoteClockIdentifier, waitForBounds) {
     let remoteClockLoaded = false;
 
     return {
         appliesTo: () => {
             // Get the activeClock from the Global Time Context
-            const { activeClock } = openmct.time;
+            const { activeClock } = openmct.time.getContextForView();
 
-            return activeClock?.key === 'remote-clock' && !remoteClockLoaded;
+            return activeClock !== undefined
+            && activeClock.key === 'remote-clock'
+            && !remoteClockLoaded;
         },
         invoke: async (request) => {
             const { start, end } = await waitForBounds();

src/plugins/themes/maelstrom-theme.scss

@@ -0,0 +1,22 @@
+@import "../../styles/vendor/normalize-min";
+@import "../../styles/constants";
+@import "../../styles/constants-mobile.scss";
+
+@import "../../styles/constants-maelstrom";
+
+@import "../../styles/mixins";
+@import "../../styles/animations";
+@import "../../styles/about";
+@import "../../styles/glyphs";
+@import "../../styles/global";
+@import "../../styles/status";
+@import "../../styles/limits";
+@import "../../styles/controls";
+@import "../../styles/forms";
+@import "../../styles/table";
+@import "../../styles/legacy";
+@import "../../styles/legacy-plots";
+@import "../../styles/plotly";
+@import "../../styles/legacy-messages";
+
+@import "../../styles/vue-styles.scss";

src/plugins/themes/maelstrom.js

@@ -0,0 +1,7 @@
+import { installTheme } from './installTheme';
+
+export default function plugin() {
+    return function install(openmct) {
+        installTheme(openmct, 'maelstrom');
+    };
+}

src/plugins/timeConductor/ConductorInputsFixed.vue

@@ -78,12 +78,6 @@ export default {
             default() {
                 return undefined;
             }
-        },
-        objectPath: {
-            type: Array,
-            default() {
-                return [];
-            }
         }
     },
     data() {
@@ -133,7 +127,7 @@ export default {
     methods: {
         setTimeContext() {
             this.stopFollowingTimeContext();
-            this.timeContext = this.openmct.time.getContextForView(this.keyString ? this.objectPath : []);
+            this.timeContext = this.openmct.time.getContextForView(this.keyString ? [{identifier: this.keyString}] : []);
 
             this.handleNewBounds(this.timeContext.bounds());
             this.timeContext.on('bounds', this.handleNewBounds);

src/plugins/timeConductor/ConductorInputsRealtime.vue

@@ -90,12 +90,6 @@ export default {
                 return undefined;
             }
         },
-        objectPath: {
-            type: Array,
-            default() {
-                return [];
-            }
-        },
         inputBounds: {
             type: Object,
             default() {
@@ -168,7 +162,7 @@ export default {
         },
         setTimeContext() {
             this.stopFollowingTime();
-            this.timeContext = this.openmct.time.getContextForView(this.keyString ? this.objectPath : []);
+            this.timeContext = this.openmct.time.getContextForView(this.keyString ? [{identifier: this.keyString}] : []);
             this.followTime();
         },
         handleNewBounds(bounds) {

src/plugins/timeConductor/independent/IndependentTimeConductor.vue

@@ -52,14 +52,12 @@
             <conductor-inputs-fixed
                 v-if="isFixed"
                 :key-string="domainObject.identifier.key"
-                :object-path="objectPath"
                 @updated="saveFixedOffsets"
             />
 
             <conductor-inputs-realtime
                 v-else
                 :key-string="domainObject.identifier.key"
-                :object-path="objectPath"
                 @updated="saveClockOffsets"
             />
         </div>
@@ -87,10 +85,6 @@ export default {
         domainObject: {
             type: Object,
             required: true
-        },
-        objectPath: {
-            type: Array,
-            required: true
         }
     },
     data() {
@@ -170,7 +164,7 @@ export default {
         },
         setTimeContext() {
             this.stopFollowingTimeContext();
-            this.timeContext = this.openmct.time.getContextForView(this.objectPath);
+            this.timeContext = this.openmct.time.getContextForView([this.domainObject]);
             this.timeContext.on('clock', this.setTimeOptions);
         },
         stopFollowingTimeContext() {

src/styles/notebook.scss

@@ -744,9 +744,3 @@ body.mobile {
         }
     }
 }
-
-.c-list__item {
-    &__name:focus {
-        text-overflow: clip;
-    }
-}

src/ui/components/ObjectView.vue

@@ -6,7 +6,6 @@
     >
         <independent-time-conductor
             :domain-object="domainObject"
-            :object-path="path"
             @stateChanged="updateIndependentTimeState"
             @updated="saveTimeOptions"
         />
@@ -68,9 +67,6 @@ export default {
         };
     },
     computed: {
-        path() {
-            return this.domainObject && (this.currentObjectPath || this.objectPath);
-        },
         objectFontStyle() {
             return this.domainObject && this.domainObject.configuration && this.domainObject.configuration.fontStyle;
         },

src/ui/layout/search/GrandSearch.vue

@@ -95,11 +95,6 @@ export default {
         },
         getPathsForObjects(objectsNeedingPaths) {
             return Promise.all(objectsNeedingPaths.map(async (domainObject) => {
-                if (!domainObject) {
-                    // user interrupted search, return back
-                    return null;
-                }
-
                 const keyStringForObject = this.openmct.objects.makeKeyString(domainObject.identifier);
                 const originalPathObjects = await this.openmct.objects.getOriginalPath(keyStringForObject);
 
@@ -132,17 +127,12 @@ export default {
                 this.searchLoading = false;
                 this.showSearchResults();
             } catch (error) {
+                console.error(`😞 Error searching`, error);
                 this.searchLoading = false;
 
                 if (this.abortSearchController) {
                     delete this.abortSearchController;
                 }
-
-                // Is this coming from the AbortController?
-                // If so, we can swallow the error. If not, 🤮 it to console
-                if (error.name !== 'AbortError') {
-                    console.error(`😞 Error searching`, error);
-                }
             }
         },
         showSearchResults() {

src/ui/router/ApplicationRouterSpec.js

@@ -28,9 +28,6 @@ describe('Application router utility functions', () => {
             };
 
             openmct.router.on('change:hash', resolveFunction);
-            // We have a debounce set to 300ms on setHash, so if we don't flush,
-            // the above resolve function sometimes doesn't fire due to a race condition.
-            openmct.router.setHash.flush();
             openmct.router.setLocationFromUrl();
         });
 

webpack.common.js

@@ -30,6 +30,7 @@ const config = {
         inMemorySearchWorker: './src/api/objects/InMemorySearchWorker.js',
         espressoTheme: './src/plugins/themes/espresso-theme.scss',
         snowTheme: './src/plugins/themes/snow-theme.scss',
+        maelstromTheme: './src/plugins/themes/maelstrom-theme.scss'
     },
     output: {
         globalObject: 'this',