Add notebook stubs and testcases

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

@@ -0,0 +1,46 @@
+/*****************************************************************************
+ * 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.
+ *****************************************************************************/
+
+/*
+This test suite is dedicated to tests which verify the basic operations surrounding Notebooks.
+*/
+
+const { test, expect } = require('@playwright/test');
+
+test.describe('Notebook CRUD Operations', () => {
+    test.fixme('Can create a Notebook Object', async ({ page }) => {
+        //Create domain object
+    });
+    test.fixme('Can update a Notebook Object', async ({ page }) => {
+        //Create domain object
+        //Save Domain Object
+        //Verify that the newly created domain object can be exported as JSON from the 3 dot menu
+    });
+    test.fixme('Can view a perviously created Notebook Object', async ({ page }) => {
+        // Create 2 objects with hierarchy
+        // Export as JSON
+        // Verify Hiearchy
+    });
+    test.fixme('Can Delete a Notebook Object', async ({ page }) => {
+        // Other than non-persistible objects
+    });
+});

e2e/tests/plugins/notebook/notebookTesting.md

@@ -0,0 +1,114 @@
+    Notebook Testing:
+## Useful commands:
+1.  - To check default notebook:
+    `JSON.parse(localStorage.getItem('notebook-storage'));`
+1.  - Clear default notebook:
+    `localStorage.setItem('notebook-storage', null);`
+
+## I. Default Notebook:
+1. Make sure there is no default notebook
+    `localStorage.setItem('notebook-storage', null);`
+2. Check for default notebook is null
+    `JSON.parse(localStorage.getItem('notebook-storage'));`
+3. Create 2 notebooks, add entry into first one to make it default now add entry to other one. Verify by icon change and using following
+    1. `JSON.parse(localStorage.getItem('notebook-storage'));`
+    2. There is default icon on notebook inside tree and main view after notebook name
+    3. Inside default notebook, default section and page has deafult icon.
+4. Delete default notebook and check for default notebook is null and default icons are removed.
+    `JSON.parse(localStorage.getItem('notebook-storage'));`
+
+## II. Sections and Pages:
+1.  - Newly created notebook should have one Section and one page, 'Unnamed Section'/'Unnamed Page'
+
+### - Sections:
+1.  - Rename existing section '1 Section' and '1 Page'
+    - click 'add section' new section - should be added 'Unnamed Section' with new page 'Unnamed Page'
+1.  - Delete existing section
+    - new 'Unnamed Section' automatically gets created.
+1.  - Have 5 total sections without a default section/page
+    - select 3nd section then delete 4th section
+    - 3rd is still selected
+1.  -  Have 5 total sections without a default section/page
+    - select 3rd section then delete 3rd section
+    - 1st is now selected
+1.  - Have 5 total sections with a 3rd section as default section
+    - select 2nd section then delete 2nd section
+    - 3rd (default) is now selected
+1.  - Have 5 total sections with a 3rd section as default section
+    - select 3rd section then delete 3rd section
+    - 1st is now selected and there is no default notebook
+
+### - Pages:
+1.  - Delete existing page
+    - new 'Unnamed Page' automatically gets created
+1.  - Have 5 total pages without a default page
+    - select 3nd page then delete 4th page
+    - 3rd is still selected
+1.  - Have 5 total pages without a default page
+    - select 3rd page then delete 3rd page
+    - 1st is now selected
+1.  - Have 5 total pages with a 3rd page as default page
+    - select 2nd page then delete 2nd page
+    - 3rd (default) is now selected
+1.  - Have 5 total pages with a 3rd page as default page
+    - select 3rd page then delete 3rd page
+    - 1st is now selected and there is no default notebook
+
+## III. Entries:
+1.  - Add new entry into page should create entry and focus on it
+1.  - Drag and drop any telmetry object on 'drop object'
+    - new entry gets created with telemtry object
+1.  - Add new entry into page
+    - drop any telmetry object on this entry
+    - telmetry object appears inside this entry
+1.  - Add new entry into page, enter text
+    - navigate away and return
+    - edit entry text
+    - navigate away and return back
+    - confirm text is correct
+1.  - delete previously created entry
+
+## IV: Snapshot Menu:
+1.  - There should be no default notebook
+    - Clear default notebook if exists using `localStorage.setItem('notebook-storage', null);`
+    - refresh page
+    - Click on 'Notebook Snaphot Menu'
+    - Following popup option should be there
+        1. save to Notebook Snapshots
+1.  - Check for default notebook if there is one, else add some entry into one of notebook to make it default
+    - Click on 'Notebook Snaphot Menu'
+    - Following popup options should be there
+        1. save to Default Notebook
+        1. save to Notebook Snapshots
+1.  - Select any telemetry object eg: SWG
+    - From 'Notebook Snaphot Menu' click on 'save to Default Notebook'
+    - Navigate to default notebook - section - page and verify that SWG snaphot has been added with correct details
+
+## V: Snapshot container:
+1.  - Select any telemetry object eg: SWG
+    - Click on 'Notebook Snaphot Menu'
+    - from popup options click on 'save to Notebook Snapshots'
+    - Snapshots indicator should blink, click on it to view snapshots
+    - drag and drop snapshot on droppable area for new enrty
+    - this should create a new entry with given snaphot has been added to it
+1.  - Select any telemetry object eg: SWG
+    - Click on 'Notebook Snaphot Menu'
+    - from popup options click on 'save to Notebook Snapshots'
+    - Snapshots indicator should blink, click on it to view snapshots
+    - goto any notebook with pre exisintg entry (if not create new entry)
+    - drag and drop snapshot on exisintg entry
+    - this should add a given snaphot inside that entry
+
+## VI: Embeds:
+1.  - Add SWG using snapshot to notebook
+    - Go to that entry
+    - click on thumbnail image
+    - should open image with PNG, JPG and Annotate buttons
+    - verify they all work as intended
+1.  - Add SWG using snapshot to notebook
+    - note down start and end time on time conductor and Fixed Timestamp/Local Clock
+    - Go to that entry
+    - change start and end time on time conductor if Local Clock
+    - click on embed Name/Text
+    - should take to that object
+    - also verify that start and end time on time conductor (also should automatically switch to Fixed timestamp)*/

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

@@ -0,0 +1,126 @@
+/*****************************************************************************
+ * 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.
+ *****************************************************************************/
+
+/*
+Collection of Visual Tests set to run in a default context. The tests within this suite
+are only meant to run against openmct's app.js started by `npm run start` within the
+`./e2e/playwright-visual.config.js` file.
+
+These should only use functional expect statements to verify assumptions about the state
+in a test and not for functional verification of correctness. Visual tests are not supposed
+to "fail" on assertions. Instead, they should be used to detect changes between builds or branches.
+
+Note: Larger testsuite sizes are OK due to the setup time associated with these tests.
+*/
+
+const { test, expect } = require('@playwright/test');
+const percySnapshot = require('@percy/playwright');
+const path = require('path');
+const sinon = require('sinon');
+
+const VISUAL_GRACE_PERIOD = 5 * 1000; //Lets the application "simmer" before the snapshot is taken
+
+// // Snippet from https://github.com/microsoft/playwright/issues/6347#issuecomment-965887758
+// //Will replace with cy.clock() equivalent
+test.beforeEach(async ({ context }) => {
+    await context.addInitScript({
+        // eslint-disable-next-line no-undef
+        path: path.join(__dirname, '../../..', './node_modules/sinon/pkg/sinon.js')
+    });
+    await context.addInitScript(() => {
+        window.__clock = sinon.useFakeTimers({
+            now: 1483228800000,
+            shouldAdvanceTime: true
+        }); //Set browser clock to UNIX Epoch
+    });
+});
+
+test('Visual - Display layout items view', async ({ page }) => {
+    //Go to baseURL
+    await page.goto('/', { waitUntil: 'networkidle' });
+
+    await page.evaluate(() => window.__clock.tick(1000));
+
+    //Click the Create button
+    await page.click('button:has-text("Create")');
+
+    // Click text=Display Layout
+    await page.click('text=Display Layout');
+
+    // Click text=OK
+    await page.click('text=OK');
+
+    // Take a snapshot of the newly created Display Layout object
+    await page.waitForTimeout(VISUAL_GRACE_PERIOD);
+    await percySnapshot(page, 'Default Display Layout');
+
+    // 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 the Create button
+    await page.click('button:has-text("Create")');
+
+    // Click text=Sine Wave Generator
+    await page.click('text=Sine Wave Generator');
+
+    // Click text=Save In Open MCT No items >> input[type="search"]
+    await page.locator('text=Save In Open MCT No items >> input[type="search"]').click();
+
+    // Fill text=Save In Open MCT No items >> input[type="search"]
+    await page.locator('text=Save In Open MCT No items >> input[type="search"]').fill('Unnamed Display Layout');
+
+    // Click text=OK Cancel
+    await page.locator('text=OK Cancel').click();
+
+    // Click text=OK
+    await page.click('text=OK');
+
+    // Take a snapshot of the newly created Display Layout object
+    await page.waitForTimeout(VISUAL_GRACE_PERIOD);
+    await percySnapshot(page, 'Default Sine Wave Generator');
+
+});
+
+test.skip('Visual - Timestrip', async ({ page }) => {
+    //Go to baseURL
+    await page.goto('/', { waitUntil: 'networkidle' });
+
+    //Click the Create button
+    await page.click('button:has-text("Create")');
+
+    // Click li:has-text("Example Imagery")
+    await page.locator('li:has-text("Example Imagery")').click();
+
+    // Fill input[type="number"]
+    //await page.locator('input[type="number"]').fill('500');
+
+    // Click text=OK
+    await page.locator('text=OK').click();
+
+    await page.pause();
+    // 
+    await page.waitForTimeout(VISUAL_GRACE_PERIOD);
+    await percySnapshot(page, 'Default Timestrip created');
+});

e2e/tests/visual/modifiedClock.visual.spec.js

@@ -22,14 +22,14 @@
 
 /*
 Collection of Visual Tests set to run in a default context. The tests within this suite
-are only meant to run against openmct's app.js started by `npm run start` within the 
+are only meant to run against openmct's app.js started by `npm run start` within the
 `./e2e/playwright-visual.config.js` file.
 
-These should only use functional expect statements to verify assumptions about the state 
+These should only use functional expect statements to verify assumptions about the state
 in a test and not for functional verification of correctness. Visual tests are not supposed
 to "fail" on assertions. Instead, they should be used to detect changes between builds or branches.
 
-Note: Larger testsuite sizes are OK due to the setup time associated with these tests. 
+Note: Larger testsuite sizes are OK due to the setup time associated with these tests.
 */
 
 const { test, expect } = require('@playwright/test');
@@ -40,7 +40,7 @@ const sinon = require('sinon');
 const VISUAL_GRACE_PERIOD = 5 * 1000; //Lets the application "simmer" before the snapshot is taken
 
 // Snippet from https://github.com/microsoft/playwright/issues/6347#issuecomment-965887758
-// Will replace with cy.clock() equivalent
+//Will replace with cy.clock() equivalent
 test.beforeEach(async ({ context }) => {
     await context.addInitScript({
         // eslint-disable-next-line no-undef
@@ -171,3 +171,25 @@ test('Visual - Sine Wave Generator Form', async ({ page }) => {
     await page.waitForTimeout(VISUAL_GRACE_PERIOD);
     await percySnapshot(page, 'removed amplitude property value');
 });
+
+test.only('Visual - Timestrip', async ({ page }) => {
+    //Go to baseURL
+    await page.goto('/', { waitUntil: 'networkidle' });
+
+    //Click the Create button
+    await page.click('button:has-text("Create")');
+
+    // Click li:has-text("Example Imagery")
+    await page.locator('li:has-text("Example Imagery")').click();
+
+    // Fill input[type="number"]
+    //await page.locator('input[type="number"]').fill('500');
+
+    // Click text=OK
+    await page.locator('text=OK').click();
+
+    await page.pause();
+    // 
+    await page.waitForTimeout(VISUAL_GRACE_PERIOD);
+    await percySnapshot(page, 'Default Timestrip created');
+});