ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-01-19 11:17:04 +00:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

2.0.5 Backmerge (#5505)

Browse Source 
* Bump d3-selection from 1.3.2 to 3.0.0

Bumps [d3-selection](https://github.com/d3/d3-selection) from 1.3.2 to 3.0.0.
- [Release notes](https://github.com/d3/d3-selection/releases)
- [Commits](https://github.com/d3/d3-selection/compare/v1.3.2...v3.0.0)

---
updated-dependencies:
- dependency-name: d3-selection
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* Remove snapshot

* Fix imagery filter slider drag in flexible layouts (#5326) (#5350)

* Dont' mutate a stacked plot unless its user initiated (#5357)

* Port grid icons and imagery test to release 2.0.5 from master (#5360)

* Port grid icons to release 2.0.5 from master

* Port imagery test to release/2.0.5

* Restrict timestrip composition to time based plots, plans and imagery (#5161)

* Restrict timestrip composition to time based plots, plans and imagery

* Adds unit tests for timeline composition policy

* Addresses review comments
Improves tests

* Reuse test objects

Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>

* Include objectStyles reference to conditionSetIdentifier in imports (#5354)

* Include objectStyles reference to conditionSetIdentifier in imports

* Add tests for export

* Refactored some code and removed console log

* Remove workarounds for chrome 'scrollTop' issue (#5375)

* Fix naming of method (#5368)

* Imagery View does not discard old images when they fall out of bounds (#5351)

* change to using telemetry collection

* fix tests

* added more unit tests

* Cherrypicked commits (#5390)

Co-authored-by: unlikelyzero <jchill2@gmail.com>

* [Timer] Update 3dot menu actions appropriately (#5387)

* Call `removeAllListeners()` after emit

* Manually show/hide actions if within a view

* remove sneaky `console.log()`

* Add Timer e2e test

* Add to comments

* Avoid hard waits in Timer e2e test

- Assert against timer view state instead of menu options

* Let's also test actions from the Timer view

* 5391 Add preview and drag support to Grand Search (#5394)

* add preview and drag actions

* added unit test, simplified remove action

* do not hide search results in preview mode when clicking outside search results

* add semantic aria labels to enable e2e tests

* readd preview

* add e2e test

* remove commented out url

* add percy snapshot and add search to ci

* make percy stuff work

* linting

* fix percy again

* move percy snapshots to a visual test

* added separate visual test and changed test to fixtures

* fix fixtures path

* addressing review comments

* 5361 tags not persisting locally (#5408)

* fixed typo

* remove unneeded lookup

* fix tags adding and deleting

* more reliable way to remove tags

* break tests up for parallel execution

* fixed notebook tagging test

* enable e2e tests

* made schedule index comment more clear and fix uppercase/lowercase issue

* address e2e changes

* add unit test to bump coverage

* fix typo

* need to check on annotation creation if provider exists or not

* added fixtures

* undo silly couchdb commit

* Plot progress bar fix for 2.0.5 (#5386)

* Add .bind(this) to stopLoading() in loadMoreData()

* Replace load spinner with progress bar for plots

* Add loading delay prop to swg

* fix linting errors

* match load order

* Update accessibility

* Add Math.max to timeout to handle negative inputs

* Moved math.max to load delay variable

* Add loading fix for stacked plots

* Move loadingUpdate func into plot item for update

* Merge conflict resolve

* Check if delay is 0 and send, put post in a func

* Put obj directly to model, removed computed prop

* Lint fix

* Fix template where legend was not displayed

* Remove commented out template

* Fixed failing test

Co-authored-by: unlikelyzero <jchill2@gmail.com>

* Make plans non editable. (#5377)

* Make plans non editable.

* Add unit test for fix

* [CouchDB] Better determination of indicator status (#5415)

* Add unknown state, remove maintenance state

* Handle all CouchDB status codes

- Set unknown status if we receive an unhandled code

* Include status code in error messages

* SharedWorker can send unknown status

* Add test for unknown status

* Gauge fixes for Firefox and units display (#5369)

* Closes #5323, #5325. Parent branch is release/2.0.5.
- Significant work refactoring SVG markup and CSS for dial gauge;
- Fixed missing `v-if` to control display of units for #5325;
- Fixed bad `.length` test for limit properties;

* Closes #5323, #5325
- Add 'value out of range' indicator

* Closes #5323, #5325
- More accurate element naming;
- Fix cross-browser problems with current value display in dial gauge;
- Refinements to "out of range" indicator approach;
- Fixed size of "Amplitude" input in Sine Wave Generator;

* Closes #5323, #5325
- Styles and stubbed in code to support needle meter type;

* Closes #5323, #5325
- Stubbed in markup and CSS for needle-style meter;

* Closes #5323, #5325
- Fixed missing `js-*` classes that were failing npm run test;

* Closes #5323, #5325
- Fix to not display meter value bar unless a data value is expected;

* Addressing PR comments
- Renamed method for clarity;
- Added null value check in method `valueExpected`;

* [Static Root] Return leafValue if null/undefined/false (#5416)

* Return leafValue if null/undefined/false

* Added a null to the test json

* Show a better default poll question (#5425)

* 5361 Tags not persisting when several notebook entries are created at once (#5428)

* add end to end test to catch multiple entry errors

* click expansion triangle instead

* fix race condition between annotation creation and mutation

* make sure notebook tags run in e2e

* address PR comments

* Handle missing objects gracefully  (#5399)

* Handle missing object errors for display layouts
* Handle missing object errors for Overlay Plots
* Add check for this.config
* Add try/catch statement & check if obj is missing
* Changed console.error to console.warn
* Lint fix
* Fix for this.metadata.value is undefined
* Add e2e test
* Update comment text
* Add reload check and @private, verify console.warn
* Redid assignment and metadata check
* Fix typo
* Changed assignment and metadata check
* Redid checks for isMissing(object)
* Lint fix

* Backmerge e2e code coverage changes and fixes into release/2.0.5 (#5431)

* [Telemetry Collections] Respect "Latest" Strategy Option (#5421)

* Respect latest strategy in Telemetry Collections to limit potential memory growth.

* fix sourcemaps (#5373)

Co-authored-by: John Hill <john.c.hill@nasa.gov>

* Debounce status summary (#5448)

Co-authored-by: John Hill <john.c.hill@nasa.gov>

* No gauge (#5451)

* Installed gauge plugin by default
* Make gauge part of standard install in e2e suite and add restrictednotebook

Co-authored-by: Andrew Henry <akhenry@gmail.com>

* [CouchDB] Always subscribe to the CouchDB changes feed (#5434)

* Add unknown state, remove maintenance state

* Handle all CouchDB status codes

- Set unknown status if we receive an unhandled code

* Include status code in error messages

* SharedWorker can send unknown status

* Add test for unknown status

* Always subscribe to CouchDB changes feed

- Always subscribe to the CouchDB changes feed, even if there are no observable objects, since we are also checking the status of CouchDB via this feed.

* Update indicator status if not using SharedWorker

* Start listening to changes feed on first request

* fix test

* adjust test to hopefully avoid race condition

* lint

Co-authored-by: John Hill <john.c.hill@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>
Co-authored-by: Scott Bell <scott@traclabs.com>

* Fix for Fault Management Visual Bugs  (#5376)

* Closes #5365
* General visual improvements

Co-authored-by: Charles Hacskaylo <charlesh88@gmail.com>
Co-authored-by: Andrew Henry <akhenry@gmail.com>

* fix pathing (#5452)

Co-authored-by: Jesse Mazzella <ozyx@users.noreply.github.com>

* [Static Root] Static Root Plugin not loading (#5455)

* Log if hitting falsy leafValue

* Add some logging

* Remove logs and specify null/undefined

Co-authored-by: Jesse Mazzella <ozyx@users.noreply.github.com>

* Allow endpoints with a single enum metadata value in Bar/Line graphs (#5443)

* If there is only 1 metadata value, set yKey to none. Also, fix bug for determining the name of a metadata value
* Update tests for enum metadata values

Co-authored-by: John Hill <john.c.hill@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>

* [Remote Clock] Wait for first tick and recalculate historical request bounds (#5433)

* Updated to ES6 class
* added request intercept functionality to telemetry api, added a request interceptor for remote clock
* add remoteClock e2e test stub

Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>

* Fix for missing object for LADTableSet (#5458)

* Handle missing object errors for display layouts

Co-authored-by: Andrew Henry <akhenry@gmail.com>

* removing the call for default import now that TelemetryAPI is an ES6 class (#5461)

* [Remote Clock] Fix requestInterceptor typo (#5462)

* Fix typo in telemetry request interceptor

Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>

* Lock model (#5457)

* Lock event Model to prevent reactification

* de-reactify all the things

* Make API properties writable to allow test mocks to override them

* Fix merge conflict

* Added plot interceptor for missing series config (#5422)

Co-authored-by: Andrew Henry <akhenry@gmail.com>
Co-authored-by: Shefali Joshi <simplyrender@gmail.com>

* Remove performance marks (#5465)

* Remove performance marks

* Retain performance mark in view large. It doesn't happen very often and it's needed for an automated performance test

* Use timeKey for time comparison (#5471)

* Fix couchdb no response (#5474)

* Update the creation date only when the document is created for the first time

* If there is no response from a bulk get, couch db has issues

* Check the response - if it's null, don't apply interceptors

* Fix shelved alarms (#5479)

* Fix the logic around shelved alarms

* Remove application router listener

* Release 2.0.5 UI and Gauge fixes (#5470)

* Various UI fixes
- Tweak to Gauge properties form for clarity and usability.
- Fix Gauge 'dial' type not obeying "Show units" property setting, closes #5325.
- Tweaks to Operator Status UI label and layout for clarity.
- Changed name and description of Graph object for clarity and consistency.
- Fixed CSS classing that was coloring Export menu items text incorrectly.
- Fixed icon-to-text vertical alignment in `.c-object-label`.
- Fix for broken layout in imagery local controls (brightness, layers, magnification).

Co-authored-by: Andrew Henry <akhenry@gmail.com>

* Stacked plot interceptor rename (#5468)

* Rename stacked plot interceptor and move to folder

Co-authored-by: Andrew Henry <akhenry@gmail.com>

* Clear data when time bounds are changed (#5482)

* Clear data when time bounds are changed
Also react to clear data action
Ensure that the yKey is set to 'none' if there is no range with array Values

* Refactor trace updates to a method

* get rid of root (#5483)

* Do not pass onPartialResponse option on to upstream telemetry (#5486)

* Fix all of the e2e tests (#5477)

* Fix timer test

* be explicit about the warnings text

* add full suite to CI to enable CircleCI Checks

* add back in devtool=false for CI env so firefox tests run

* add framework suite

* Don't install webpack HMR in CI

* Fix playwright version installs

* exclude HMR if running tests in any environment

- use NODE_ENV=TEST to exclude webpack HMR

- deparameterize some of the playwright configs

* use lower-case 'test'

* timer hover fix

* conditionally skip for firefox due to missing console events

* increase timeouts to give time for mutation

* no need to close save banner

* remove devtool setting

* revert

* update snapshots

* disable video to save some resources

* use one worker

* more timeouts :)

* Remove `browser.close()` and `page.close()` as it was breaking other tests

* Remove unnecessary awaits and fix func call syntax

* Fix image reset test

* fix restrictedNotebook tests

* revert playwright-ci.config settings

* increase timeout for polling imagery test

* remove unnecessary waits

* disable notebook lock test for chrome-beta as its unreliable

- remove some unnecessary 'wait for save banner' logic

- remove unused await

- mark imagery test as slow in chrome-beta

* LINT!! *shakes fist*

* don't run full e2e suite per commit

* disable video in all configs

* add flakey zoom comment

* exclude webpack HMR in non-development modes

Co-authored-by: Jesse Mazzella <jesse.d.mazzella@nasa.gov>
Co-authored-by: Jesse Mazzella <ozyx@users.noreply.github.com>

* lint fix

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Joshi <simplyrender@gmail.com>
Co-authored-by: Jesse Mazzella <ozyx@users.noreply.github.com>
Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>
Co-authored-by: Scott Bell <scott@traclabs.com>
Co-authored-by: unlikelyzero <jchill2@gmail.com>
Co-authored-by: Alize Nguyen <alizenguyen@gmail.com>
Co-authored-by: Charles Hacskaylo <charlesh88@gmail.com>
Co-authored-by: Khalid Adil <khalidadil29@gmail.com>
Co-authored-by: rukmini-bose <48999852+rukmini-bose@users.noreply.github.com>
Co-authored-by: Jesse Mazzella <jesse.d.mazzella@nasa.gov>
This commit is contained in:
John Hill 2022-07-14 14:52:28 -07:00 committed by GitHub
parent 43a4bf9606
commit db97acb61e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
137 changed files with 4019 additions and 1636 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.github/workflows/e2e-pr.yml vendored
View File

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

2
.github/workflows/e2e-visual.yml vendored
View File

@ -17,7 +17,7 @@ jobs:
- uses: actions/setup-node@v3
with:
node-version: '16'
- run: npx playwright@1.21.1 install
- run: npx playwright@1.23.0 install
- run: npm install
- name: Run the e2e visual tests
run: npm run test:e2e:visual

31
app.js
View File

@ -12,6 +12,7 @@ const express = require('express');
const app = express();
const fs = require('fs');
const request = require('request');
const __DEV__ = process.env.NODE_ENV === 'development';
// Defaults
options.port = options.port || options.p || 8080;
@ -49,14 +50,18 @@ class WatchRunPlugin {
}
const webpack = require('webpack');
const webpackConfig = process.env.CI ? require('./webpack.coverage.js') : require('./webpack.dev.js');
webpackConfig.plugins.push(new webpack.HotModuleReplacementPlugin());
webpackConfig.plugins.push(new WatchRunPlugin());
webpackConfig.entry.openmct = [
'webpack-hot-middleware/client?reload=true',
webpackConfig.entry.openmct
];
let webpackConfig;
if (__DEV__) {
webpackConfig = require('./webpack.dev');
webpackConfig.plugins.push(new webpack.HotModuleReplacementPlugin());
webpackConfig.entry.openmct = [
'webpack-hot-middleware/client?reload=true',
webpackConfig.entry.openmct
];
webpackConfig.plugins.push(new WatchRunPlugin());
} else {
webpackConfig = require('./webpack.coverage');
}
const compiler = webpack(webpackConfig);
@ -68,10 +73,12 @@ app.use(require('webpack-dev-middleware')(
}
));
app.use(require('webpack-hot-middleware')(
compiler,
{}
));
if (__DEV__) {
app.use(require('webpack-hot-middleware')(
compiler,
{}
));
}
// Expose index.html for development users.
app.get('/', function (req, res) {

12
e2e/playwright-ci.config.js
View File

@ -4,6 +4,8 @@
// eslint-disable-next-line no-unused-vars
const { devices } = require('@playwright/test');
const MAX_FAILURES = 5;
const NUM_WORKERS = 2;
/** @type {import('@playwright/test').PlaywrightTestConfig} */
const config = {
@ -12,20 +14,20 @@ const config = {
testIgnore: '**/*.perf.spec.js', //Ignore performance tests and define in playwright-perfromance.config.js
timeout: 60 * 1000,
webServer: {
command: 'npm run start',
command: 'cross-env NODE_ENV=test npm run start',
url: 'http://localhost:8080/#',
timeout: 200 * 1000,
reuseExistingServer: !process.env.CI
reuseExistingServer: false
},
maxFailures: process.env.CI ? 5 : undefined, //Limits failures to 5 to reduce CI Waste
workers: 2, //Limit to 2 for CircleCI Agent
maxFailures: MAX_FAILURES, //Limits failures to 5 to reduce CI Waste
workers: NUM_WORKERS, //Limit to 2 for CircleCI Agent
use: {
baseURL: 'http://localhost:8080/',
headless: true,
ignoreHTTPSErrors: true,
screenshot: 'only-on-failure',
trace: 'on-first-retry',
video: 'on-first-retry'
video: 'off'
},
projects: [
{

6
e2e/playwright-local.config.js
View File

@ -12,10 +12,10 @@ const config = {
testIgnore: '**/*.perf.spec.js',
timeout: 30 * 1000,
webServer: {
command: 'npm run start',
command: 'cross-env NODE_ENV=test npm run start',
url: 'http://localhost:8080/#',
timeout: 120 * 1000,
reuseExistingServer: !process.env.CI
reuseExistingServer: true
},
workers: 1,
use: {
@ -25,7 +25,7 @@ const config = {
ignoreHTTPSErrors: true,
screenshot: 'only-on-failure',
trace: 'retain-on-failure',
video: 'retain-on-failure'
video: 'off'
},
projects: [
{

8
e2e/playwright-performance.config.js
View File

@ -2,6 +2,8 @@
// playwright.config.js
// @ts-check
const CI = process.env.CI === 'true';
/** @type {import('@playwright/test').PlaywrightTestConfig} */
const config = {
retries: 1, //Only for debugging purposes because trace is enabled only on first retry
@ -9,15 +11,15 @@ const config = {
timeout: 60 * 1000,
workers: 1, //Only run in serial with 1 worker
webServer: {
command: 'npm run start',
command: 'cross-env NODE_ENV=test npm run start',
url: 'http://localhost:8080/#',
timeout: 200 * 1000,
reuseExistingServer: !process.env.CI
reuseExistingServer: !CI
},
use: {
browserName: "chromium",
baseURL: 'http://localhost:8080/',
headless: Boolean(process.env.CI), //Only if running locally
headless: CI, //Only if running locally
ignoreHTTPSErrors: true,
screenshot: 'off',
trace: 'on-first-retry',

4
e2e/playwright-visual.config.js
View File

@ -9,7 +9,7 @@ const config = {
timeout: 90 * 1000,
workers: 1, // visual tests should never run in parallel due to test pollution
webServer: {
command: 'npm run start',
command: 'cross-env NODE_ENV=test npm run start',
url: 'http://localhost:8080/#',
timeout: 200 * 1000,
reuseExistingServer: !process.env.CI
@ -21,7 +21,7 @@ const config = {
ignoreHTTPSErrors: true,
screenshot: 'on',
trace: 'off',
video: 'on'
video: 'off'
},
reporter: [
['list'],

22
e2e/test-data/VisualTestData_storage.json Normal file
View File

@ -0,0 +1,22 @@
{
"cookies": [],
"origins": [
{
"origin": "http://localhost:8080",
"localStorage": [
{
"name": "tcHistory",
"value": "{\"utc\":[{\"start\":1654548551471,\"end\":1654550351471}]}"
},
{
"name": "mct",
"value": "{\"mine\":{\"identifier\":{\"key\":\"mine\",\"namespace\":\"\"},\"name\":\"My Items\",\"type\":\"folder\",\"composition\":[{\"key\":\"527856c0-cced-4b64-bb19-f943432326d0\",\"namespace\":\"\"}],\"location\":\"ROOT\",\"persisted\":1654550352296,\"modified\":1654550352296},\"527856c0-cced-4b64-bb19-f943432326d0\":{\"identifier\":{\"key\":\"527856c0-cced-4b64-bb19-f943432326d0\",\"namespace\":\"\"},\"name\":\"Unnamed Overlay Plot\",\"type\":\"telemetry.plot.overlay\",\"composition\":[{\"key\":\"ce88ce37-8bb9-45e1-a85b-bb7e3c8453b9\",\"namespace\":\"\"}],\"configuration\":{\"series\":[{\"identifier\":{\"key\":\"ce88ce37-8bb9-45e1-a85b-bb7e3c8453b9\",\"namespace\":\"\"}}],\"yAxis\":{},\"xAxis\":{}},\"modified\":1654550353356,\"location\":\"mine\",\"persisted\":1654550353357},\"ce88ce37-8bb9-45e1-a85b-bb7e3c8453b9\":{\"name\":\"Unnamed Sine Wave Generator\",\"type\":\"generator\",\"identifier\":{\"key\":\"ce88ce37-8bb9-45e1-a85b-bb7e3c8453b9\",\"namespace\":\"\"},\"telemetry\":{\"period\":10,\"amplitude\":1,\"offset\":0,\"dataRateInHz\":1,\"phase\":0,\"randomness\":0,\"loadDelay\":\"5000\"},\"modified\":1654550353350,\"location\":\"527856c0-cced-4b64-bb19-f943432326d0\",\"persisted\":1654550353350}}"
},
{
"name": "mct-tree-expanded",
"value": "[\"/browse/mine\"]"
}
]
}
]
}

22
e2e/test-data/recycled_local_storage.json Normal file
View File

@ -0,0 +1,22 @@
{
"cookies": [],
"origins": [
{
"origin": "http://localhost:8080",
"localStorage": [
{
"name": "tcHistory",
"value": "{\"utc\":[{\"start\":1654537164464,\"end\":1654538964464},{\"start\":1652301954635,\"end\":1652303754635}]}"
},
{
"name": "mct",
"value": "{\"mine\":{\"identifier\":{\"key\":\"mine\",\"namespace\":\"\"},\"name\":\"My Items\",\"type\":\"folder\",\"composition\":[{\"key\":\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\",\"namespace\":\"\"},{\"key\":\"2d02a680-eb7e-4645-bba2-dd298f76efb8\",\"namespace\":\"\"}],\"location\":\"ROOT\",\"persisted\":1654538965703,\"modified\":1654538965703},\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\":{\"name\":\"Unnamed Condition Set\",\"type\":\"conditionSet\",\"identifier\":{\"key\":\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\",\"namespace\":\"\"},\"configuration\":{\"conditionTestData\":[],\"conditionCollection\":[{\"isDefault\":true,\"id\":\"73f2d9ae-d1f3-4561-b7fc-ecd5df557249\",\"configuration\":{\"name\":\"Default\",\"output\":\"Default\",\"trigger\":\"all\",\"criteria\":[]},\"summary\":\"Default condition\"}]},\"composition\":[],\"telemetry\":{},\"modified\":1652303755999,\"location\":\"mine\",\"persisted\":1652303756002},\"2d02a680-eb7e-4645-bba2-dd298f76efb8\":{\"name\":\"Unnamed Condition Set\",\"type\":\"conditionSet\",\"identifier\":{\"key\":\"2d02a680-eb7e-4645-bba2-dd298f76efb8\",\"namespace\":\"\"},\"configuration\":{\"conditionTestData\":[],\"conditionCollection\":[{\"isDefault\":true,\"id\":\"4291d80c-303c-4d8d-85e1-10f012b864fb\",\"configuration\":{\"name\":\"Default\",\"output\":\"Default\",\"trigger\":\"all\",\"criteria\":[]},\"summary\":\"Default condition\"}]},\"composition\":[],\"telemetry\":{},\"modified\":1654538965702,\"location\":\"mine\",\"persisted\":1654538965702}}"
},
{
"name": "mct-tree-expanded",
"value": "[]"
}
]
}
]
}

2
e2e/tests/branding.e2e.spec.js
View File

@ -36,7 +36,7 @@ test.describe('Branding tests', () => {
await page.click('.l-shell__app-logo');
// Verify that the NASA Logo Appears
await expect(await page.locator('.c-about__image')).toBeVisible();
await expect(page.locator('.c-about__image')).toBeVisible();
// Modify the Build information in 'about' Modal
const versionInformationLocator = page.locator('ul.t-info.l-info.s-info');

55
e2e/tests/framework.e2e.spec.js Normal file
View File

@ -0,0 +1,55 @@
/*****************************************************************************
* 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 testing our use of the playwright framework as it
relates to how we've extended it (i.e. ./e2e/fixtures.js) and assumptions made in our dev environment
(app.js and ./e2e/webpack-dev-middleware.js)
*/
const { test } = require('../fixtures.js');
test.describe('fixtures.js tests', () => {
test('Verify that tests fail if console.error is thrown', async ({ page }) => {
test.fail();
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
//Verify that ../fixtures.js detects console log errors
await Promise.all([
page.evaluate(() => console.error('This should result in a failure')),
page.waitForEvent('console') // always wait for the event to happen while triggering it!
]);
});
test('Verify that tests pass if console.warn is thrown', async ({ page }) => {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
//Verify that ../fixtures.js detects console log errors
await Promise.all([
page.evaluate(() => console.warn('This should result in a pass')),
page.waitForEvent('console') // always wait for the event to happen while triggering it!
]);
});
});

6
e2e/tests/moveObjects.e2e.spec.js
View File

@ -40,9 +40,6 @@ test.describe('Move item tests', () => {
await page.locator('text=Properties Title Notes >> input[type="text"]').click();
await page.locator('text=Properties Title Notes >> input[type="text"]').fill(folder1);
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
@ -94,9 +91,6 @@ test.describe('Move item tests', () => {
await page.locator('text=Properties Title Notes >> input[type="text"]').click();
await page.locator('text=Properties Title Notes >> input[type="text"]').fill(telemetryTable);
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
await page.locator('text=OK').click();
// Finish editing and save Telemetry Table

8
e2e/tests/persistence/persistability.e2e.spec.js
View File

@ -28,9 +28,7 @@ const { test } = require('../../fixtures.js');
const { expect } = require('@playwright/test');
const path = require('path');
// https://github.com/nasa/openmct/issues/4323#issuecomment-1067282651
test.describe('Persistence operations', () => {
test.describe('Persistence operations @addInit', () => {
// add non persistable root item
test.beforeEach(async ({ page }) => {
// eslint-disable-next-line no-undef
@ -38,6 +36,10 @@ test.describe('Persistence operations', () => {
});
test('Persistability should be respected in the create form location field', async ({ page }) => {
test.info().annotations.push({
type: 'issue',
description: 'https://github.com/nasa/openmct/issues/4323'
});
// Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });

32
e2e/tests/plugins/condition/condition.e2e.spec.js
View File

@ -51,20 +51,20 @@ test.describe.serial('Condition Set CRUD Operations on @localStorage', () => {
page.click('text=OK')
]);
//Save localStorage for future test execution.
await context.storageState({ path: './e2e/tests/recycled_storage.json' });
//Save localStorage for future test execution
await context.storageState({ path: './e2e/test-data/recycled_local_storage.json' });
//Set object identifier from url
conditionSetUrl = await page.url();
conditionSetUrl = page.url();
console.log('conditionSetUrl ' + conditionSetUrl);
getConditionSetIdentifierFromUrl = await conditionSetUrl.split('/').pop().split('?')[0];
getConditionSetIdentifierFromUrl = conditionSetUrl.split('/').pop().split('?')[0];
console.debug('getConditionSetIdentifierFromUrl ' + getConditionSetIdentifierFromUrl);
await page.close();
});
//Load localStorage for subsequent tests. Note: this requires a file already in place -- even if blank.
test.use({ storageState: './e2e/tests/recycled_storage.json' });
//Load localStorage for subsequent tests
test.use({ storageState: './e2e/test-data/recycled_local_storage.json' });
//Begin suite of tests again localStorage
test('Condition set object properties persist in main view and inspector @localStorage', async ({ page }) => {
//Navigate to baseURL with injected localStorage
@ -74,7 +74,7 @@ test.describe.serial('Condition Set CRUD Operations on @localStorage', () => {
await expect.soft(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Condition Set');
//Assertions on loaded Condition Set in Inspector
await expect.soft(page.locator('_vue=item.name=Unnamed Condition Set')).toBeTruthy;
expect.soft(page.locator('_vue=item.name=Unnamed Condition Set')).toBeTruthy();
//Reload Page
await Promise.all([
@ -85,7 +85,7 @@ test.describe.serial('Condition Set CRUD Operations on @localStorage', () => {
//Re-verify after reload
await expect.soft(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Condition Set');
//Assertions on loaded Condition Set in Inspector
await expect.soft(page.locator('_vue=item.name=Unnamed Condition Set')).toBeTruthy;
expect.soft(page.locator('_vue=item.name=Unnamed Condition Set')).toBeTruthy();
});
test('condition set object can be modified on @localStorage', async ({ page }) => {
@ -111,18 +111,18 @@ test.describe.serial('Condition Set CRUD Operations on @localStorage', () => {
// Verify Inspector properties
// Verify Inspector has updated Name property
await expect.soft(page.locator('text=Renamed Condition Set').nth(1)).toBeTruthy();
expect.soft(page.locator('text=Renamed Condition Set').nth(1)).toBeTruthy();
// Verify Inspector Details has updated Name property
await expect.soft(page.locator('text=Renamed Condition Set').nth(2)).toBeTruthy();
expect.soft(page.locator('text=Renamed Condition Set').nth(2)).toBeTruthy();
// Verify Tree reflects updated Name proprety
// Expand Tree
await page.locator('text=Open MCT My Items >> span >> nth=3').click();
// Verify Condition Set Object is renamed in Tree
await expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
// Verify Search Tree reflects renamed Name property
await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('Renamed');
await expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
//Reload Page
await Promise.all([
@ -135,18 +135,18 @@ test.describe.serial('Condition Set CRUD Operations on @localStorage', () => {
// Verify Inspector properties
// Verify Inspector has updated Name property
await expect.soft(page.locator('text=Renamed Condition Set').nth(1)).toBeTruthy();
expect.soft(page.locator('text=Renamed Condition Set').nth(1)).toBeTruthy();
// Verify Inspector Details has updated Name property
await expect.soft(page.locator('text=Renamed Condition Set').nth(2)).toBeTruthy();
expect.soft(page.locator('text=Renamed Condition Set').nth(2)).toBeTruthy();
// Verify Tree reflects updated Name proprety
// Expand Tree
await page.locator('text=Open MCT My Items >> span >> nth=3').click();
// Verify Condition Set Object is renamed in Tree
await expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
// Verify Search Tree reflects renamed Name property
await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('Renamed');
await expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
expect(page.locator('a:has-text("Renamed Condition Set")')).toBeTruthy();
});
test('condition set object can be deleted by Search Tree Actions menu on @localStorage', async ({ page }) => {
//Navigate to baseURL

95
e2e/tests/plugins/imagery/exampleImagery.e2e.spec.js
View File

@ -31,6 +31,7 @@ const { expect } = require('@playwright/test');
const backgroundImageSelector = '.c-imagery__main-image__background-image';
//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 }) => {
@ -43,10 +44,7 @@ test.describe('Example Imagery Object', () => {
// Click text=Example Imagery
await page.click('text=Example Imagery');
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
// Click text=OK and wait for save banner to appear
// Click text=OK
await Promise.all([
page.waitForNavigation({waitUntil: 'networkidle'}),
page.click('text=OK'),
@ -183,7 +181,8 @@ test.describe('Example Imagery Object', () => {
});
test('Can use the reset button to reset the image', async ({ page }) => {
test('Can use the reset button to reset the image', async ({ page }, testInfo) => {
test.slow(testInfo.project === 'chrome-beta', "This test is slow in chrome-beta");
// wait for zoom animation to finish
await page.locator(backgroundImageSelector).hover({trial: true});
@ -202,16 +201,17 @@ test.describe('Example Imagery Object', () => {
expect.soft(zoomedInBoundingBox.height).toBeGreaterThan(initialBoundingBox.height);
expect.soft(zoomedInBoundingBox.width).toBeGreaterThan(initialBoundingBox.width);
await zoomResetBtn.click();
// wait for zoom animation to finish
await page.locator(backgroundImageSelector).hover({trial: true});
// FIXME: The zoom is flakey, sometimes not returning to original dimensions
// https://github.com/nasa/openmct/issues/5491
await expect.poll(async () => {
await zoomResetBtn.click();
const boundingBox = await page.locator(backgroundImageSelector).boundingBox();
const resetBoundingBox = await page.locator(backgroundImageSelector).boundingBox();
expect.soft(resetBoundingBox.height).toBeLessThan(zoomedInBoundingBox.height);
expect.soft(resetBoundingBox.width).toBeLessThan(zoomedInBoundingBox.width);
expect.soft(resetBoundingBox.height).toEqual(initialBoundingBox.height);
expect(resetBoundingBox.width).toEqual(initialBoundingBox.width);
return boundingBox;
}, {
timeout: 10 * 1000
}).toEqual(initialBoundingBox);
});
test('Using the zoom features does not pause telemetry', async ({ page }) => {
@ -316,7 +316,14 @@ test('Example Imagery in Display layout', async ({ page, browserName }) => {
await page.locator('[data-testid=conductor-modeOption-realtime]').click();
// Zoom in on next image
await mouseZoomIn(page);
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 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();
@ -330,9 +337,9 @@ test('Example Imagery in Display layout', async ({ page, browserName }) => {
return newImageCount;
}, {
message: "verify that new images still stream in",
message: "verify that old images are discarded",
timeout: 6 * 1000
}).toBeGreaterThan(imageCount);
}).toBe(imageCount);
// Verify selected image is still displayed
await expect(selectedImage).toBeVisible();
@ -352,7 +359,6 @@ test('Example Imagery in Display layout', async ({ page, browserName }) => {
});
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' });
@ -557,9 +563,9 @@ test.describe('Example Imagery in Flexible layout', () => {
return newImageCount;
}, {
message: "verify that new images still stream in",
message: "verify that old images are discarded",
timeout: 6 * 1000
}).toBeGreaterThan(imageCount);
}).toBe(imageCount);
// Verify selected image is still displayed
await expect(selectedImage).toBeVisible();
@ -579,6 +585,16 @@ test.describe('Example Imagery in Flexible layout', () => {
});
});
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');
});
/**
* @param {import('@playwright/test').Page} page
*/
@ -645,22 +661,6 @@ async function assertBackgroundImageBrightness(page, expected) {
expect(actual).toBe(expected);
}
/**
* Gets the filter:contrast value of the current background-image and
* asserts against an expected value
* @param {import('@playwright/test').Page} page
* @param {String} expected The expected contrast value
*/
async function assertBackgroundImageContrast(page, expected) {
const backgroundImage = page.locator('.c-imagery__main-image__background-image');
// Get the contrast filter value (i.e: filter: contrast(500%) => "500")
const actual = await backgroundImage.evaluate((el) => {
return el.style.filter.match(/contrast\((\d{1,3})%\)/)[1];
});
expect(actual).toBe(expected);
}
/**
* @param {import('@playwright/test').Page} page
*/
@ -761,12 +761,19 @@ async function mouseZoomIn(page) {
expect(imageMouseZoomedIn.width).toBeGreaterThan(originalImageDimensions.width);
}
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');
});
/**
* Gets the filter:contrast value of the current background-image and
* asserts against an expected value
* @param {import('@playwright/test').Page} page
* @param {String} expected The expected contrast value
*/
async function assertBackgroundImageContrast(page, expected) {
const backgroundImage = page.locator('.c-imagery__main-image__background-image');
// Get the contrast filter value (i.e: filter: contrast(500%) => "500")
const actual = await backgroundImage.evaluate((el) => {
return el.style.filter.match(/contrast\((\d{1,3})%\)/)[1];
});
expect(actual).toBe(expected);
}

64
e2e/tests/plugins/notebook/restrictedNotebook.e2e.spec.js
View File

@ -34,11 +34,11 @@ test.describe('Restricted Notebook', () => {
await startAndAddRestrictedNotebookObject(page);
});
test('Can be renamed', async ({ page }) => {
await expect.soft(page.locator('.l-browse-bar__object-name')).toContainText(`Unnamed ${CUSTOM_NAME}`);
test('Can be renamed @addInit', async ({ page }) => {
await expect(page.locator('.l-browse-bar__object-name')).toContainText(`Unnamed ${CUSTOM_NAME}`);
});
test('Can be deleted if there are no locked pages', async ({ page }) => {
test('Can be deleted if there are no locked pages @addInit', async ({ page }) => {
await openContextMenuRestrictedNotebook(page);
const menuOptions = page.locator('.c-menu ul');
@ -52,7 +52,7 @@ test.describe('Restricted Notebook', () => {
// Click Remove Text
await page.locator('text=Remove').click();
//Wait until Save Banner is gone
// Click 'OK' on confirmation window and wait for save banner to appear
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
@ -61,31 +61,37 @@ test.describe('Restricted Notebook', () => {
await page.locator('.c-message-banner__close-button').click();
// has been deleted
expect.soft(await restrictedNotebookTreeObject.count()).toEqual(0);
expect(await restrictedNotebookTreeObject.count()).toEqual(0);
});
test('Can be locked if at least one page has one entry', async ({ page }) => {
test('Can be locked if at least one page has one entry @addInit', async ({ page }) => {
await enterTextEntry(page);
const commitButton = page.locator('button:has-text("Commit Entries")');
expect.soft(await commitButton.count()).toEqual(1);
expect(await commitButton.count()).toEqual(1);
});
});
test.describe('Restricted Notebook with at least one entry and with the page locked', () => {
test.describe('Restricted Notebook with at least one entry and with the page locked @addInit', () => {
test.beforeEach(async ({ page }) => {
await startAndAddRestrictedNotebookObject(page);
await enterTextEntry(page);
await lockPage(page);
// FIXME: Give ample time for the mutation to happen
// https://github.com/nasa/openmct/issues/5409
// eslint-disable-next-line playwright/no-wait-for-timeout
await page.waitForTimeout(1 * 1000);
// open sidebar
await page.locator('button.c-notebook__toggle-nav-button').click();
});
test.fixme('Locked page should now be in a locked state', async ({ page }) => {
test('Locked page should now be in a locked state @addInit', async ({ page }, testInfo) => {
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);
@ -96,14 +102,12 @@ test.describe('Restricted Notebook with at least one entry and with the page loc
// no way to remove a restricted notebook with a locked page
await openContextMenuRestrictedNotebook(page);
const menuOptions = page.locator('.c-menu ul');
await expect.soft(menuOptions).not.toContainText('Remove');
await expect(menuOptions).not.toContainText('Remove');
});
test('Can still: add page, rename, add entry, delete unlocked pages', async ({ page }) => {
test('Can still: add page, rename, add entry, delete unlocked pages @addInit', async ({ page }) => {
// Click text=Page Add >> button
await Promise.all([
page.waitForNavigation(),
@ -139,32 +143,32 @@ test.describe('Restricted Notebook with at least one entry and with the page loc
// deleted page, should no longer exist
const deletedPageElement = page.locator(`text=${TEST_TEXT_NAME}`);
expect.soft(await deletedPageElement.count()).toEqual(0);
expect(await deletedPageElement.count()).toEqual(0);
});
});
test.describe('Restricted Notebook with a page locked and with an embed', () => {
test.describe('Restricted Notebook with a page locked and with an embed @addInit', () => {
test.beforeEach(async ({ page }) => {
await startAndAddRestrictedNotebookObject(page);
await dragAndDropEmbed(page);
});
test('Allows embeds to be deleted if page unlocked', async ({ page }) => {
test('Allows embeds to be deleted if page unlocked @addInit', async ({ page }) => {
// Click .c-ne__embed__name .c-popup-menu-button
await page.locator('.c-ne__embed__name .c-popup-menu-button').click(); // embed popup menu
const embedMenu = page.locator('body >> .c-menu');
await expect.soft(embedMenu).toContainText('Remove This Embed');
await expect(embedMenu).toContainText('Remove This Embed');
});
test('Disallows embeds to be deleted if page locked', async ({ page }) => {
test('Disallows embeds to be deleted if page locked @addInit', async ({ page }) => {
await lockPage(page);
// Click .c-ne__embed__name .c-popup-menu-button
await page.locator('.c-ne__embed__name .c-popup-menu-button').click(); // embed popup menu
const embedMenu = page.locator('body >> .c-menu');
await expect.soft(embedMenu).not.toContainText('Remove This Embed');
await expect(embedMenu).not.toContainText('Remove This Embed');
});
});
@ -232,28 +236,18 @@ async function lockPage(page) {
await commitButton.click();
//Wait until Lock Banner is visible
await Promise.all([
page.locator('text=Lock Page').click(),
page.waitForSelector('.c-message-banner__message')
]);
// Close Lock Banner
await page.locator('.c-message-banner__close-button').click();
//artifically wait to avoid mutation delay TODO: https://github.com/nasa/openmct/issues/5409
// eslint-disable-next-line playwright/no-wait-for-timeout
await page.waitForTimeout(1 * 1000);
await page.locator('text=Lock Page').click();
}
/**
* @param {import('@playwright/test').Page} page
*/
async function openContextMenuRestrictedNotebook(page) {
// Click text=Open MCT My Items (This expands the My Items folder to show it's chilren in the tree)
await page.locator('text=Open MCT My Items >> span').nth(3).click();
//artifically wait to avoid mutation delay TODO: https://github.com/nasa/openmct/issues/5409
// eslint-disable-next-line playwright/no-wait-for-timeout
await page.waitForTimeout(1 * 1000);
const myItemsFolder = page.locator('text=Open MCT My Items >> span').nth(3);
const className = await myItemsFolder.getAttribute('class');
if (!className.includes('c-disclosure-triangle--expanded')) {
await myItemsFolder.click();
}
// Click a:has-text("Unnamed CUSTOM_NAME")
await page.locator(`a:has-text("Unnamed ${CUSTOM_NAME}")`).click({

205
e2e/tests/plugins/notebook/tags.e2e.spec.js Normal file
View File

@ -0,0 +1,205 @@
/*****************************************************************************
* 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 form functionality.
*/
const { expect } = require('@playwright/test');
const { test } = require('../../../fixtures');
/**
* Creates a notebook object and adds an entry.
* @param {import('@playwright/test').Page} - page to load
* @param {number} [iterations = 1] - the number of entries to create
*/
async function createNotebookAndEntry(page, iterations = 1) {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
// Click button:has-text("Create")
await page.locator('button:has-text("Create")').click();
await page.locator('[title="Create and save timestamped notes with embedded object snapshots."]').click();
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('[name="mctForm"] >> text=My Items').click(),
page.locator('button:has-text("OK")').click()
]);
for (let iteration = 0; iteration < iterations; iteration++) {
// Click text=To start a new entry, click here or drag and drop any object
await page.locator('text=To start a new entry, click here or drag and drop any object').click();
const entryLocator = `[aria-label="Notebook Entry Input"] >> nth = ${iteration}`;
await page.locator(entryLocator).click();
await page.locator(entryLocator).fill(`Entry ${iteration}`);
}
}
/**
* Creates a notebook object, adds an entry, and adds a tag.
* @param {import('@playwright/test').Page} page
* @param {number} [iterations = 1] - the number of entries (and tags) to create
*/
async function createNotebookEntryAndTags(page, iterations = 1) {
await createNotebookAndEntry(page, iterations);
for (let iteration = 0; iteration < iterations; iteration++) {
// Click text=To start a new entry, click here or drag and drop any object
await page.locator(`button:has-text("Add Tag") >> nth = ${iteration}`).click();
// Click [placeholder="Type to select tag"]
await page.locator('[placeholder="Type to select tag"]').click();
// Click text=Driving
await page.locator('[aria-label="Autocomplete Options"] >> text=Driving').click();
// Click button:has-text("Add Tag")
await page.locator(`button:has-text("Add Tag") >> nth = ${iteration}`).click();
// Click [placeholder="Type to select tag"]
await page.locator('[placeholder="Type to select tag"]').click();
// Click text=Science
await page.locator('[aria-label="Autocomplete Options"] >> text=Science').click();
}
}
test.describe('Tagging in Notebooks', () => {
test('Can load tags', async ({ page }) => {
await createNotebookAndEntry(page);
// Click text=To start a new entry, click here or drag and drop any object
await page.locator('button:has-text("Add Tag")').click();
// Click [placeholder="Type to select tag"]
await page.locator('[placeholder="Type to select tag"]').click();
await expect(page.locator('[aria-label="Autocomplete Options"]')).toContainText("Science");
await expect(page.locator('[aria-label="Autocomplete Options"]')).toContainText("Drilling");
await expect(page.locator('[aria-label="Autocomplete Options"]')).toContainText("Driving");
});
test('Can add tags', async ({ page }) => {
await createNotebookEntryAndTags(page);
await expect(page.locator('[aria-label="Notebook Entry"]')).toContainText("Science");
await expect(page.locator('[aria-label="Notebook Entry"]')).toContainText("Driving");
// Click button:has-text("Add Tag")
await page.locator('button:has-text("Add Tag")').click();
// Click [placeholder="Type to select tag"]
await page.locator('[placeholder="Type to select tag"]').click();
await expect(page.locator('[aria-label="Autocomplete Options"]')).not.toContainText("Science");
await expect(page.locator('[aria-label="Autocomplete Options"]')).not.toContainText("Driving");
await expect(page.locator('[aria-label="Autocomplete Options"]')).toContainText("Drilling");
});
test('Can search for tags', async ({ page }) => {
await createNotebookEntryAndTags(page);
// Click [aria-label="OpenMCT Search"] input[type="search"]
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('sc');
await expect(page.locator('[aria-label="Search Result"]')).toContainText("Science");
await expect(page.locator('[aria-label="Search Result"]')).toContainText("Driving");
// Click [aria-label="OpenMCT Search"] input[type="search"]
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('Sc');
await expect(page.locator('[aria-label="Search Result"]')).toContainText("Science");
await expect(page.locator('[aria-label="Search Result"]')).toContainText("Driving");
// Click [aria-label="OpenMCT Search"] input[type="search"]
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"]')).not.toBeVisible();
await expect(page.locator('[aria-label="Search Result"]')).not.toBeVisible();
});
test('Can delete tags', async ({ page }) => {
await createNotebookEntryAndTags(page);
await page.locator('[aria-label="Notebook Entries"]').click();
// Delete Driving
await page.locator('text=Science Driving Add Tag >> button').nth(1).click();
await expect(page.locator('[aria-label="Notebook Entry"]')).toContainText("Science");
await expect(page.locator('[aria-label="Notebook Entry"]')).not.toContainText("Driving");
// Fill [aria-label="OpenMCT Search"] input[type="search"]
await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('sc');
await expect(page.locator('[aria-label="Search Result"]')).not.toContainText("Driving");
});
test('Tags persist across reload', async ({ page }) => {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
// Create a clock object we can navigate to
await page.click('button:has-text("Create")');
// Click Clock
await page.click('text=Clock');
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('[name="mctForm"] >> text=My Items').click(),
page.locator('button:has-text("OK")').click()
]);
await page.click('.c-disclosure-triangle');
const ITERATIONS = 4;
await createNotebookEntryAndTags(page, ITERATIONS);
for (let iteration = 0; iteration < ITERATIONS; iteration++) {
const entryLocator = `[aria-label="Notebook Entry"] >> nth = ${iteration}`;
await expect(page.locator(entryLocator)).toContainText("Science");
await expect(page.locator(entryLocator)).toContainText("Driving");
}
// Click Unnamed Clock
await page.click('text="Unnamed Clock"');
// Click Unnamed Notebook
await page.click('text="Unnamed Notebook"');
for (let iteration = 0; iteration < ITERATIONS; iteration++) {
const entryLocator = `[aria-label="Notebook Entry"] >> nth = ${iteration}`;
await expect(page.locator(entryLocator)).toContainText("Science");
await expect(page.locator(entryLocator)).toContainText("Driving");
}
//Reload Page
await Promise.all([
page.reload(),
page.waitForLoadState('networkidle')
]);
// Click Unnamed Notebook
await page.click('text="Unnamed Notebook"');
for (let iteration = 0; iteration < ITERATIONS; iteration++) {
const entryLocator = `[aria-label="Notebook Entry"] >> nth = ${iteration}`;
await expect(page.locator(entryLocator)).toContainText("Science");
await expect(page.locator(entryLocator)).toContainText("Driving");
}
});
});

BIN
e2e/tests/plugins/plot/autoscale.e2e.spec.js-snapshots/autoscale-canvas-panned-chrome-darwin
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
e2e/tests/plugins/plot/autoscale.e2e.spec.js-snapshots/autoscale-canvas-panned-chrome-linux
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
e2e/tests/plugins/plot/autoscale.e2e.spec.js-snapshots/autoscale-canvas-prepan-chrome-darwin
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 21 KiB

BIN
e2e/tests/plugins/plot/autoscale.e2e.spec.js-snapshots/autoscale-canvas-prepan-chrome-linux
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 21 KiB

155
e2e/tests/plugins/plot/missingPlotObj.e2e.spec.js Normal file
View File

@ -0,0 +1,155 @@
/*****************************************************************************
* 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.
*****************************************************************************/
/*
Tests to verify log plot functionality when objects are missing
*/
const { test } = require('../../../fixtures.js');
const { expect } = require('@playwright/test');
test.describe('Handle missing object for plots', () => {
test('Displays empty div for missing stacked plot item', async ({ page, browserName }) => {
test.fixme(browserName === 'firefox', 'Firefox failing due to console events being missed');
const errorLogs = [];
page.on("console", (message) => {
if (message.type() === 'warning' && message.text().includes('Missing domain object')) {
errorLogs.push(message.text());
}
});
//Make stacked plot
await makeStackedPlot(page);
//Gets local storage and deletes the last sine wave generator in the stacked plot
const localStorage = await page.evaluate(() => window.localStorage);
const parsedData = JSON.parse(localStorage.mct);
const keys = Object.keys(parsedData);
const lastKey = keys[keys.length - 1];
delete parsedData[lastKey];
//Sets local storage with missing object
await page.evaluate(
`window.localStorage.setItem('mct', '${JSON.stringify(parsedData)}')`
);
//Reloads page and clicks on stacked plot
await Promise.all([
page.reload(),
page.waitForLoadState('networkidle')
]);
//Verify Main section is there on load
await expect.soft(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Stacked Plot');
await page.locator('text=Open MCT My Items >> span').nth(3).click();
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Stacked Plot').first().click()
]);
//Check that there is only one stacked item plot with a plot, the missing one will be empty
await expect(page.locator(".c-plot--stacked-container:has(.gl-plot)")).toHaveCount(1);
//Verify that console.warn is thrown
expect(errorLogs).toHaveLength(1);
});
});
/**
* This is used the create a stacked plot object
* @private
*/
async function makeStackedPlot(page) {
// fresh page with time range from 2022-03-29 22:00:00.000Z to 2022-03-29 22:00:30.000Z
await page.goto('/', { waitUntil: 'networkidle' });
// create stacked plot
await page.locator('button.c-create-button').click();
await page.locator('li:has-text("Stacked Plot")').click();
await Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle'}),
page.locator('text=OK').click(),
//Wait for Save Banner to appear
page.waitForSelector('.c-message-banner__message')
]);
// save the stacked plot
await saveStackedPlot(page);
// create a sinewave generator
await createSineWaveGenerator(page);
// click on stacked plot
await page.locator('text=Open MCT My Items >> span').nth(3).click();
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Stacked Plot').first().click()
]);
// create a second sinewave generator
await createSineWaveGenerator(page);
// click on stacked plot
await page.locator('text=Open MCT My Items >> span').nth(3).click();
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Stacked Plot').first().click()
]);
}
/**
* This is used to save a stacked plot object
* @private
*/
async function saveStackedPlot(page) {
// save stacked plot
await page.locator('text=Snapshot Save and Finish Editing Save and Continue Editing >> button').nth(1).click();
await Promise.all([
page.locator('text=Save and Finish Editing').click(),
//Wait for Save Banner to appear
page.waitForSelector('.c-message-banner__message')
]);
//Wait until Save Banner is gone
await page.locator('.c-message-banner__close-button').click();
await page.waitForSelector('.c-message-banner__message', { state: 'detached' });
}
/**
* This is used to create a sine wave generator object
* @private
*/
async function createSineWaveGenerator(page) {
//Create sine wave generator
await page.locator('button.c-create-button').click();
await page.locator('li:has-text("Sine Wave Generator")').click();
await Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle'}),
page.locator('text=OK').click(),
//Wait for Save Banner to appear
page.waitForSelector('.c-message-banner__message')
]);
}

41
e2e/tests/plugins/remoteClock/remoteClock.e2e.spec.js Normal file
View File

@ -0,0 +1,41 @@
/*****************************************************************************
* 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 } = require('../../../fixtures.js');
// eslint-disable-next-line no-unused-vars
const { expect } = require('@playwright/test');
test.describe('Remote Clock', () => {
// eslint-disable-next-line require-await
test.fixme('blocks historical requests until first tick is received', async ({ page }) => {
test.info().annotations.push({
type: 'issue',
description: 'https://github.com/nasa/openmct/issues/5221'
});
// addInitScript to with remote clock
// Switch time conductor mode to 'remote clock'
// Navigate to telemetry
// Verify that the plot renders historical data within the correct bounds
// Refresh the page
// Verify again that the plot renders historical data within the correct bounds
});
});

27
e2e/tests/plugins/telemetryTable/telemetryTable.e2e.spec.js
View File

@ -24,7 +24,7 @@ const { test } = require('../../../fixtures');
const { expect } = require('@playwright/test');
test.describe('Telemetry Table', () => {
test('unpauses when paused by button and user changes bounds', async ({ page }) => {
test('unpauses and filters data when paused by button and user changes bounds', async ({ page }) => {
test.info().annotations.push({
type: 'issue',
description: 'https://github.com/nasa/openmct/issues/5113'
@ -39,9 +39,6 @@ test.describe('Telemetry Table', () => {
await page.locator(createButton).click();
await page.locator('li:has-text("Telemetry Table")').click();
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
@ -59,9 +56,6 @@ test.describe('Telemetry Table', () => {
// add Sine Wave Generator with defaults
await page.locator('li:has-text("Sine Wave Generator")').click();
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
@ -77,25 +71,34 @@ test.describe('Telemetry Table', () => {
]);
// Click pause button
const pauseButton = await page.locator('button.c-button.icon-pause');
const pauseButton = page.locator('button.c-button.icon-pause');
await pauseButton.click();
const tableWrapper = await page.locator('div.c-table-wrapper');
const tableWrapper = page.locator('div.c-table-wrapper');
await expect(tableWrapper).toHaveClass(/is-paused/);
// Arbitrarily change end date to some time in the future
// Subtract 5 minutes from the current end bound datetime and set it
const endTimeInput = page.locator('input[type="text"].c-input--datetime').nth(1);
await endTimeInput.click();
let endDate = await endTimeInput.inputValue();
endDate = new Date(endDate);
endDate.setUTCDate(endDate.getUTCDate() + 1);
endDate = endDate.toISOString().replace(/T.*/, '');
endDate.setUTCMinutes(endDate.getUTCMinutes() - 5);
endDate = endDate.toISOString().replace(/T/, ' ');
await endTimeInput.fill('');
await endTimeInput.fill(endDate);
await page.keyboard.press('Enter');
await expect(tableWrapper).not.toHaveClass(/is-paused/);
// Get the most recent telemetry date
const latestTelemetryDate = await page.locator('table.c-telemetry-table__body > tbody > tr').last().locator('td').nth(1).getAttribute('title');
// Verify that it is <= our new end bound
const latestMilliseconds = Date.parse(latestTelemetryDate);
const endBoundMilliseconds = Date.parse(endDate);
expect(latestMilliseconds).toBeLessThanOrEqual(endBoundMilliseconds);
});
});

185
e2e/tests/plugins/timer/timer.e2e.spec.js Normal file
View File

@ -0,0 +1,185 @@
/*****************************************************************************
* 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 } = require('../../../fixtures.js');
const { expect } = require('@playwright/test');
test.describe('Timer', () => {
test.beforeEach(async ({ page }) => {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
//Click the Create button
await page.click('button:has-text("Create")');
// Click 'Timer'
await page.click('text=Timer');
// Click text=OK
await Promise.all([
page.waitForNavigation({waitUntil: 'networkidle'}),
page.click('text=OK')
]);
await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Timer');
});
test('Can perform actions on the Timer', async ({ page }) => {
test.info().annotations.push({
type: 'issue',
description: 'https://github.com/nasa/openmct/issues/4313'
});
await test.step("From the tree context menu", async () => {
await triggerTimerContextMenuAction(page, 'Start');
await triggerTimerContextMenuAction(page, 'Pause');
await triggerTimerContextMenuAction(page, 'Restart at 0');
await triggerTimerContextMenuAction(page, 'Stop');
});
await test.step("From the 3dot menu", async () => {
await triggerTimer3dotMenuAction(page, 'Start');
await triggerTimer3dotMenuAction(page, 'Pause');
await triggerTimer3dotMenuAction(page, 'Restart at 0');
await triggerTimer3dotMenuAction(page, 'Stop');
});
await test.step("From the object view", async () => {
await triggerTimerViewAction(page, 'Start');
await triggerTimerViewAction(page, 'Pause');
await triggerTimerViewAction(page, 'Restart at 0');
});
});
});
/**
* Actions that can be performed on a timer from context menus.
* @typedef {'Start' | 'Stop' | 'Pause' | 'Restart at 0'} TimerAction
*/
/**
* Actions that can be performed on a timer from the object view.
* @typedef {'Start' | 'Pause' | 'Restart at 0'} TimerViewAction
*/
/**
* Open the timer context menu from the object tree.
* Expands the 'My Items' folder if it is not already expanded.
* @param {import('@playwright/test').Page} page
*/
async function openTimerContextMenu(page) {
const myItemsFolder = page.locator('text=Open MCT My Items >> span').nth(3);
const className = await myItemsFolder.getAttribute('class');
if (!className.includes('c-disclosure-triangle--expanded')) {
await myItemsFolder.click();
}
await page.locator(`a:has-text("Unnamed Timer")`).click({
button: 'right'
});
}
/**
* Trigger a timer action from the tree context menu
* @param {import('@playwright/test').Page} page
* @param {TimerAction} action
*/
async function triggerTimerContextMenuAction(page, action) {
const menuAction = `.c-menu ul li >> text="${action}"`;
await openTimerContextMenu(page);
await page.locator(menuAction).click();
assertTimerStateAfterAction(page, action);
}
/**
* Trigger a timer action from the 3dot menu
* @param {import('@playwright/test').Page} page
* @param {TimerAction} action
*/
async function triggerTimer3dotMenuAction(page, action) {
const menuAction = `.c-menu ul li >> text="${action}"`;
const threeDotMenuButton = 'button[title="More options"]';
let isActionAvailable = false;
let iterations = 0;
// Dismiss/open the 3dot menu until the action is available
// or a maxiumum number of iterations is reached
while (!isActionAvailable && iterations <= 20) {
await page.click('.c-object-view');
await page.click(threeDotMenuButton);
isActionAvailable = await page.locator(menuAction).isVisible();
iterations++;
}
await page.locator(menuAction).click();
assertTimerStateAfterAction(page, action);
}
/**
* Trigger a timer action from the object view
* @param {import('@playwright/test').Page} page
* @param {TimerViewAction} action
*/
async function triggerTimerViewAction(page, action) {
await page.locator('.c-timer').hover({trial: true});
const buttonTitle = buttonTitleFromAction(action);
await page.click(`button[title="${buttonTitle}"]`);
assertTimerStateAfterAction(page, action);
}
/**
* Takes in a TimerViewAction and returns the button title
* @param {TimerViewAction} action
*/
function buttonTitleFromAction(action) {
switch (action) {
case 'Start':
return 'Start';
case 'Pause':
return 'Pause';
case 'Restart at 0':
return 'Reset';
}
}
/**
* Verify the timer state after a timer action has been performed.
* @param {import('@playwright/test').Page} page
* @param {TimerAction} action
*/
async function assertTimerStateAfterAction(page, action) {
let timerStateClass;
switch (action) {
case 'Start':
case 'Restart at 0':
timerStateClass = "is-started";
break;
case 'Stop':
timerStateClass = 'is-stopped';
break;
case 'Pause':
timerStateClass = 'is-paused';
break;
}
await expect.soft(page.locator('.c-timer')).toHaveClass(new RegExp(timerStateClass));
}

22
e2e/tests/recycled_storage.json
View File

@ -1,22 +0,0 @@
{
"cookies": [],
"origins": [
{
"origin": "http://localhost:8080",
"localStorage": [
{
"name": "mct-tree-expanded",
"value": "[]"
},
{
"name": "tcHistory",
"value": "{\"utc\":[{\"start\":1656473493306,\"end\":1656475293306},{\"start\":1655769110258,\"end\":1655770910258},{\"start\":1652301954635,\"end\":1652303754635}]}"
},
{
"name": "mct",
"value": "{\"mine\":{\"identifier\":{\"key\":\"mine\",\"namespace\":\"\"},\"name\":\"My Items\",\"type\":\"folder\",\"composition\":[{\"key\":\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\",\"namespace\":\"\"},{\"key\":\"18ba28bf-152e-4e0f-9b9c-638fb2ade0c3\",\"namespace\":\"\"},{\"key\":\"fa64bd6c-9351-4d94-a54e-e062a93be3b6\",\"namespace\":\"\"}],\"location\":\"ROOT\",\"persisted\":1656475294042,\"modified\":1656475294042},\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\":{\"name\":\"Unnamed Condition Set\",\"type\":\"conditionSet\",\"identifier\":{\"key\":\"f64bea3b-58a7-4586-8c05-8b651e5f0bfd\",\"namespace\":\"\"},\"configuration\":{\"conditionTestData\":[],\"conditionCollection\":[{\"isDefault\":true,\"id\":\"73f2d9ae-d1f3-4561-b7fc-ecd5df557249\",\"configuration\":{\"name\":\"Default\",\"output\":\"Default\",\"trigger\":\"all\",\"criteria\":[]},\"summary\":\"Default condition\"}]},\"composition\":[],\"telemetry\":{},\"modified\":1652303755999,\"location\":\"mine\",\"persisted\":1652303756002},\"18ba28bf-152e-4e0f-9b9c-638fb2ade0c3\":{\"name\":\"Unnamed Condition Set\",\"type\":\"conditionSet\",\"identifier\":{\"key\":\"18ba28bf-152e-4e0f-9b9c-638fb2ade0c3\",\"namespace\":\"\"},\"configuration\":{\"conditionTestData\":[],\"conditionCollection\":[{\"isDefault\":true,\"id\":\"43cfb4b1-348c-43c0-a681-c4cf53b5335f\",\"configuration\":{\"name\":\"Default\",\"output\":\"Default\",\"trigger\":\"all\",\"criteria\":[]},\"summary\":\"Default condition\"}]},\"composition\":[],\"telemetry\":{},\"modified\":1655770911020,\"location\":\"mine\",\"persisted\":1655770911020},\"fa64bd6c-9351-4d94-a54e-e062a93be3b6\":{\"name\":\"Unnamed Condition Set\",\"type\":\"conditionSet\",\"identifier\":{\"key\":\"fa64bd6c-9351-4d94-a54e-e062a93be3b6\",\"namespace\":\"\"},\"configuration\":{\"conditionTestData\":[],\"conditionCollection\":[{\"isDefault\":true,\"id\":\"26739ce0-9a56-466c-91dd-f08bd9bfc9d7\",\"configuration\":{\"name\":\"Default\",\"output\":\"Default\",\"trigger\":\"all\",\"criteria\":[]},\"summary\":\"Default condition\"}]},\"composition\":[],\"telemetry\":{},\"modified\":1656475294040,\"location\":\"mine\",\"persisted\":1656475294040}}"
}
]
}
]
}

111
e2e/tests/ui/layout/search/grandsearch.e2e.spec.js Normal file
View File

@ -0,0 +1,111 @@
/*****************************************************************************
* 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 search functionality.
*/
const { expect } = require('@playwright/test');
const { test } = require('../../../../fixtures');
/**
* Creates a notebook object and adds an entry.
* @param {import('@playwright/test').Page} page
*/
async function createClockAndDisplayLayout(page) {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
// Click button:has-text("Create")
await page.locator('button:has-text("Create")').click();
// Click li:has-text("Notebook")
await page.locator('li:has-text("Clock")').click();
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('button:has-text("OK")').click()
]);
// Click a:has-text("My Items")
await Promise.all([
page.waitForNavigation(),
page.locator('a:has-text("My Items") >> nth=0').click()
]);
// Click button:has-text("Create")
await page.locator('button:has-text("Create")').click();
// Click li:has-text("Notebook")
await page.locator('li:has-text("Display Layout")').click();
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('button:has-text("OK")').click()
]);
}
test.describe('Grand Search', () => {
test('Can search for objects, and subsequent search dropdown behaves properly', async ({ page }) => {
await createClockAndDisplayLayout(page);
// Click [aria-label="OpenMCT Search"] input[type="search"]
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('Cl');
await expect(page.locator('[aria-label="Search Result"]')).toContainText('Clock');
// Click text=Elements >> nth=0
await page.locator('text=Elements').first().click();
await expect(page.locator('[aria-label="Search Result"]')).not.toBeVisible();
// Click [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').click();
// Click [aria-label="Unnamed Clock clock result"] >> text=Unnamed Clock
await page.locator('[aria-label="Unnamed Clock clock result"] >> text=Unnamed Clock').click();
await expect(page.locator('.js-preview-window')).toBeVisible();
// Click [aria-label="Close"]
await page.locator('[aria-label="Close"]').click();
await expect(page.locator('[aria-label="Search Result"]')).toBeVisible();
await expect(page.locator('[aria-label="Search Result"]')).toContainText('Cloc');
// 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"]')).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"]')).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();
// Click text=Save and Finish Editing
await page.locator('text=Save and Finish Editing').click();
// Click [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').click();
// Fill [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').fill('Cl');
// Click text=Unnamed Clock
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Clock').click()
]);
await expect(page.locator('.is-object-type-clock')).toBeVisible();
});
});

76
e2e/tests/visual/addInit.visual.spec.js Normal file
View File

@ -0,0 +1,76 @@
/* eslint-disable no-undef */
/*****************************************************************************
* 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 with modified init scripts to inject plugins not otherwise available in the default contexts.
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 } = 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
const CUSTOM_NAME = 'CUSTOM_NAME';
// Snippet from https://github.com/microsoft/playwright/issues/6347#issuecomment-965887758
// Will replace with cy.clock() equivalent
test.beforeEach(async ({ context }) => {
await context.addInitScript({
path: path.join(__dirname, '../../..', './node_modules/sinon/pkg/sinon.js')
});
await context.addInitScript(() => {
window.__clock = sinon.useFakeTimers({
now: 0,
shouldAdvanceTime: true
}); //Set browser clock to UNIX Epoch
});
});
test('Visual - Restricted Notebook is visually correct @addInit', async ({ page }) => {
// eslint-disable-next-line no-undef
await page.addInitScript({ path: path.join(__dirname, '../plugins/notebook', './addInitRestrictedNotebook.js') });
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
//Click the Create button
await page.click('button:has-text("Create")');
// Click text=CUSTOM_NAME
await page.click(`text=${CUSTOM_NAME}`);
// Click text=OK
await Promise.all([
page.waitForNavigation({waitUntil: 'networkidle'}),
page.click('text=OK')
]);
// Take a snapshot of the newly created CUSTOM_NAME notebook
await page.waitForTimeout(VISUAL_GRACE_PERIOD);
await percySnapshot(page, 'Restricted Notebook with CUSTOM_NAME');
});

70
e2e/tests/visual/controlledClock.visual.spec.js Normal file
View File

@ -0,0 +1,70 @@
/*****************************************************************************
* 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');
// 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: 0, //Set browser clock to UNIX Epoch
shouldAdvanceTime: false, //Don't advance the clock
toFake: ["setTimeout", "nextTick"]
});
});
});
test.use({ storageState: './e2e/test-data/VisualTestData_storage.json' });
test('Visual - Overlay Plot Loading Indicator @localstorage', async ({ page }) => {
// Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
await page.locator('a:has-text("Unnamed Overlay Plot Overlay Plot")').click();
//Ensure that we're on the Unnamed Overlay Plot object
await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Overlay Plot');
//Wait for canvas to be rendered and stop animating
await page.locator('canvas >> nth=1').hover({trial: true});
//Take snapshot of Sine Wave Generator within Overlay Plot
await percySnapshot(page, 'SineWaveInOverlayPlot');
});

19
e2e/tests/visual/default.visual.spec.js
View File

@ -211,3 +211,22 @@ test('Visual - Display Layout Icon is correct', async ({ page }) => {
await percySnapshot(page, 'Display Layout Create Menu');
});
test('Visual - Default Gauge is correct', async ({ page }) => {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
//Click the Create button
await page.click('button:has-text("Create")');
await page.click('text=Gauge');
await page.click('text=OK');
// Take a snapshot of the newly created Gauge object
await page.waitForTimeout(VISUAL_GRACE_PERIOD);
await percySnapshot(page, 'Default Gauge');
});

86
e2e/tests/visual/generateVisualTestData.e2e.spec.js Normal file
View File

@ -0,0 +1,86 @@
/*****************************************************************************
* 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 generating LocalStorage via Session Storage to be used
in some visual test suites like controlledClock.visual.spec.js. This suite should run to completion
and generate an artifact named ./e2e/test-data/VisualTestData_storage.json . This will run
on every Commit to ensure that this object still loads into tests correctly and will retain the
.e2e.spec.js suffix.
TODO: Provide additional validation of object properties as it grows.
*/
const { test } = require('../../fixtures.js');
const { expect } = require('@playwright/test');
test('Generate Visual Test Data @localStorage', async ({ page, context }) => {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
await page.locator('button:has-text("Create")').click();
// add overlay plot with defaults
await page.locator('li:has-text("Overlay Plot")').click();
// Click on My Items in Tree. Workaround for https://github.com/nasa/openmct/issues/5184
await page.click('form[name="mctForm"] a:has-text("My Items")');
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
//Wait for Save Banner to appear1
page.waitForSelector('.c-message-banner__message')
]);
// save (exit edit mode)
await page.locator('text=Snapshot Save and Finish Editing Save and Continue Editing >> button').nth(1).click();
await page.locator('text=Save and Finish Editing').click();
// click create button
await page.locator('button:has-text("Create")').click();
// add sine wave generator with defaults
await page.locator('li:has-text("Sine Wave Generator")').click();
//Add a 5000 ms Delay
await page.locator('[aria-label="Loading Delay \\(ms\\)"]').fill('5000');
await Promise.all([
page.waitForNavigation(),
page.locator('text=OK').click(),
//Wait for Save Banner to appear1
page.waitForSelector('.c-message-banner__message')
]);
// focus the overlay plot
await page.locator('text=Open MCT My Items >> span').nth(3).click();
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Overlay Plot').first().click()
]);
await expect(page.locator('.l-browse-bar__object-name')).toContainText('Unnamed Overlay Plot');
//Save localStorage for future test execution
await context.storageState({ path: './e2e/test-data/VisualTestData_storage.json' });
});

104
e2e/tests/visual/search.visual.spec.js Normal file
View File

@ -0,0 +1,104 @@
/*****************************************************************************
* 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 search functionality.
*/
const { test, expect } = require('@playwright/test');
const percySnapshot = require('@percy/playwright');
/**
* Creates a notebook object and adds an entry.
* @param {import('@playwright/test').Page} page
*/
async function createClockAndDisplayLayout(page) {
//Go to baseURL
await page.goto('/', { waitUntil: 'networkidle' });
// Click button:has-text("Create")
await page.locator('button:has-text("Create")').click();
// Click li:has-text("Notebook")
await page.locator('li:has-text("Clock")').click();
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('button:has-text("OK")').click()
]);
// Click a:has-text("My Items")
await Promise.all([
page.waitForNavigation(),
page.locator('a:has-text("My Items") >> nth=0').click()
]);
// Click button:has-text("Create")
await page.locator('button:has-text("Create")').click();
// Click li:has-text("Notebook")
await page.locator('li:has-text("Display Layout")').click();
// Click button:has-text("OK")
await Promise.all([
page.waitForNavigation(),
page.locator('button:has-text("OK")').click()
]);
}
test.describe('Grand Search', () => {
test('Can search for objects, and subsequent search dropdown behaves properly', async ({ page }) => {
await createClockAndDisplayLayout(page);
// Click [aria-label="OpenMCT Search"] input[type="search"]
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('Cl');
await expect(page.locator('[aria-label="Search Result"]')).toContainText('Clock');
await percySnapshot(page, 'Searching for Clocks');
// Click text=Elements >> nth=0
await page.locator('text=Elements').first().click();
await expect(page.locator('[aria-label="Search Result"]')).not.toBeVisible();
// Click [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').click();
// Click [aria-label="Unnamed Clock clock result"] >> text=Unnamed Clock
await page.locator('[aria-label="Unnamed Clock clock result"] >> text=Unnamed Clock').click();
await percySnapshot(page, 'Preview for clock should display when editing enabled and search item clicked');
// Click [aria-label="Close"]
await page.locator('[aria-label="Close"]').click();
await percySnapshot(page, 'Search should still be showing after preview closed');
// 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 [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').click();
// Fill [aria-label="OpenMCT Search"] [aria-label="Search Input"]
await page.locator('[aria-label="OpenMCT Search"] [aria-label="Search Input"]').fill('Cl');
// Click text=Unnamed Clock
await Promise.all([
page.waitForNavigation(),
page.locator('text=Unnamed Clock').click()
]);
await percySnapshot(page, 'Clicking on search results should navigate to them if not editing');
});
});

6
example/exampleUser/ExampleUserProvider.js
View File

@ -31,7 +31,7 @@ const STATUSES = [{
iconClassPoll: "icon-status-poll-question-mark"
}, {
key: "GO",
label: "GO",
label: "Go",
iconClass: "icon-check",
iconClassPoll: "icon-status-poll-question-mark",
statusClass: "s-status-ok",
@ -39,7 +39,7 @@ const STATUSES = [{
statusFgColor: "#000"
}, {
key: "MAYBE",
label: "MAYBE",
label: "Maybe",
iconClass: "icon-alert-triangle",
iconClassPoll: "icon-status-poll-question-mark",
statusClass: "s-status-warning",
@ -47,7 +47,7 @@ const STATUSES = [{
statusFgColor: "#000"
}, {
key: "NO_GO",
label: "NO GO",
label: "No go",
iconClass: "icon-circle-slash",
iconClassPoll: "icon-status-poll-question-mark",
statusClass: "s-status-error",

6
example/generator/GeneratorProvider.js
View File

@ -32,7 +32,8 @@ define([
offset: 0,
dataRateInHz: 1,
randomness: 0,
phase: 0
phase: 0,
loadDelay: 0
};
function GeneratorProvider(openmct) {
@ -53,8 +54,9 @@ define([
'period',
'offset',
'dataRateInHz',
'randomness',
'phase',
'randomness'
'loadDelay'
];
request = request || {};

9
example/generator/generatorWorker.js
View File

@ -116,6 +116,7 @@
var dataRateInHz = request.dataRateInHz;
var phase = request.phase;
var randomness = request.randomness;
var loadDelay = Math.max(request.loadDelay, 0);
var step = 1000 / dataRateInHz;
var nextStep = start - (start % step) + step;
@ -133,6 +134,14 @@
});
}
if (loadDelay === 0) {
postOnRequest(message, request, data);
} else {
setTimeout(() => postOnRequest(message, request, data), loadDelay);
}
}
function postOnRequest(message, request, data) {
self.postMessage({
id: message.id,
data: request.spectra ? {

18
example/generator/plugin.js
View File

@ -81,7 +81,7 @@ define([
{
name: "Amplitude",
control: "numberfield",
cssClass: "l-input-sm l-numeric",
cssClass: "l-numeric",
key: "amplitude",
required: true,
property: [
@ -92,7 +92,7 @@ define([
{
name: "Offset",
control: "numberfield",
cssClass: "l-input-sm l-numeric",
cssClass: "l-numeric",
key: "offset",
required: true,
property: [
@ -132,6 +132,17 @@ define([
"telemetry",
"randomness"
]
},
{
name: "Loading Delay (ms)",
control: "numberfield",
cssClass: "l-input-sm l-numeric",
key: "loadDelay",
required: true,
property: [
"telemetry",
"loadDelay"
]
}
],
initialize: function (object) {
@ -141,7 +152,8 @@ define([
offset: 0,
dataRateInHz: 1,
phase: 0,
randomness: 0
randomness: 0,
loadDelay: 0
};
}
});

7
example/imagery/plugin.js
View File

@ -190,7 +190,9 @@ function getRealtimeProvider() {
subscribe: (domainObject, callback) => {
const delay = getImageLoadDelay(domainObject);
const interval = setInterval(() => {
callback(pointForTimestamp(Date.now(), domainObject.name, getImageSamples(domainObject.configuration), delay));
const imageSamples = getImageSamples(domainObject.configuration);
const datum = pointForTimestamp(Date.now(), domainObject.name, imageSamples, delay);
callback(datum);
}, delay);
return () => {
@ -229,8 +231,9 @@ function getLadProvider() {
},
request: (domainObject, options) => {
const delay = getImageLoadDelay(domainObject);
const datum = pointForTimestamp(Date.now(), domainObject.name, getImageSamples(domainObject.configuration), delay);
return Promise.resolve([pointForTimestamp(Date.now(), domainObject.name, delay)]);
return Promise.resolve([datum]);
}
};
}

8
package.json
View File

@ -88,17 +88,17 @@
"build:coverage": "webpack --config webpack.coverage.js",
"build:watch": "webpack --config webpack.dev.js --watch",
"info": "npx envinfo --system --browsers --npmPackages --binaries --languages --markdown",
"test": "cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --single-run",
"test:firefox": "cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --single-run --browsers=FirefoxHeadless",
"test": "cross-env NODE_ENV=test NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --single-run",
"test:firefox": "cross-env NODE_ENV=test NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --single-run --browsers=FirefoxHeadless",
"test:debug": "cross-env NODE_ENV=debug karma start --no-single-run",
"test:e2e": "npx playwright test",
"test:e2e:ci": "npx playwright test --config=e2e/playwright-ci.config.js --project=chrome smoke branding default condition timeConductor clock exampleImagery persistence performance",
"test:e2e:ci": "npx playwright test --config=e2e/playwright-ci.config.js --project=chrome smoke branding default condition timeConductor clock exampleImagery persistence performance grandsearch notebook/tags",
"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",
"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_OPTIONS=\"--max_old_space_size=4096\" karma start --no-single-run",
"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'",

273
src/MCT.js
View File

@ -96,161 +96,167 @@ define([
};
this.destroy = this.destroy.bind(this);
/**
* Tracks current selection state of the application.
* @private
*/
this.selection = new Selection(this);
[
/**
* Tracks current selection state of the application.
* @private
*/
['selection', () => new Selection(this)],
/**
* MCT's time conductor, which may be used to synchronize view contents
* for telemetry- or time-based views.
* @type {module:openmct.TimeConductor}
* @memberof module:openmct.MCT#
* @name conductor
*/
this.time = new api.TimeAPI(this);
/**
* MCT's time conductor, which may be used to synchronize view contents
* for telemetry- or time-based views.
* @type {module:openmct.TimeConductor}
* @memberof module:openmct.MCT#
* @name conductor
*/
['time', () => new api.TimeAPI(this)],
/**
* An interface for interacting with the composition of domain objects.
* The composition of a domain object is the list of other domain
* objects it "contains" (for instance, that should be displayed
* beneath it in the tree.)
*
* `composition` may be called as a function, in which case it acts
* as [`composition.get`]{@link module:openmct.CompositionAPI#get}.
*
* @type {module:openmct.CompositionAPI}
* @memberof module:openmct.MCT#
* @name composition
*/
this.composition = new api.CompositionAPI(this);
/**
* An interface for interacting with the composition of domain objects.
* The composition of a domain object is the list of other domain
* objects it "contains" (for instance, that should be displayed
* beneath it in the tree.)
*
* `composition` may be called as a function, in which case it acts
* as [`composition.get`]{@link module:openmct.CompositionAPI#get}.
*
* @type {module:openmct.CompositionAPI}
* @memberof module:openmct.MCT#
* @name composition
*/
['composition', () => new api.CompositionAPI(this)],
/**
* Registry for views of domain objects which should appear in the
* main viewing area.
*
* @type {module:openmct.ViewRegistry}
* @memberof module:openmct.MCT#
* @name objectViews
*/
this.objectViews = new ViewRegistry();
/**
* Registry for views of domain objects which should appear in the
* main viewing area.
*
* @type {module:openmct.ViewRegistry}
* @memberof module:openmct.MCT#
* @name objectViews
*/
['objectViews', () => new ViewRegistry()],
/**
* Registry for views which should appear in the Inspector area.
* These views will be chosen based on the selection state.
*
* @type {module:openmct.InspectorViewRegistry}
* @memberof module:openmct.MCT#
* @name inspectorViews
*/
this.inspectorViews = new InspectorViewRegistry();
/**
* Registry for views which should appear in the Inspector area.
* These views will be chosen based on the selection state.
*
* @type {module:openmct.InspectorViewRegistry}
* @memberof module:openmct.MCT#
* @name inspectorViews
*/
['inspectorViews', () => new InspectorViewRegistry()],
/**
* Registry for views which should appear in Edit Properties
* dialogs, and similar user interface elements used for
* modifying domain objects external to its regular views.
*
* @type {module:openmct.ViewRegistry}
* @memberof module:openmct.MCT#
* @name propertyEditors
*/
this.propertyEditors = new ViewRegistry();
/**
* Registry for views which should appear in Edit Properties
* dialogs, and similar user interface elements used for
* modifying domain objects external to its regular views.
*
* @type {module:openmct.ViewRegistry}
* @memberof module:openmct.MCT#
* @name propertyEditors
*/
['propertyEditors', () => new ViewRegistry()],
/**
* Registry for views which should appear in the status indicator area.
* @type {module:openmct.ViewRegistry}
* @memberof module:openmct.MCT#
* @name indicators
*/
this.indicators = new ViewRegistry();
/**
* Registry for views which should appear in the toolbar area while
* editing. These views will be chosen based on the selection state.
*
* @type {module:openmct.ToolbarRegistry}
* @memberof module:openmct.MCT#
* @name toolbars
*/
['toolbars', () => new ToolbarRegistry()],
/**
* Registry for views which should appear in the toolbar area while
* editing. These views will be chosen based on the selection state.
*
* @type {module:openmct.ToolbarRegistry}
* @memberof module:openmct.MCT#
* @name toolbars
*/
this.toolbars = new ToolbarRegistry();
/**
* Registry for domain object types which may exist within this
* instance of Open MCT.
*
* @type {module:openmct.TypeRegistry}
* @memberof module:openmct.MCT#
* @name types
*/
['types', () => new api.TypeRegistry()],
/**
* Registry for domain object types which may exist within this
* instance of Open MCT.
*
* @type {module:openmct.TypeRegistry}
* @memberof module:openmct.MCT#
* @name types
*/
this.types = new api.TypeRegistry();
/**
* An interface for interacting with domain objects and the domain
* object hierarchy.
*
* @type {module:openmct.ObjectAPI}
* @memberof module:openmct.MCT#
* @name objects
*/
['objects', () => new api.ObjectAPI.default(this.types, this)],
/**
* An interface for interacting with domain objects and the domain
* object hierarchy.
*
* @type {module:openmct.ObjectAPI}
* @memberof module:openmct.MCT#
* @name objects
*/
this.objects = new api.ObjectAPI.default(this.types, this);
/**
* An interface for retrieving and interpreting telemetry data associated
* with a domain object.
*
* @type {module:openmct.TelemetryAPI}
* @memberof module:openmct.MCT#
* @name telemetry
*/
['telemetry', () => new api.TelemetryAPI.default(this)],
/**
* An interface for retrieving and interpreting telemetry data associated
* with a domain object.
*
* @type {module:openmct.TelemetryAPI}
* @memberof module:openmct.MCT#
* @name telemetry
*/
this.telemetry = new api.TelemetryAPI(this);
/**
* An interface for creating new indicators and changing them dynamically.
*
* @type {module:openmct.IndicatorAPI}
* @memberof module:openmct.MCT#
* @name indicators
*/
['indicators', () => new api.IndicatorAPI(this)],
/**
* An interface for creating new indicators and changing them dynamically.
*
* @type {module:openmct.IndicatorAPI}
* @memberof module:openmct.MCT#
* @name indicators
*/
this.indicators = new api.IndicatorAPI(this);
/**
* MCT's user awareness management, to enable user and
* role specific functionality.
* @type {module:openmct.UserAPI}
* @memberof module:openmct.MCT#
* @name user
*/
['user', () => new api.UserAPI(this)],
/**
* MCT's user awareness management, to enable user and
* role specific functionality.
* @type {module:openmct.UserAPI}
* @memberof module:openmct.MCT#
* @name user
*/
this.user = new api.UserAPI(this);
['notifications', () => new api.NotificationAPI()],
this.notifications = new api.NotificationAPI();
['editor', () => new api.EditorAPI.default(this)],
this.editor = new api.EditorAPI.default(this);
['overlays', () => new OverlayAPI.default()],
this.overlays = new OverlayAPI.default();
['menus', () => new api.MenuAPI(this)],
this.menus = new api.MenuAPI(this);
['actions', () => new api.ActionsAPI(this)],
this.actions = new api.ActionsAPI(this);
['status', () => new api.StatusAPI(this)],
this.status = new api.StatusAPI(this);
['priority', () => api.PriorityAPI],
this.priority = api.PriorityAPI;
['router', () => new ApplicationRouter(this)],
this.router = new ApplicationRouter(this);
this.faults = new api.FaultManagementAPI.default(this);
this.forms = new api.FormsAPI.default(this);
['faults', () => new api.FaultManagementAPI.default(this)],
this.branding = BrandingAPI.default;
['forms', () => new api.FormsAPI.default(this)],
/**
* MCT's annotation API that enables
* human-created comments and categorization linked to data products
* @type {module:openmct.AnnotationAPI}
* @memberof module:openmct.MCT#
* @name annotation
*/
this.annotation = new api.AnnotationAPI(this);
['branding', () => BrandingAPI.default],
/**
* MCT's annotation API that enables
* human-created comments and categorization linked to data products
* @type {module:openmct.AnnotationAPI}
* @memberof module:openmct.MCT#
* @name annotation
*/
['annotation', () => new api.AnnotationAPI(this)]
].forEach(apiEntry => {
const apiName = apiEntry[0];
const apiObject = apiEntry[1]();
Object.defineProperty(this, apiName, {
value: apiObject,
enumerable: false,
configurable: false,
writable: true
});
});
// Plugins that are installed by default
this.install(this.plugins.Plot());
@ -281,6 +287,7 @@ define([
this.install(this.plugins.ObjectInterceptors());
this.install(this.plugins.DeviceClassifier());
this.install(this.plugins.UserIndicator());
this.install(this.plugins.Gauge());
}
MCT.prototype = Object.create(EventEmitter.prototype);

3
src/api/actions/ActionCollection.js
View File

@ -85,8 +85,6 @@ class ActionCollection extends EventEmitter {
}
destroy() {
super.removeAllListeners();
if (!this.skipEnvironmentObservers) {
this.objectUnsubscribes.forEach(unsubscribe => {
unsubscribe();
@ -96,6 +94,7 @@ class ActionCollection extends EventEmitter {
}
this.emit('destroy', this.view);
this.removeAllListeners();
}
getVisibleActions() {

16
src/api/annotation/AnnotationAPI.js
View File

@ -172,17 +172,19 @@ export default class AnnotationAPI extends EventEmitter {
name: contentText,
domainObject: targetDomainObject,
annotationType,
tags: [],
tags: [tag],
contentText,
targets
};
existingAnnotation = await this.create(annotationCreationArguments);
const newAnnotation = await this.create(annotationCreationArguments);
return newAnnotation;
} else {
const tagArray = [tag, ...existingAnnotation.tags];
this.openmct.objects.mutate(existingAnnotation, 'tags', tagArray);
return existingAnnotation;
}
const tagArray = [tag, ...existingAnnotation.tags];
this.openmct.objects.mutate(existingAnnotation, 'tags', tagArray);
return existingAnnotation;
}
removeAnnotationTag(existingAnnotation, tagToRemove) {

2
src/api/forms/components/FormProperties.vue
View File

@ -60,6 +60,7 @@
tabindex="0"
:disabled="isInvalid"
class="c-button c-button--major"
aria-label="Save"
@click="onSave"
>
{{ submitLabel }}
@ -67,6 +68,7 @@
<button
tabindex="0"
class="c-button js-cancel-button"
aria-label="Cancel"
@click="onDismiss"
>
{{ cancelLabel }}

1
src/api/forms/components/controls/AutoCompleteField.vue
View File

@ -44,6 +44,7 @@
<div
v-if="!hideOptions"
class="c-menu c-input--autocomplete__options"
aria-label="Autocomplete Options"
@blur="hideOptions = true"
>
<ul>

1
src/api/forms/components/controls/NumberField.vue
View File

@ -28,6 +28,7 @@
>
<input
v-model="field"
:aria-label="model.name"
type="number"
:min="model.min"
:max="model.max"

34
src/api/objects/InMemorySearchProvider.js
View File

@ -224,7 +224,8 @@ class InMemorySearchProvider {
/**
* Schedule an id to be indexed at a later date. If there are less
* pending requests then allowed, will kick off an indexing request.
* pending requests than the maximum allowed, this will kick off an indexing request.
* This is done only when indexing first begins and we need to index a lot of objects.
*
* @private
* @param {identifier} id to be indexed.
@ -258,8 +259,12 @@ class InMemorySearchProvider {
}
onAnnotationCreation(annotationObject) {
const provider = this;
provider.index(annotationObject);
const objectProvider = this.openmct.objects.getProvider(annotationObject.identifier);
if (objectProvider === undefined || objectProvider.search === undefined) {
const provider = this;
provider.index(annotationObject);
}
}
onNameMutation(domainObject, name) {
@ -270,7 +275,6 @@ class InMemorySearchProvider {
}
onTagMutation(domainObject, newTags) {
domainObject.oldTags = domainObject.tags;
domainObject.tags = newTags;
const provider = this;
@ -404,20 +408,16 @@ class InMemorySearchProvider {
}
});
// remove old tags
if (model.oldTags) {
model.oldTags.forEach(tagIDToRemove => {
const existsInNewModel = model.tags.includes(tagIDToRemove);
if (!existsInNewModel && this.localIndexedAnnotationsByTag[tagIDToRemove]) {
this.localIndexedAnnotationsByTag[tagIDToRemove] = this.localIndexedAnnotationsByTag[tagIDToRemove].
filter(annotationToRemove => {
const shouldKeep = annotationToRemove.keyString !== keyString;
const tagsToRemoveFromIndex = Object.keys(this.localIndexedAnnotationsByTag).filter(indexedTag => {
return !(model.tags.includes(indexedTag));
});
tagsToRemoveFromIndex.forEach(tagToRemoveFromIndex => {
this.localIndexedAnnotationsByTag[tagToRemoveFromIndex] = this.localIndexedAnnotationsByTag[tagToRemoveFromIndex].filter(indexedAnnotation => {
const shouldKeep = indexedAnnotation.keyString !== keyString;
return shouldKeep;
});
}
return shouldKeep;
});
}
});
}
localIndexAnnotation(objectToIndex, model) {
@ -449,7 +449,7 @@ class InMemorySearchProvider {
keyString
};
if (model && (model.type === 'annotation')) {
if (model.targets && model.targets) {
if (model.targets) {
this.localIndexAnnotation(objectToIndex, model);
}

21
src/api/objects/InMemorySearchWorker.js
View File

@ -94,19 +94,16 @@
});
// remove old tags
if (model.oldTags) {
model.oldTags.forEach(tagIDToRemove => {
const existsInNewModel = model.tags.includes(tagIDToRemove);
if (!existsInNewModel && indexedAnnotationsByTag[tagIDToRemove]) {
indexedAnnotationsByTag[tagIDToRemove] = indexedAnnotationsByTag[tagIDToRemove].
filter(annotationToRemove => {
const shouldKeep = annotationToRemove.keyString !== keyString;
const tagsToRemoveFromIndex = Object.keys(indexedAnnotationsByTag).filter(indexedTag => {
return !(model.tags.includes(indexedTag));
});
tagsToRemoveFromIndex.forEach(tagToRemoveFromIndex => {
indexedAnnotationsByTag[tagToRemoveFromIndex] = indexedAnnotationsByTag[tagToRemoveFromIndex].filter(indexedAnnotation => {
const shouldKeep = indexedAnnotation.keyString !== keyString;
return shouldKeep;
});
}
return shouldKeep;
});
}
});
}
function indexItem(keyString, model) {
@ -116,7 +113,7 @@
keyString
};
if (model && (model.type === 'annotation')) {
if (model.targets && model.targets) {
if (model.targets) {
indexAnnotation(objectToIndex, model);
}

6
src/api/objects/ObjectAPI.js
View File

@ -233,7 +233,11 @@ export default class ObjectAPI {
delete this.cache[keystring];
result = this.applyGetInterceptors(identifier);
if (!result) {
//no result means resource either doesn't exist or is missing
//otherwise it's an error, and we shouldn't apply interceptors
result = this.applyGetInterceptors(identifier);
}
return result;
});

372
src/api/telemetry/TelemetryAPI.js
View File

@ -20,122 +20,18 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
const { TelemetryCollection } = require("./TelemetryCollection");
import TelemetryCollection from './TelemetryCollection';
import TelemetryRequestInterceptorRegistry from './TelemetryRequestInterceptor';
import CustomStringFormatter from '../../plugins/displayLayout/CustomStringFormatter';
import TelemetryMetadataManager from './TelemetryMetadataManager';
import TelemetryValueFormatter from './TelemetryValueFormatter';
import DefaultMetadataProvider from './DefaultMetadataProvider';
import objectUtils from 'objectUtils';
import _ from 'lodash';
define([
'../../plugins/displayLayout/CustomStringFormatter',
'./TelemetryMetadataManager',
'./TelemetryValueFormatter',
'./DefaultMetadataProvider',
'objectUtils',
'lodash'
], function (
CustomStringFormatter,
TelemetryMetadataManager,
TelemetryValueFormatter,
DefaultMetadataProvider,
objectUtils,
_
) {
/**
* A LimitEvaluator may be used to detect when telemetry values
* have exceeded nominal conditions.
*
* @interface LimitEvaluator
* @memberof module:openmct.TelemetryAPI~
*/
export default class TelemetryAPI {
/**
* Check for any limit violations associated with a telemetry datum.
* @method evaluate
* @param {*} datum the telemetry datum to evaluate
* @param {TelemetryProperty} the property to check for limit violations
* @memberof module:openmct.TelemetryAPI~LimitEvaluator
* @returns {module:openmct.TelemetryAPI~LimitViolation} metadata about
* the limit violation, or undefined if a value is within limits
*/
/**
* A violation of limits defined for a telemetry property.
* @typedef LimitViolation
* @memberof {module:openmct.TelemetryAPI~}
* @property {string} cssClass the class (or space-separated classes) to
* apply to display elements for values which violate this limit
* @property {string} name the human-readable name for the limit violation
*/
/**
* A TelemetryFormatter converts telemetry values for purposes of
* display as text.
*
* @interface TelemetryFormatter
* @memberof module:openmct.TelemetryAPI~
*/
/**
* Retrieve the 'key' from the datum and format it accordingly to
* telemetry metadata in domain object.
*
* @method format
* @memberof module:openmct.TelemetryAPI~TelemetryFormatter#
*/
/**
* Describes a property which would be found in a datum of telemetry
* associated with a particular domain object.
*
* @typedef TelemetryProperty
* @memberof module:openmct.TelemetryAPI~
* @property {string} key the name of the property in the datum which
* contains this telemetry value
* @property {string} name the human-readable name for this property
* @property {string} [units] the units associated with this property
* @property {boolean} [temporal] true if this property is a timestamp, or
* may be otherwise used to order telemetry in a time-like
* fashion; default is false
* @property {boolean} [numeric] true if the values for this property
* can be interpreted plainly as numbers; default is true
* @property {boolean} [enumerated] true if this property may have only
* certain specific values; default is false
* @property {string} [values] for enumerated states, an ordered list
* of possible values
*/
/**
* Describes and bounds requests for telemetry data.
*
* @typedef TelemetryRequest
* @memberof module:openmct.TelemetryAPI~
* @property {string} sort the key of the property to sort by. This may
* be prefixed with a "+" or a "-" sign to sort in ascending
* or descending order respectively. If no prefix is present,
* ascending order will be used.
* @property {*} start the lower bound for values of the sorting property
* @property {*} end the upper bound for values of the sorting property
* @property {string[]} strategies symbolic identifiers for strategies
* (such as `minmax`) which may be recognized by providers;
* these will be tried in order until an appropriate provider
* is found
*/
/**
* Provides telemetry data. To connect to new data sources, new
* TelemetryProvider implementations should be
* [registered]{@link module:openmct.TelemetryAPI#addProvider}.
*
* @interface TelemetryProvider
* @memberof module:openmct.TelemetryAPI~
*/
/**
* An interface for retrieving telemetry data associated with a domain
* object.
*
* @interface TelemetryAPI
* @augments module:openmct.TelemetryAPI~TelemetryProvider
* @memberof module:openmct
*/
function TelemetryAPI(openmct) {
constructor(openmct) {
this.openmct = openmct;
this.formatMapCache = new WeakMap();
@ -148,12 +44,14 @@ define([
this.requestProviders = [];
this.subscriptionProviders = [];
this.valueFormatterCache = new WeakMap();
this.requestInterceptorRegistry = new TelemetryRequestInterceptorRegistry();
}
TelemetryAPI.prototype.abortAllRequests = function () {
abortAllRequests() {
this.requestAbortControllers.forEach((controller) => controller.abort());
this.requestAbortControllers.clear();
};
}
/**
* Return Custom String Formatter
@ -162,9 +60,9 @@ define([
* @param {string} format custom formatter string (eg: %.4f, &lts etc.)
* @returns {CustomStringFormatter}
*/
TelemetryAPI.prototype.customStringFormatter = function (valueMetadata, format) {
return new CustomStringFormatter.default(this.openmct, valueMetadata, format);
};
customStringFormatter(valueMetadata, format) {
return new CustomStringFormatter(this.openmct, valueMetadata, format);
}
/**
* Return true if the given domainObject is a telemetry object. A telemetry
@ -174,9 +72,9 @@ define([
* @param {module:openmct.DomainObject} domainObject
* @returns {boolean} true if the object is a telemetry object.
*/
TelemetryAPI.prototype.isTelemetryObject = function (domainObject) {
isTelemetryObject(domainObject) {
return Boolean(this.findMetadataProvider(domainObject));
};
}
/**
* Check if this provider can supply telemetry data associated with
@ -188,10 +86,10 @@ define([
* @returns {boolean} true if telemetry can be provided
* @memberof module:openmct.TelemetryAPI~TelemetryProvider#
*/
TelemetryAPI.prototype.canProvideTelemetry = function (domainObject) {
canProvideTelemetry(domainObject) {
return Boolean(this.findSubscriptionProvider(domainObject))
|| Boolean(this.findRequestProvider(domainObject));
};
|| Boolean(this.findRequestProvider(domainObject));
}
/**
* Register a telemetry provider with the telemetry service. This
@ -201,7 +99,7 @@ define([
* @param {module:openmct.TelemetryAPI~TelemetryProvider} provider the new
* telemetry provider
*/
TelemetryAPI.prototype.addProvider = function (provider) {
addProvider(provider) {
if (provider.supportsRequest) {
this.requestProviders.unshift(provider);
}
@ -217,54 +115,54 @@ define([
if (provider.supportsLimits) {
this.limitProviders.unshift(provider);
}
};
}
/**
* @private
*/
TelemetryAPI.prototype.findSubscriptionProvider = function () {
findSubscriptionProvider() {
const args = Array.prototype.slice.apply(arguments);
function supportsDomainObject(provider) {
return provider.supportsSubscribe.apply(provider, args);
}
return this.subscriptionProviders.filter(supportsDomainObject)[0];
};
}
/**
* @private
*/
TelemetryAPI.prototype.findRequestProvider = function (domainObject) {
findRequestProvider(domainObject) {
const args = Array.prototype.slice.apply(arguments);
function supportsDomainObject(provider) {
return provider.supportsRequest.apply(provider, args);
}
return this.requestProviders.filter(supportsDomainObject)[0];
};
}
/**
* @private
*/
TelemetryAPI.prototype.findMetadataProvider = function (domainObject) {
findMetadataProvider(domainObject) {
return this.metadataProviders.filter(function (p) {
return p.supportsMetadata(domainObject);
})[0];
};
}
/**
* @private
*/
TelemetryAPI.prototype.findLimitEvaluator = function (domainObject) {
findLimitEvaluator(domainObject) {
return this.limitProviders.filter(function (p) {
return p.supportsLimits(domainObject);
})[0];
};
}
/**
* @private
*/
TelemetryAPI.prototype.standardizeRequestOptions = function (options) {
standardizeRequestOptions(options) {
if (!Object.prototype.hasOwnProperty.call(options, 'start')) {
options.start = this.openmct.time.bounds().start;
}
@ -276,7 +174,47 @@ define([
if (!Object.prototype.hasOwnProperty.call(options, 'domain')) {
options.domain = this.openmct.time.timeSystem().key;
}
};
}
/**
* Register a request interceptor that transforms a request via module:openmct.TelemetryAPI.request
* The request will be modifyed when it is received and will be returned in it's modified state
* The request will be transformed only if the interceptor is applicable to that domain object as defined by the RequestInterceptorDef
*
* @param {module:openmct.RequestInterceptorDef} requestInterceptorDef the request interceptor definition to add
* @method addRequestInterceptor
* @memberof module:openmct.TelemetryRequestInterceptorRegistry#
*/
addRequestInterceptor(requestInterceptorDef) {
this.requestInterceptorRegistry.addInterceptor(requestInterceptorDef);
}
/**
* Retrieve the request interceptors for a given domain object.
* @private
*/
#getInterceptorsForRequest(identifier, request) {
return this.requestInterceptorRegistry.getInterceptors(identifier, request);
}
/**
* Invoke interceptors if applicable for a given domain object.
*/
async applyRequestInterceptors(domainObject, request) {
const interceptors = this.#getInterceptorsForRequest(domainObject.identifier, request);
if (interceptors.length === 0) {
return request;
}
let modifiedRequest = { ...request };
for (let interceptor of interceptors) {
modifiedRequest = await interceptor.invoke(modifiedRequest);
}
return modifiedRequest;
}
/**
* Request telemetry collection for a domain object.
@ -292,13 +230,13 @@ define([
* options for this telemetry collection request
* @returns {TelemetryCollection} a TelemetryCollection instance
*/
TelemetryAPI.prototype.requestCollection = function (domainObject, options = {}) {
requestCollection(domainObject, options = {}) {
return new TelemetryCollection(
this.openmct,
domainObject,
options
);
};
}
/**
* Request historical telemetry for a domain object.
@ -315,7 +253,7 @@ define([
* @returns {Promise.<object[]>} a promise for an array of
* telemetry data
*/
TelemetryAPI.prototype.request = function (domainObject) {
async request(domainObject) {
if (this.noRequestProviderForAllObjects) {
return Promise.resolve([]);
}
@ -330,6 +268,7 @@ define([
this.requestAbortControllers.add(abortController);
this.standardizeRequestOptions(arguments[1]);
const provider = this.findRequestProvider.apply(this, arguments);
if (!provider) {
this.requestAbortControllers.delete(abortController);
@ -337,6 +276,8 @@ define([
return this.handleMissingRequestProvider(domainObject);
}
arguments[1] = await this.applyRequestInterceptors(domainObject, arguments[1]);
return provider.request.apply(provider, arguments)
.catch((rejected) => {
if (rejected.name !== 'AbortError') {
@ -348,7 +289,7 @@ define([
}).finally(() => {
this.requestAbortControllers.delete(abortController);
});
};
}
/**
* Subscribe to realtime telemetry for a specific domain object.
@ -364,7 +305,7 @@ define([
* @returns {Function} a function which may be called to terminate
* the subscription
*/
TelemetryAPI.prototype.subscribe = function (domainObject, callback, options) {
subscribe(domainObject, callback, options) {
const provider = this.findSubscriptionProvider(domainObject);
if (!this.subscribeCache) {
@ -401,7 +342,7 @@ define([
delete this.subscribeCache[keyString];
}
}.bind(this);
};
}
/**
* Get telemetry metadata for a given domain object. Returns a telemetry
@ -410,7 +351,7 @@ define([
*
* @returns {TelemetryMetadataManager}
*/
TelemetryAPI.prototype.getMetadata = function (domainObject) {
getMetadata(domainObject) {
if (!this.metadataCache.has(domainObject)) {
const metadataProvider = this.findMetadataProvider(domainObject);
if (!metadataProvider) {
@ -426,14 +367,14 @@ define([
}
return this.metadataCache.get(domainObject);
};
}
/**
* Return an array of valueMetadatas that are common to all supplied
* telemetry objects and match the requested hints.
*
*/
TelemetryAPI.prototype.commonValuesForHints = function (metadatas, hints) {
commonValuesForHints(metadatas, hints) {
const options = metadatas.map(function (metadata) {
const values = metadata.valuesForHints(hints);
@ -453,14 +394,14 @@ define([
});
return _.sortBy(options, sortKeys);
};
}
/**
* Get a value formatter for a given valueMetadata.
*
* @returns {TelemetryValueFormatter}
*/
TelemetryAPI.prototype.getValueFormatter = function (valueMetadata) {
getValueFormatter(valueMetadata) {
if (!this.valueFormatterCache.has(valueMetadata)) {
this.valueFormatterCache.set(
valueMetadata,
@ -469,7 +410,7 @@ define([
}
return this.valueFormatterCache.get(valueMetadata);
};
}
/**
* Get a value formatter for a given key.
@ -477,9 +418,9 @@ define([
*
* @returns {Format}
*/
TelemetryAPI.prototype.getFormatter = function (key) {
getFormatter(key) {
return this.formatters.get(key);
};
}
/**
* Get a format map of all value formatters for a given piece of telemetry
@ -487,7 +428,7 @@ define([
*
* @returns {Object<String, {TelemetryValueFormatter}>}
*/
TelemetryAPI.prototype.getFormatMap = function (metadata) {
getFormatMap(metadata) {
if (!metadata) {
return {};
}
@ -502,14 +443,14 @@ define([
}
return this.formatMapCache.get(metadata);
};
}
/**
* Error Handling: Missing Request provider
*
* @returns Promise
*/
TelemetryAPI.prototype.handleMissingRequestProvider = function (domainObject) {
handleMissingRequestProvider(domainObject) {
this.noRequestProviderForAllObjects = this.requestProviders.every(requestProvider => {
const supportsRequest = requestProvider.supportsRequest.apply(requestProvider, arguments);
const hasRequestProvider = Object.prototype.hasOwnProperty.call(requestProvider, 'request') && typeof requestProvider.request === 'function';
@ -529,18 +470,18 @@ define([
}
this.openmct.notifications.error(message);
console.error(detailMessage);
console.warn(detailMessage);
return Promise.resolve([]);
};
}
/**
* Register a new telemetry data formatter.
* @param {Format} format the
*/
TelemetryAPI.prototype.addFormat = function (format) {
addFormat(format) {
this.formatters.set(format.key, format);
};
}
/**
* Get a limit evaluator for this domain object.
@ -558,9 +499,9 @@ define([
* @method limitEvaluator
* @memberof module:openmct.TelemetryAPI~TelemetryProvider#
*/
TelemetryAPI.prototype.limitEvaluator = function (domainObject) {
limitEvaluator(domainObject) {
return this.getLimitEvaluator(domainObject);
};
}
/**
* Get a limits for this domain object.
@ -578,9 +519,9 @@ define([
* @method limits
* @memberof module:openmct.TelemetryAPI~TelemetryProvider#
*/
TelemetryAPI.prototype.limitDefinition = function (domainObject) {
limitDefinition(domainObject) {
return this.getLimits(domainObject);
};
}
/**
* Get a limit evaluator for this domain object.
@ -598,7 +539,7 @@ define([
* @method limitEvaluator
* @memberof module:openmct.TelemetryAPI~TelemetryProvider#
*/
TelemetryAPI.prototype.getLimitEvaluator = function (domainObject) {
getLimitEvaluator(domainObject) {
const provider = this.findLimitEvaluator(domainObject);
if (!provider) {
return {
@ -607,7 +548,7 @@ define([
}
return provider.getLimitEvaluator(domainObject);
};
}
/**
* Get a limit definitions for this domain object.
@ -636,7 +577,7 @@ define([
* supported colors are purple, red, orange, yellow and cyan
* @memberof module:openmct.TelemetryAPI~TelemetryProvider#
*/
TelemetryAPI.prototype.getLimits = function (domainObject) {
getLimits(domainObject) {
const provider = this.findLimitEvaluator(domainObject);
if (!provider || !provider.getLimits) {
return {
@ -647,7 +588,104 @@ define([
}
return provider.getLimits(domainObject);
};
}
}
return TelemetryAPI;
});
/**
* A LimitEvaluator may be used to detect when telemetry values
* have exceeded nominal conditions.
*
* @interface LimitEvaluator
* @memberof module:openmct.TelemetryAPI~
*/
/**
* Check for any limit violations associated with a telemetry datum.
* @method evaluate
* @param {*} datum the telemetry datum to evaluate
* @param {TelemetryProperty} the property to check for limit violations
* @memberof module:openmct.TelemetryAPI~LimitEvaluator
* @returns {module:openmct.TelemetryAPI~LimitViolation} metadata about
* the limit violation, or undefined if a value is within limits
*/
/**
* A violation of limits defined for a telemetry property.
* @typedef LimitViolation
* @memberof {module:openmct.TelemetryAPI~}
* @property {string} cssClass the class (or space-separated classes) to
* apply to display elements for values which violate this limit
* @property {string} name the human-readable name for the limit violation
*/
/**
* A TelemetryFormatter converts telemetry values for purposes of
* display as text.
*
* @interface TelemetryFormatter
* @memberof module:openmct.TelemetryAPI~
*/
/**
* Retrieve the 'key' from the datum and format it accordingly to
* telemetry metadata in domain object.
*
* @method format
* @memberof module:openmct.TelemetryAPI~TelemetryFormatter#
*/
/**
* Describes a property which would be found in a datum of telemetry
* associated with a particular domain object.
*
* @typedef TelemetryProperty
* @memberof module:openmct.TelemetryAPI~
* @property {string} key the name of the property in the datum which
* contains this telemetry value
* @property {string} name the human-readable name for this property
* @property {string} [units] the units associated with this property
* @property {boolean} [temporal] true if this property is a timestamp, or
* may be otherwise used to order telemetry in a time-like
* fashion; default is false
* @property {boolean} [numeric] true if the values for this property
* can be interpreted plainly as numbers; default is true
* @property {boolean} [enumerated] true if this property may have only
* certain specific values; default is false
* @property {string} [values] for enumerated states, an ordered list
* of possible values
*/
/**
* Describes and bounds requests for telemetry data.
*
* @typedef TelemetryRequest
* @memberof module:openmct.TelemetryAPI~
* @property {string} sort the key of the property to sort by. This may
* be prefixed with a "+" or a "-" sign to sort in ascending
* or descending order respectively. If no prefix is present,
* ascending order will be used.
* @property {*} start the lower bound for values of the sorting property
* @property {*} end the upper bound for values of the sorting property
* @property {string[]} strategies symbolic identifiers for strategies
* (such as `minmax`) which may be recognized by providers;
* these will be tried in order until an appropriate provider
* is found
*/
/**
* Provides telemetry data. To connect to new data sources, new
* TelemetryProvider implementations should be
* [registered]{@link module:openmct.TelemetryAPI#addProvider}.
*
* @interface TelemetryProvider
* @memberof module:openmct.TelemetryAPI~
*/
/**
* An interface for retrieving telemetry data associated with a domain
* object.
*
* @interface TelemetryAPI
* @augments module:openmct.TelemetryAPI~TelemetryProvider
* @memberof module:openmct
*/

2
src/api/telemetry/TelemetryAPISpec.js
View File

@ -21,7 +21,7 @@
*****************************************************************************/
import { createOpenMct, resetApplicationState } from 'utils/testing';
import TelemetryAPI from './TelemetryAPI';
const { TelemetryCollection } = require("./TelemetryCollection");
import TelemetryCollection from './TelemetryCollection';
describe('Telemetry API', function () {
let openmct;

61
src/api/telemetry/TelemetryCollection.js
View File

@ -26,7 +26,7 @@ import { LOADED_ERROR, TIMESYSTEM_KEY_NOTIFICATION, TIMESYSTEM_KEY_WARNING } fro
/** Class representing a Telemetry Collection. */
export class TelemetryCollection extends EventEmitter {
export default class TelemetryCollection extends EventEmitter {
/**
* Creates a Telemetry Collection
*
@ -49,6 +49,7 @@ export class TelemetryCollection extends EventEmitter {
this.pageState = undefined;
this.lastBounds = undefined;
this.requestAbort = undefined;
this.isStrategyLatest = this.options.strategy === 'latest';
}
/**
@ -126,7 +127,8 @@ export class TelemetryCollection extends EventEmitter {
this.requestAbort = new AbortController();
options.signal = this.requestAbort.signal;
this.emit('requestStarted');
historicalData = await historicalProvider.request(this.domainObject, options);
const modifiedOptions = await this.openmct.telemetry.applyRequestInterceptors(this.domainObject, options);
historicalData = await historicalProvider.request(this.domainObject, modifiedOptions);
} catch (error) {
if (error.name !== 'AbortError') {
console.error('Error requesting telemetry data...');
@ -168,17 +170,18 @@ export class TelemetryCollection extends EventEmitter {
* @private
*/
_processNewTelemetry(telemetryData) {
performance.mark('tlm:process:start');
if (telemetryData === undefined) {
return;
}
let latestBoundedDatum = this.boundedTelemetry[this.boundedTelemetry.length - 1];
let data = Array.isArray(telemetryData) ? telemetryData : [telemetryData];
let parsedValue;
let beforeStartOfBounds;
let afterEndOfBounds;
let added = [];
// loop through, sort and dedupe
for (let datum of data) {
parsedValue = this.parseTime(datum);
beforeStartOfBounds = parsedValue < this.lastBounds.start;
@ -218,7 +221,17 @@ export class TelemetryCollection extends EventEmitter {
}
if (added.length) {
this.emit('add', added);
// if latest strategy is requested, we need to check if the value is the latest unmitted value
if (this.isStrategyLatest) {
this.boundedTelemetry = [this.boundedTelemetry[this.boundedTelemetry.length - 1]];
// if true, then this value has yet to be emitted
if (this.boundedTelemetry[0] !== latestBoundedDatum) {
this.emit('add', this.boundedTelemetry);
}
} else {
this.emit('add', added);
}
}
}
@ -278,13 +291,20 @@ export class TelemetryCollection extends EventEmitter {
if (startChanged) {
testDatum[this.timeKey] = bounds.start;
// Calculate the new index of the first item within the bounds
startIndex = _.sortedIndexBy(
this.boundedTelemetry,
testDatum,
datum => this.parseTime(datum)
);
discarded = this.boundedTelemetry.splice(0, startIndex);
// a little more complicated if not latest strategy
if (!this.isStrategyLatest) {
// Calculate the new index of the first item within the bounds
startIndex = _.sortedIndexBy(
this.boundedTelemetry,
testDatum,
datum => this.parseTime(datum)
);
discarded = this.boundedTelemetry.splice(0, startIndex);
} else if (this.parseTime(testDatum) > this.parseTime(this.boundedTelemetry[0])) {
discarded = this.boundedTelemetry;
this.boundedTelemetry = [];
}
}
if (endChanged) {
@ -296,7 +316,6 @@ export class TelemetryCollection extends EventEmitter {
datum => this.parseTime(datum)
);
added = this.futureBuffer.splice(0, endIndex);
this.boundedTelemetry = [...this.boundedTelemetry, ...added];
}
if (discarded.length > 0) {
@ -304,6 +323,13 @@ export class TelemetryCollection extends EventEmitter {
}
if (added.length > 0) {
if (!this.isStrategyLatest) {
this.boundedTelemetry = [...this.boundedTelemetry, ...added];
} else {
added = [added[added.length - 1]];
this.boundedTelemetry = added;
}
this.emit('add', added);
}
} else {
@ -322,7 +348,14 @@ export class TelemetryCollection extends EventEmitter {
* @private
*/
_setTimeSystem(timeSystem) {
let domains = this.metadata.valuesForHints(['domain']);
let domains = [];
let metadataValue = { format: timeSystem.key };
if (this.metadata) {
domains = this.metadata.valuesForHints(['domain']);
metadataValue = this.metadata.value(timeSystem.key) || { format: timeSystem.key };
}
let domain = domains.find((d) => d.key === timeSystem.key);
if (domain !== undefined) {
@ -335,7 +368,6 @@ export class TelemetryCollection extends EventEmitter {
this.openmct.notifications.alert(TIMESYSTEM_KEY_NOTIFICATION);
}
let metadataValue = this.metadata.value(timeSystem.key) || { format: timeSystem.key };
let valueFormatter = this.openmct.telemetry.getValueFormatter(metadataValue);
this.parseTime = (datum) => {
@ -356,7 +388,6 @@ export class TelemetryCollection extends EventEmitter {
* @todo handle subscriptions more granually
*/
_reset() {
performance.mark('tlm:reset');
this.boundedTelemetry = [];
this.futureBuffer = [];

68
src/api/telemetry/TelemetryRequestInterceptor.js Normal file
View File

@ -0,0 +1,68 @@
/*****************************************************************************
* 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.
*****************************************************************************/
export default class TelemetryRequestInterceptorRegistry {
/**
* A TelemetryRequestInterceptorRegistry maintains the definitions for different interceptors that may be invoked on telemetry
* requests.
* @interface TelemetryRequestInterceptorRegistry
* @memberof module:openmct
*/
constructor() {
this.interceptors = [];
}
/**
* @interface TelemetryRequestInterceptorDef
* @property {function} appliesTo function that determines if this interceptor should be called for the given identifier/request
* @property {function} invoke function that transforms the provided request and returns the transformed request
* @property {function} priority the priority for this interceptor. A higher number returned has more weight than a lower number
* @memberof module:openmct TelemetryRequestInterceptorRegistry#
*/
/**
* Register a new telemetry request interceptor.
*
* @param {module:openmct.RequestInterceptorDef} requestInterceptorDef the interceptor to add
* @method addInterceptor
* @memberof module:openmct.TelemetryRequestInterceptorRegistry#
*/
addInterceptor(interceptorDef) {
//TODO: sort by priority
this.interceptors.push(interceptorDef);
}
/**
* Retrieve all interceptors applicable to a domain object/request.
* @method getInterceptors
* @returns [module:openmct.RequestInterceptorDef] the registered interceptors for this identifier/request
* @memberof module:openmct.TelemetryRequestInterceptorRegistry#
*/
getInterceptors(identifier, request) {
return this.interceptors.filter(interceptor => {
return typeof interceptor.appliesTo === 'function'
&& interceptor.appliesTo(identifier, request);
});
}
}

2
src/api/user/StatusAPI.js
View File

@ -168,7 +168,7 @@ export default class StatusAPI extends EventEmitter {
*/
async resetStatusForRole(role) {
const provider = this.#userAPI.getProvider();
const defaultStatus = await this.getDefaultStatus();
const defaultStatus = await this.getDefaultStatusForRole(role);
if (provider.setStatusForRole) {
return provider.setStatusForRole(role, defaultStatus);

2
src/plugins/LADTable/components/LADRow.vue
View File

@ -197,7 +197,7 @@ export default {
}
},
setUnit() {
this.unit = this.valueMetadata.unit || '';
this.unit = this.valueMetadata ? this.valueMetadata.unit : '';
},
firstNonDomainAttribute(metadata) {
return metadata

9
src/plugins/LADTable/components/LadTableSet.vue
View File

@ -83,9 +83,12 @@ export default {
for (let ladTable of ladTables) {
for (let telemetryObject of ladTable) {
let metadata = this.openmct.telemetry.getMetadata(telemetryObject.domainObject);
for (let metadatum of metadata.valueMetadatas) {
if (metadatum.unit) {
return true;
if (metadata) {
for (let metadatum of metadata.valueMetadatas) {
if (metadatum.unit) {
return true;
}
}
}
}

50
src/plugins/charts/bar/BarGraphView.vue
View File

@ -178,6 +178,26 @@ export default {
this.requestDataFor(telemetryObject);
this.subscribeToObject(telemetryObject);
},
setTrace(key, name, axisMetadata, xValues, yValues) {
let trace = {
key,
name: name,
x: xValues,
y: yValues,
xAxisMetadata: {},
yAxisMetadata: axisMetadata.yAxisMetadata,
type: this.domainObject.configuration.useBar ? 'bar' : 'scatter',
mode: 'lines',
line: {
shape: this.domainObject.configuration.useInterpolation
},
marker: {
color: this.domainObject.configuration.barStyles.series[key].color
},
hoverinfo: this.domainObject.configuration.useBar ? 'skip' : 'x+y'
};
this.addTrace(trace, key);
},
addTrace(trace, key) {
if (!this.trace.length) {
this.trace = this.trace.concat([trace]);
@ -236,7 +256,15 @@ export default {
refreshData(bounds, isTick) {
if (!isTick) {
const telemetryObjects = Object.values(this.telemetryObjects);
telemetryObjects.forEach(this.requestDataFor);
telemetryObjects.forEach((telemetryObject) => {
//clear existing data
const key = this.openmct.objects.makeKeyString(telemetryObject.identifier);
const axisMetadata = this.getAxisMetadata(telemetryObject);
this.setTrace(key, telemetryObject.name, axisMetadata, [], []);
//request new data
this.requestDataFor(telemetryObject);
this.subscribeToObject(telemetryObject);
});
}
},
removeAllSubscriptions() {
@ -320,25 +348,7 @@ export default {
});
}
let trace = {
key,
name: telemetryObject.name,
x: xValues,
y: yValues,
xAxisMetadata: xAxisMetadata,
yAxisMetadata: axisMetadata.yAxisMetadata,
type: this.domainObject.configuration.useBar ? 'bar' : 'scatter',
mode: 'lines',
line: {
shape: this.domainObject.configuration.useInterpolation
},
marker: {
color: this.domainObject.configuration.barStyles.series[key].color
},
hoverinfo: this.domainObject.configuration.useBar ? 'skip' : 'x+y'
};
this.addTrace(trace, key);
this.setTrace(key, telemetryObject.name, axisMetadata, xValues, yValues);
},
isDataInTimeRange(datum, key, telemetryObject) {
const timeSystemKey = this.timeContext.timeSystem().key;

5
src/plugins/charts/bar/BarGraphViewProvider.js
View File

@ -66,12 +66,15 @@ export default function BarGraphViewProvider(openmct) {
}
};
},
template: '<bar-graph-view :options="options"></bar-graph-view>'
template: '<bar-graph-view ref="graphComponent" :options="options"></bar-graph-view>'
});
},
destroy: function () {
component.$destroy();
component = undefined;
},
onClearData() {
component.$refs.graphComponent.refreshData();
}
};
}

19
src/plugins/charts/bar/inspector/BarGraphOptions.vue
View File

@ -281,11 +281,11 @@ export default {
this.xKeyOptions.push(
metadataValues.reduce((previousValue, currentValue) => {
return {
name: `${previousValue.name}, ${currentValue.name}`,
name: previousValue?.name ? `${previousValue.name}, ${currentValue.name}` : `${currentValue.name}`,
value: currentValue.key,
isArrayValue: currentValue.isArrayValue
};
})
}, {name: ''})
);
}
@ -316,11 +316,16 @@ export default {
}
} else {
if (this.yKey === undefined) {
yKeyOptionIndex = this.yKeyOptions.findIndex((option, index) => index !== xKeyOptionIndex);
if (yKeyOptionIndex > -1) {
if (metadataValues.length && metadataArrayValues.length === 0) {
update = true;
this.yKey = this.yKeyOptions[yKeyOptionIndex].value;
this.yKeyLabel = this.yKeyOptions[yKeyOptionIndex].name;
this.yKey = 'none';
} else {
yKeyOptionIndex = this.yKeyOptions.findIndex((option, index) => index !== xKeyOptionIndex);
if (yKeyOptionIndex > -1) {
update = true;
this.yKey = this.yKeyOptions[yKeyOptionIndex].value;
this.yKeyLabel = this.yKeyOptions[yKeyOptionIndex].name;
}
}
}
}
@ -336,6 +341,8 @@ export default {
return option;
});
} else if (this.xKey !== undefined && this.domainObject.configuration.axes.yKey === undefined) {
this.domainObject.configuration.axes.yKey = 'none';
}
this.xKeyOptions = this.xKeyOptions.map((option, index) => {

4
src/plugins/charts/bar/plugin.js
View File

@ -28,9 +28,9 @@ export default function () {
return function install(openmct) {
openmct.types.addType(BAR_GRAPH_KEY, {
key: BAR_GRAPH_KEY,
name: "Graph (Bar or Line)",
name: "Graph",
cssClass: "icon-bar-chart",
description: "View data as a bar graph. Can be added to Display Layouts.",
description: "Visualize data as a bar or line graph.",
creatable: true,
initialize: function (domainObject) {
domainObject.composition = [];

33
src/plugins/charts/bar/pluginSpec.js
View File

@ -367,19 +367,26 @@ describe("the plugin", function () {
type: "test-object",
name: "Test Object",
telemetry: {
values: [{
key: "some-key",
name: "Some attribute",
hints: {
domain: 1
}
}, {
key: "some-other-key",
name: "Another attribute",
hints: {
range: 1
}
}]
values: [
{
key: "some-key",
source: "some-key",
name: "Some attribute",
format: "enum",
enumerations: [
{
value: 0,
string: "OFF"
},
{
value: 1,
string: "ON"
}
],
hints: {
range: 1
}
}]
}
};
const composition = openmct.composition.get(parent);

5
src/plugins/condition/ConditionManager.js
View File

@ -300,8 +300,11 @@ export default class ConditionManager extends EventEmitter {
return this.compositionLoad.then(() => {
let latestTimestamp;
let conditionResults = {};
let nextLegOptions = {...options};
delete nextLegOptions.onPartialResponse;
const conditionRequests = this.conditions
.map(condition => condition.requestLADConditionResult(options));
.map(condition => condition.requestLADConditionResult(nextLegOptions));
return Promise.all(conditionRequests)
.then((results) => {

4
src/plugins/conditionWidget/components/ConditionWidget.vue
View File

@ -136,8 +136,8 @@ export default {
this.url = url;
}
const conditionSetIdentifier = domainObject.configuration.objectStyles.conditionSetIdentifier;
if (this.conditionSetIdentifier !== conditionSetIdentifier) {
const conditionSetIdentifier = domainObject.configuration?.objectStyles?.conditionSetIdentifier;
if (conditionSetIdentifier && this.conditionSetIdentifier !== conditionSetIdentifier) {
this.conditionSetIdentifier = conditionSetIdentifier;
}

4
src/plugins/displayLayout/components/TelemetryView.vue
View File

@ -152,7 +152,7 @@ export default {
},
unit() {
let value = this.item.value;
let unit = this.metadata.value(value).unit;
let unit = this.metadata ? this.metadata.value(value).unit : '';
return unit;
},
@ -280,7 +280,7 @@ export default {
this.limitEvaluator = this.openmct.telemetry.limitEvaluator(this.domainObject);
this.formats = this.openmct.telemetry.getFormatMap(this.metadata);
const valueMetadata = this.metadata.value(this.item.value);
const valueMetadata = this.metadata ? this.metadata.value(this.item.value) : {};
this.customStringformatter = this.openmct.telemetry.customStringFormatter(valueMetadata, this.item.format);
this.telemetryCollection = this.openmct.telemetry.requestCollection(this.domainObject, {

81
src/plugins/exportAsJSONAction/ExportAsJSONAction.js
View File

@ -128,6 +128,30 @@ export default class ExportAsJSONAction {
return copyOfChild;
}
/**
* @private
* @param {object} child
* @param {object} parent
* @returns {object}
*/
_rewriteLinkForReference(child, parent) {
const childId = this._getId(child);
this.externalIdentifiers.push(childId);
const copyOfChild = JSON.parse(JSON.stringify(child));
copyOfChild.identifier.key = uuid();
const newIdString = this._getId(copyOfChild);
const parentId = this._getId(parent);
this.idMap[childId] = newIdString;
copyOfChild.location = null;
parent.configuration.objectStyles.conditionSetIdentifier = copyOfChild.identifier;
this.tree[newIdString] = copyOfChild;
this.tree[parentId].configuration.objectStyles.conditionSetIdentifier = copyOfChild.identifier;
return copyOfChild;
}
/**
* @private
*/
@ -159,23 +183,27 @@ export default class ExportAsJSONAction {
"rootId": this._getId(this.root)
};
}
/**
* @private
* @param {object} parent
*/
_write(parent) {
this.calls++;
//conditional object styles are not saved on the composition, so we need to check for them
let childObjectReferenceId = parent.configuration?.objectStyles?.conditionSetIdentifier;
const composition = this.openmct.composition.get(parent);
if (composition !== undefined) {
composition.load()
.then((children) => {
children.forEach((child, index) => {
// Only export if object is creatable
// Only export if object is creatable
if (this._isCreatableAndPersistable(child)) {
// Prevents infinite export of self-contained objs
// Prevents infinite export of self-contained objs
if (!Object.prototype.hasOwnProperty.call(this.tree, this._getId(child))) {
// If object is a link to something absent from
// tree, generate new id and treat as new object
// If object is a link to something absent from
// tree, generate new id and treat as new object
if (this._isLinkedObject(child, parent)) {
child = this._rewriteLink(child, parent);
} else {
@ -186,18 +214,41 @@ export default class ExportAsJSONAction {
}
}
});
this.calls--;
if (this.calls === 0) {
this._rewriteReferences();
this._saveAs(this._wrapTree());
}
this._decrementCallsAndSave();
});
} else {
this.calls--;
if (this.calls === 0) {
this._rewriteReferences();
this._saveAs(this._wrapTree());
}
} else if (!childObjectReferenceId) {
this._decrementCallsAndSave();
}
if (childObjectReferenceId) {
this.openmct.objects.get(childObjectReferenceId)
.then((child) => {
// Only export if object is creatable
if (this._isCreatableAndPersistable(child)) {
// Prevents infinite export of self-contained objs
if (!Object.prototype.hasOwnProperty.call(this.tree, this._getId(child))) {
// If object is a link to something absent from
// tree, generate new id and treat as new object
if (this._isLinkedObject(child, parent)) {
child = this._rewriteLinkForReference(child, parent);
} else {
this.tree[this._getId(child)] = child;
}
this._write(child);
}
}
this._decrementCallsAndSave();
});
}
}
_decrementCallsAndSave() {
this.calls--;
if (this.calls === 0) {
this._rewriteReferences();
this._saveAs(this._wrapTree());
}
}
}

53
src/plugins/exportAsJSONAction/ExportAsJSONActionSpec.js
View File

@ -322,4 +322,57 @@ describe('Export as JSON plugin', () => {
exportAsJSONAction.invoke([parent]);
});
it('ExportAsJSONAction exports object references from tree', (done) => {
const parent = {
composition: [],
configuration: {
objectStyles: {
conditionSetIdentifier: {
key: 'child',
namespace: ''
}
}
},
identifier: {
key: 'parent',
namespace: ''
},
name: 'Parent',
type: 'folder',
modified: 1503598129176,
location: 'mine',
persisted: 1503598129176
};
const child = {
composition: [],
identifier: {
key: 'child',
namespace: ''
},
name: 'Child',
type: 'folder',
modified: 1503598132428,
location: null,
persisted: 1503598132428
};
spyOn(openmct.objects, 'get').and.callFake(object => {
return Promise.resolve(child);
});
spyOn(exportAsJSONAction, '_saveAs').and.callFake(completedTree => {
expect(Object.keys(completedTree).length).toBe(2);
const conditionSetId = Object.keys(completedTree.openmct)[1];
expect(Object.prototype.hasOwnProperty.call(completedTree, 'openmct')).toBeTruthy();
expect(Object.prototype.hasOwnProperty.call(completedTree, 'rootId')).toBeTruthy();
expect(Object.prototype.hasOwnProperty.call(completedTree.openmct, 'parent')).toBeTruthy();
expect(completedTree.openmct[conditionSetId].name).toBe('Child');
done();
});
exportAsJSONAction.invoke([parent]);
});
});

18
src/plugins/faultManagement/FaultManagementListHeader.vue
View File

@ -21,23 +21,25 @@
*****************************************************************************/
<template>
<div class="c-fault-mgmt__list-header c-fault-mgmt__list">
<div class="c-fault-mgmt__checkbox">
<div class="c-fault-mgmt-item-header c-fault-mgmt__list-header c-fault-mgmt__list">
<div class="c-fault-mgmt-item-header c-fault-mgmt__checkbox">
<input
type="checkbox"
:checked="isSelectAll"
@input="selectAll"
>
</div>
<div class="c-fault-mgmt__list-content">
<div class="c-fault-mgmt__list-header-results"> {{ totalFaultsCount }} Results </div>
<div class="c-fault-mgmt-item-header c-fault-mgmt__list-header-results c-fault-mgmt__list-severity">
{{ totalFaultsCount }} Results
</div>
<div class="c-fault-mgmt__list-header-content">
<div class="c-fault-mgmt__list-content-right">
<div class="c-fault-mgmt__list-header-tripVal c-fault-mgmt__list-trigVal">Trip Value</div>
<div class="c-fault-mgmt__list-header-liveVal c-fault-mgmt__list-curVal">Live Value</div>
<div class="c-fault-mgmt__list-header-trigTime c-fault-mgmt__list-trigTime">Trigger Time</div>
<div class="c-fault-mgmt-item-header c-fault-mgmt__list-header-tripVal">Trip Value</div>
<div class="c-fault-mgmt-item-header c-fault-mgmt__list-header-liveVal">Live Value</div>
<div class="c-fault-mgmt-item-header c-fault-mgmt__list-header-trigTime">Trigger Time</div>
</div>
</div>
<div class="c-fault-mgmt__list-action-wrapper">
<div class=" c-fault-mgmt-item-header c-fault-mgmt__list-header-action-wrapper">
<div class="c-fault-mgmt__list-header-sortButton c-fault-mgmt__list-action-button">
<SelectField
class="c-fault-mgmt-viewButton"

96
src/plugins/faultManagement/FaultManagementListItem.vue
View File

@ -23,52 +23,55 @@
<template>
<div
class="c-fault-mgmt__list data-selectable"
:class="[
{'is-selected': isSelected},
{'is-unacknowledged': !fault.acknowledged},
{'is-shelved': fault.shelved}
]"
:class="classesFromState"
>
<div class="c-fault-mgmt__checkbox">
<div class="c-fault-mgmt-item c-fault-mgmt__list-checkbox">
<input
type="checkbox"
:checked="isSelected"
@input="toggleSelected"
>
</div>
<div
class="c-fault-mgmt__list-severity"
:title="fault.severity"
:class="[
'is-severity-' + severity
]"
>
<div class="c-fault-mgmt-item">
<div
class="c-fault-mgmt__list-severity"
:title="fault.severity"
:class="[
'is-severity-' + severity
]"
>
</div>
</div>
<div class="c-fault-mgmt__list-content">
<div class="c-fault-mgmt__list-pathname">
<div class="c-fault-mgmt-item c-fault-mgmt__list-content">
<div class="c-fault-mgmt-item c-fault-mgmt__list-pathname">
<div class="c-fault-mgmt__list-path">{{ fault.namespace }}</div>
<div class="c-fault-mgmt__list-faultname">{{ fault.name }}</div>
</div>
<div class="c-fault-mgmt__list-content-right">
<div
class="c-fault-mgmt__list-trigVal"
:class="tripValueClassname"
title="Trip Value"
>{{ fault.triggerValueInfo.value }}</div>
<div
class="c-fault-mgmt__list-curVal"
:class="liveValueClassname"
title="Live Value"
>
{{ fault.currentValueInfo.value }}
<div class="c-fault-mgmt-item c-fault-mgmt__list-trigVal">
<div
class="c-fault-mgmt-item__value"
:class="tripValueClassname"
title="Trip Value"
>{{ fault.triggerValueInfo.value }}</div>
</div>
<div
class="c-fault-mgmt__list-trigTime"
>{{ fault.triggerTime }}
<div class="c-fault-mgmt-item c-fault-mgmt__list-curVal">
<div
class="c-fault-mgmt-item__value"
:class="liveValueClassname"
title="Live Value"
>{{ fault.currentValueInfo.value }}</div>
</div>
<div class="c-fault-mgmt-item c-fault-mgmt__list-trigTime">
<div
class="c-fault-mgmt-item__value"
title="Last Trigger Time"
>{{ fault.triggerTime }}
</div>
</div>
</div>
</div>
<div class="c-fault-mgmt__list-action-wrapper">
<div class="c-fault-mgmt-item c-fault-mgmt__list-action-wrapper">
<button
class="c-fault-mgmt__list-action-button l-browse-bar__actions c-icon-button icon-3-dots"
title="Disposition Actions"
@ -77,7 +80,6 @@
</div>
</div>
</template>
<script>
const RANGE_CONDITION_CLASS = {
@ -106,6 +108,36 @@ export default {
}
},
computed: {
classesFromState() {
const exclusiveStates = [
{
className: 'is-shelved',
test: () => this.fault.shelved
},
{
className: 'is-unacknowledged',
test: () => !this.fault.acknowledged && !this.fault.shelved
},
{
className: 'is-acknowledged',
test: () => this.fault.acknowledged && !this.fault.shelved
}
];
const classes = [];
if (this.isSelected) {
classes.push('is-selected');
}
const matchingState = exclusiveStates.find(stateDefinition => stateDefinition.test());
if (matchingState !== undefined) {
classes.push(matchingState.className);
}
return classes;
},
liveValueClassname() {
const currentValueInfo = this.fault?.currentValueInfo;
if (!currentValueInfo || currentValueInfo.monitoringResult === 'IN_LIMITS') {
@ -149,7 +181,7 @@ export default {
const menuItems = [
{
cssClass: 'icon-bell',
cssClass: 'icon-check',
isDisabled: this.fault.acknowledged,
name: 'Acknowledge',
description: '',

70
src/plugins/faultManagement/FaultManagementListView.vue
View File

@ -35,25 +35,31 @@
@shelveSelected="toggleShelveSelected"
/>
<FaultManagementListHeader
class="header"
:selected-faults="Object.values(selectedFaults)"
:total-faults-count="filteredFaultsList.length"
@selectAll="selectAll"
@sortChanged="sortChanged"
/>
<div class="c-faults-list-view-header-item-container-wrapper">
<div class="c-faults-list-view-header-item-container">
<FaultManagementListHeader
class="header"
:selected-faults="Object.values(selectedFaults)"
:total-faults-count="filteredFaultsList.length"
@selectAll="selectAll"
@sortChanged="sortChanged"
/>
<template v-if="filteredFaultsList.length > 0">
<FaultManagementListItem
v-for="fault of filteredFaultsList"
:key="fault.id"
:fault="fault"
:is-selected="isSelected(fault)"
@toggleSelected="toggleSelected"
@acknowledgeSelected="toggleAcknowledgeSelected"
@shelveSelected="toggleShelveSelected"
/>
</template>
<div class="c-faults-list-view-item-body">
<template v-if="filteredFaultsList.length > 0">
<FaultManagementListItem
v-for="fault of filteredFaultsList"
:key="fault.id"
:fault="fault"
:is-selected="isSelected(fault)"
@toggleSelected="toggleSelected"
@acknowledgeSelected="toggleAcknowledgeSelected"
@shelveSelected="toggleShelveSelected"
/>
</template>
</div>
</div>
</div>
</div>
</template>
@ -90,17 +96,19 @@ export default {
computed: {
filteredFaultsList() {
const filterName = FILTER_ITEMS[this.filterIndex];
let list = this.faultsList.filter(fault => !fault.shelved);
let list = this.faultsList;
// Exclude shelved alarms from all views except the Shelved view
if (filterName !== 'Shelved') {
list = list.filter(fault => fault.shelved !== true);
}
if (filterName === 'Acknowledged') {
list = this.faultsList.filter(fault => fault.acknowledged);
}
if (filterName === 'Unacknowledged') {
list = this.faultsList.filter(fault => !fault.acknowledged);
}
if (filterName === 'Shelved') {
list = this.faultsList.filter(fault => fault.shelved);
list = list.filter(fault => fault.acknowledged);
} else if (filterName === 'Unacknowledged') {
list = list.filter(fault => !fault.acknowledged);
} else if (filterName === 'Shelved') {
list = list.filter(fault => fault.shelved);
}
if (this.searchTerm.length > 0) {
@ -195,7 +203,7 @@ export default {
{
key: 'comment',
control: 'textarea',
name: 'Comment',
name: 'Optional comment',
pattern: '\\S+',
required: false,
cssClass: 'l-input-lg',
@ -237,7 +245,7 @@ export default {
{
key: 'comment',
control: 'textarea',
name: 'Comment',
name: 'Optional comment',
pattern: '\\S+',
required: false,
cssClass: 'l-input-lg',
@ -246,7 +254,7 @@ export default {
{
key: 'shelveDuration',
control: 'select',
name: 'Shelve Duration',
name: 'Shelve duration',
options: FAULT_MANAGEMENT_SHELVE_DURATIONS_IN_MS,
required: false,
cssClass: 'l-input-lg',

2
src/plugins/faultManagement/FaultManagementPlugin.js
View File

@ -32,7 +32,7 @@ export default function FaultManagementPlugin() {
name: 'Fault Management',
creatable: false,
description: 'Fault Management View',
cssClass: 'icon-telemetry'
cssClass: 'icon-bell'
});
openmct.objectViews.addProvider(new FaultManagementViewProvider(openmct));

2
src/plugins/faultManagement/FaultManagementToolbar.vue
View File

@ -23,7 +23,7 @@
<template>
<div class="c-fault-mgmt__toolbar">
<button
class="c-icon-button icon-bell"
class="c-icon-button icon-check"
title="Acknowledge selected faults"
:disabled="disableAcknowledge"
@click="acknowledgeSelected"

9
src/plugins/faultManagement/FaultManagementView.vue
View File

@ -21,14 +21,13 @@
*****************************************************************************/
<template>
<div class="c-fault-mgmt">
<FaultManagementListView
:faults-list="faultsList"
/>
</div>
<FaultManagementListView
:faults-list="faultsList"
/>
</template>
<script>
import FaultManagementListView from './FaultManagementListView.vue';
import { FAULT_MANAGEMENT_ALARMS, FAULT_MANAGEMENT_GLOBAL_ALARMS } from './constants';

340
src/plugins/faultManagement/fault-manager.scss
View File

@ -19,216 +19,250 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*********************************************** FAULT PROPERTIES */
.is-severity-critical{
@include glyphBefore($glyph-icon-alert-triangle);
color: $colorStatusError;
}
.is-severity-warning{
@include glyphBefore($glyph-icon-alert-rect);
color: $colorStatusAlert;
}
.is-severity-watch{
@include glyphBefore($glyph-icon-info);
color: $colorCommand;
}
.is-unacknowledged{
.c-fault-mgmt__list-severity{
@include pulse($animName: severityAnim, $dur: 200ms);
}
}
.is-selected {
background: $colorSelectedBg;
}
.is-shelved{
.c-fault-mgmt__list-content{
opacity: 50% !important;
font-style: italic;
}
.c-fault-mgmt__list-severity{
@include pulse($animName: shelvedAnim, $dur: 0ms);
}
}
$colorFaultItemFg: $colorBodyFg;
$colorFaultItemFgEmphasis: $colorBodyFgEm;
$colorFaultItemBg: pullForward($colorBodyBg, 5%);
/*********************************************** SEARCH */
.c-fault-mgmt__search-row{
.c-fault-mgmt__search-row {
display: flex;
align-items: center;
flex: 0 0 auto;
> * + * {
margin-left: 10px;
float: right;
}
}
.c-fault-mgmt-search{
.c-fault-mgmt-search {
width: 95%;
}
/*********************************************** TOOLBAR */
.c-fault-mgmt__toolbar{
display: flex;
.c-fault-mgmt__toolbar {
display: flex;
justify-content: center;
> * {
font-size: 1.25em;
flex: 0 0 auto;
> * + * {
margin-left: $interiorMargin;
}
}
/*********************************************** LIST VIEW */
.c-faults-list-view {
.c-faults-list-view {
display: flex;
flex-direction: column;
height: 100%;
> * + * {
margin-top: $interiorMargin;
margin-top: $interiorMargin;
}
}
.c-faults-list-view-header-item-container {
display: grid;
width: 100%;
grid-template-columns: max-content max-content repeat(5,minmax(max-content, 20%)) max-content;
grid-row-gap: $interiorMargin;
/*********************************************** FAULT ITEM */
.c-fault-mgmt__list{
background: rgba($colorBodyFg, 0.1);
margin-bottom: 5px;
padding: 4px;
display: flex;
align-items: center;
> * {
margin-left: $interiorMargin;
&-wrapper {
flex: 1 1 auto;
padding-right: $interiorMargin; // Fend of from scrollbar
overflow-y: auto;
}
&-severity{
.--width-less-than-600 & {
grid-template-columns: max-content max-content 1fr 1fr max-content;
}
}
.c-faults-list-view-item-body {
display: contents;
}
/*********************************************** LIST */
.c-fault-mgmt__list {
display: contents;
color: $colorFaultItemFg;
&-checkbox{
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
&-severity {
font-size: 2em;
margin-left: $interiorMarginLg;
}
&-pathname{
flex-wrap: wrap;
flex: 1 1 auto;
}
&-path{
font-size: .75em;
}
&.is-severity-critical {
@include glyphBefore($glyph-icon-alert-triangle);
color: $colorStatusError;
}
&-faultname{
font-weight: bold;
font-size: 1.3em;
}
&.is-severity-warning {
@include glyphBefore($glyph-icon-alert-rect);
color: $colorStatusAlert;
}
&-content{
display: flex;
flex-wrap: wrap;
flex: 1 1 auto;
align-items: center;
}
&-content-right{
margin-left: auto;
display: flex;
flex-wrap: wrap;
}
&-trigVal, &-curVal, &-trigTime{
@include ellipsize;
border-radius: $controlCr;
padding: $interiorMargin;
width: 80px;
margin-right: $interiorMarginLg;
}
&-trigVal {
@include isLimit();
background: rgba($colorBodyFg, 0.25);
}
&-curVal {
@include isLimit();
background: rgba($colorBodyFg, 0.25);
&-alert{
background: $colorWarningHi;
&.is-severity-watch {
@include glyphBefore($glyph-icon-info);
color: $colorCommand;
}
}
&-trigTime{
width: auto;
&-content {
display: contents;
.--width-less-than-600 & {
display: flex;
flex-wrap: wrap;
grid-column: span 2;
}
}
&-action-wrapper{
display: flex;
align-content: right;
width: 100px;
&-pathname {
padding-right: $interiorMarginLg;
overflow-wrap: anywhere;
min-width: 100px;
}
&-path {
font-size: .85em;
margin-left: $interiorMargin;
}
&-action-button{
&-faultname{
font-size: 1.3em;
margin-left: $interiorMargin;
}
&-content-right {
display: contents;
}
&-trigTime {
grid-column: 6 / span 2;
}
&-action-wrapper {
text-align: right;
flex: 0 0 auto;
align-items: stretch;
}
&-action-button {
flex: 0 0 auto;
margin-left: auto;
justify-content: right;
text-align: right;
}
// STATES
&.is-unacknowledged {
color: $colorFaultItemFgEmphasis;
.c-fault-mgmt__list-severity {
@include pulse($animName: severityAnim, $dur: 200ms);
}
}
&.is-acknowledged,
&.is-shelved {
.c-fault-mgmt__list-severity {
&:before {
opacity: 60%;
//font-size: 1.5em;
}
&:after {
color: $colorFaultItemFgEmphasis;
display: block;
font-family: symbolsfont;
position: absolute;
//text-shadow: black 0 0 2px;
right: -3px;
bottom: -3px;
transform-origin: right bottom;
transform: scale(0.6);
}
}
}
&.is-shelved {
.c-fault-mgmt__list-pathname {
font-style: italic;
}
}
&.is-acknowledged .c-fault-mgmt__list-severity:after {
content: $glyph-icon-check;
}
&.is-shelved .c-fault-mgmt__list-severity:after {
content: $glyph-icon-timer;
}
}
/*********************************************** LIST HEADER */
.c-fault-mgmt__list-header{
display: flex;
background: rgba($colorBodyFg, .23);
.c-fault-mgmt__list-header {
display: contents;
border-radius: $controlCr;
align-items: center;
&-tripVal, &-liveVal, &-trigTime{
background: none;
* {
margin: 0px;
border-radius: 0px;
}
&-trigTime{
width: 160px;
}
&-sortButton{
flex: 0 0 auto;
margin-left: auto;
justify-content: right;
display: flex;
align-content: right;
width: 100px;
.--width-less-than-600 & {
.c-fault-mgmt__list-content-right {
display:none;
}
}
}
&-content {
display: contents;
}
.is-severity-critical{
@include glyphBefore($glyph-icon-alert-triangle);
color: $colorStatusError;
}
&-results {
grid-column: 2 / span 2;
font-size: 1em;
height: auto;
}
.is-severity-warning{
@include glyphBefore($glyph-icon-alert-rect);
color: $colorStatusAlert;
}
&-action-wrapper {
grid-column: 7 / span 2;
.is-severity-watch{
@include glyphBefore($glyph-icon-info);
color: $colorCommand;
}
.is-unacknowledged{
.c-fault-mgmt__list-severity{
@include pulse($animName: severityAnim, $dur: 200ms);
.--width-less-than-600 & {
grid-column: 4 / span 2;
}
}
}
.is-selected {
background: $colorSelectedBg;
}
/*********************************************** GRID ITEM */
.c-fault-mgmt-item {
$p: $interiorMargin;
padding: $p;
background: $colorFaultItemBg;
white-space: nowrap;
.is-shelved{
.c-fault-mgmt__list-content{
opacity: 60% !important;
font-style: italic;
&-header {
$c: $colorBodyBg;
background: $c;
border-bottom: 5px solid $c; // Creates illusion of "space" beneath header
min-height: 30px; // Needed to align cells
padding: $p;
position: sticky;
top: 0;
z-index: 2;
}
.c-fault-mgmt__list-severity{
@include pulse($animName: shelvedAnim, $dur: 0ms);
&__value {
@include isLimit();
background: rgba($colorBodyFg, 0.1);
padding: $p;
border-radius: $controlCr;
display: inline-flex;
}
.is-selected & {
background: $colorSelectedBg;
}
}

6
src/plugins/gauge/GaugePluginSpec.js
View File

@ -472,7 +472,7 @@ describe('Gauge plugin', () => {
it('renders major elements', () => {
const wrapperElement = gaugeHolder.querySelector('.js-gauge-wrapper');
const rangeElement = gaugeHolder.querySelector('.js-gauge-meter-range');
const valueElement = gaugeHolder.querySelector('.js-meter-current-value');
const valueElement = gaugeHolder.querySelector('.js-gauge-current-value');
const hasMajorElements = Boolean(wrapperElement && rangeElement && valueElement);
@ -485,7 +485,7 @@ describe('Gauge plugin', () => {
it('renders correct current value', (done) => {
function WatchUpdateValue() {
const textElement = gaugeHolder.querySelector('.js-meter-current-value');
const textElement = gaugeHolder.querySelector('.js-gauge-current-value');
expect(Number(textElement.textContent).toFixed(gaugeViewObject.configuration.gaugeController.precision)).toBe(randomValue.toFixed(gaugeViewObject.configuration.gaugeController.precision));
done();
}
@ -570,7 +570,7 @@ describe('Gauge plugin', () => {
it('renders major elements', () => {
const wrapperElement = gaugeHolder.querySelector('.js-gauge-wrapper');
const rangeElement = gaugeHolder.querySelector('.js-gauge-meter-range');
const valueElement = gaugeHolder.querySelector('.js-meter-current-value');
const valueElement = gaugeHolder.querySelector('.js-gauge-current-value');
const hasMajorElements = Boolean(wrapperElement && rangeElement && valueElement);

501
src/plugins/gauge/components/Gauge.vue
View File

@ -23,189 +23,218 @@
<div
class="c-gauge__wrapper js-gauge-wrapper"
:class="`c-gauge--${gaugeType}`"
:title="gaugeTitle"
>
<template v-if="typeDial">
<svg
width="0"
height="0"
class="c-dial__clip-paths"
class="c-gauge c-dial"
viewBox="0 0 10 10"
>
<defs>
<clipPath
id="gaugeBgMask"
clipPathUnits="objectBoundingBox"
>
<path d="M0.853553 0.853553C0.944036 0.763071 1 0.638071 1 0.5C1 0.223858 0.776142 0 0.5 0C0.223858 0 0 0.223858 0 0.5C0 0.638071 0.0559644 0.763071 0.146447 0.853553L0.285934 0.714066C0.23115 0.659281 0.197266 0.583598 0.197266 0.5C0.197266 0.332804 0.332804 0.197266 0.5 0.197266C0.667196 0.197266 0.802734 0.332804 0.802734 0.5C0.802734 0.583598 0.76885 0.659281 0.714066 0.714066L0.853553 0.853553Z" />
</clipPath>
<clipPath
id="gaugeValueMask"
clipPathUnits="objectBoundingBox"
>
<path d="M0.18926 0.81074C0.109735 0.731215 0.0605469 0.621351 0.0605469 0.5C0.0605469 0.257298 0.257298 0.0605469 0.5 0.0605469C0.742702 0.0605469 0.939453 0.257298 0.939453 0.5C0.939453 0.621351 0.890265 0.731215 0.81074 0.81074L0.714066 0.714066C0.76885 0.659281 0.802734 0.583599 0.802734 0.5C0.802734 0.332804 0.667196 0.197266 0.5 0.197266C0.332804 0.197266 0.197266 0.332804 0.197266 0.5C0.197266 0.583599 0.23115 0.659281 0.285934 0.714066L0.18926 0.81074Z" />
</clipPath>
</defs>
</svg>
<g class="c-dial__masks">
<mask id="gaugeValueMask">
<path
d="M1.8926 8.1074C1.09734 7.31215 0.605469 6.21352 0.605469 5C0.605469 2.57297 2.57297 0.605469 5 0.605469C7.42703 0.605469 9.39453 2.57297 9.39453 5C9.39453 6.21352 8.90266 7.31215 8.1074 8.1074L7.14066 7.14066C7.6885 6.59281 8.02734 5.83598 8.02734 5C8.02734 3.32804 6.67196 1.97266 5 1.97266C3.32804 1.97266 1.97266 3.32804 1.97266 5C1.97266 5.83598 2.3115 6.59281 2.85934 7.14066L1.8926 8.1074Z"
fill="white"
/>
</mask>
<mask id="gaugeBgMask">
<path
d="M8.53553 8.53553C9.44036 7.63071 10 6.38071 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 6.38071 0.559644 7.63071 1.46447 8.53553L2.85934 7.14066C2.3115 6.59281 1.97266 5.83598 1.97266 5C1.97266 3.32804 3.32804 1.97266 5 1.97266C6.67196 1.97266 8.02734 3.32804 8.02734 5C8.02734 5.83598 7.6885 6.59281 7.14066 7.14066L8.53553 8.53553Z"
fill="white"
/>
</mask>
</g>
<svg
class="c-dial__range c-gauge__range js-gauge-dial-range"
viewBox="0 0 512 512"
>
<text
v-if="displayMinMax"
font-size="35"
transform="translate(105 455) rotate(-45)"
>{{ rangeLow }}</text>
<text
v-if="displayMinMax"
font-size="35"
transform="translate(407 455) rotate(45)"
text-anchor="end"
>{{ rangeHigh }}</text>
</svg>
<svg
v-if="displayCurVal"
class="c-dial__current-value-text-wrapper"
viewBox="0 0 512 512"
>
<svg
class="c-dial__current-value-text-sizer"
:viewBox="curValViewBox"
<g
class="c-dial__graphics"
mask="url(#gaugeBgMask)"
>
<rect
class="c-dial__bg"
x="0"
y="0"
width="10"
height="10"
/>
<g
v-if="isDialLowLimit"
class="c-dial__limit-low"
:style="`transform: rotate(${dialLowLimitDeg}deg)`"
>
<rect
v-if="isDialLowLimitLow"
class="c-dial__low-limit__low"
x="5"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialLowLimitMid"
class="c-dial__low-limit__mid"
x="5"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialLowLimitHigh"
class="c-dial__low-limit__high"
x="0"
y="0"
width="5"
height="5"
/>
</g>
<g
v-if="isDialHighLimit"
class="c-dial__limit-high"
:style="`transform: rotate(${dialHighLimitDeg}deg)`"
>
<rect
v-if="isDialHighLimitLow"
class="c-dial__high-limit__low"
x="0"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialHighLimitMid"
class="c-dial__high-limit__mid"
x="0"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialHighLimitHigh"
class="c-dial__high-limit__high"
x="5"
y="0"
width="5"
height="5"
/>
</g>
</g>
<g
class="c-dial__graphics"
mask="url(#gaugeValueMask)"
>
<g
v-if="typeFilledDial"
class="c-dial__filled-value"
:style="`transform: rotate(${degValueFilledDial}deg)`"
>
<rect
v-if="isDialFilledValueLow"
class="c-dial__filled-value__low"
x="5"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialFilledValueMid"
class="c-dial__filled-value__mid"
x="5"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialFilledValueHigh"
class="c-dial__filled-value__high"
x="0"
y="0"
width="5"
height="5"
/>
</g>
<g
v-if="valueInBounds && typeNeedleDial"
class="c-dial__needle-value"
:style="`transform: rotate(${degValue}deg)`"
>
<path d="M4.90234 9.39453L5.09766 9.39453L5.30146 8.20874C6.93993 8.05674 8.22265 6.67817 8.22266 5C8.22266 3.22018 6.77982 1.77734 5 1.77734C3.22018 1.77734 1.77734 3.22018 1.77734 5C1.77734 6.67817 3.06007 8.05674 4.69854 8.20874L4.90234 9.39453Z" />
</g>
<path
id="dialTextPath"
class="c-dial__range-msg-path"
d="M8.3501 5.0001C8.3501 6.85025 6.85025 8.3501 5.0001 8.3501C3.14994 8.3501 1.6501 6.85025 1.6501 5.0001C1.6501 3.14994 3.14994 1.6501 5.0001 1.6501C6.85025 1.6501 8.3501 3.14994 8.3501 5.0001Z"
fill="none"
style="transform-origin: center; transform: rotate(182deg)"
/>
</g>
<g class="c-dial__text">
<text
v-if="displayUnits"
x="50%"
y="70%"
text-anchor="middle"
class="c-gauge__units"
font-size="8%"
>{{ units }}</text>
<g
v-if="displayMinMax"
class="c-dial__range-text js-gauge-dial-range"
:font-size="rangeFontSize"
>
<text
transform="translate(1.5 8.7) rotate(-45)"
dominant-baseline="hanging"
>{{ rangeLow }}</text>
<text
transform="translate(8.4 8.7) rotate(45)"
dominant-baseline="hanging"
text-anchor="end"
>{{ rangeHigh }}</text>
</g>
</g>
<svg
v-if="!valueInBounds && valueExpected"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
xml:space="preserve"
class="c-dial__value-oor-indicator"
x="45%"
y="80%"
width="1"
height="1"
><path
d="M448 0H64C28.7.1.1 28.7 0 64v384c.1 35.3 28.7 63.9 64 64h384c35.3-.1 63.9-28.7 64-64V64c-.1-35.3-28.7-63.9-64-64zM288 448h-64v-64h64v64zm10.9-192L280 352h-48l-18.9-96V64H299v192h-.1z"
/></svg>
<svg
class="c-gauge__current-value-text-wrapper"
:viewBox="curValViewBox"
preserveAspectRatio="xMidYMid meet"
>
<rect
class="svg-viewbox-debug"
x="0"
y="0"
width="100%"
height="100%"
/>
<text
class="c-dial__current-value-text js-dial-current-value"
font-size="3.5"
lengthAdjust="spacing"
text-anchor="middle"
style="transform: translate(50%, 70%)"
>{{ curVal }}</text>
dominant-baseline="middle"
x="50%"
y="50%"
>
<template v-if="displayCurVal">
<tspan>{{ curVal }}</tspan>
</template>
</text>
</svg>
<svg
class="c-gauge__units c-dial__units"
viewBox="0 0 50 100"
>
<text
class="c-dial__units-text"
lengthAdjust="spacing"
text-anchor="middle"
style="transform: translate(50%, 72%)"
>{{ units }}</text>
</svg>
</svg>
<svg
class="c-dial__bg"
viewBox="0 0 10 10"
>
<g
v-if="isDialLowLimit"
class="c-dial__limit-low"
:style="`transform: rotate(${dialLowLimitDeg}deg)`"
>
<rect
v-if="isDialLowLimitLow"
class="c-dial__low-limit__low"
x="5"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialLowLimitMid"
class="c-dial__low-limit__mid"
x="5"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialLowLimitHigh"
class="c-dial__low-limit__high"
x="0"
y="0"
width="5"
height="5"
/>
</g>
<g
v-if="isDialHighLimit"
class="c-dial__limit-high"
:style="`transform: rotate(${dialHighLimitDeg}deg)`"
>
<rect
v-if="isDialHighLimitLow"
class="c-dial__high-limit__low"
x="0"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialHighLimitMid"
class="c-dial__high-limit__mid"
x="0"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialHighLimitHigh"
class="c-dial__high-limit__high"
x="5"
y="0"
width="5"
height="5"
/>
</g>
</svg>
<svg
v-if="typeFilledDial"
class="c-dial__filled-value-wrapper"
viewBox="0 0 10 10"
>
<g
class="c-dial__filled-value"
:style="`transform: rotate(${degValueFilledDial}deg)`"
>
<rect
v-if="isDialFilledValueLow"
class="c-dial__filled-value__low"
x="5"
y="5"
width="5"
height="5"
/>
<rect
v-if="isDialFilledValueMid"
class="c-dial__filled-value__mid"
x="5"
y="0"
width="5"
height="5"
/>
<rect
v-if="isDialFilledValueHigh"
class="c-dial__filled-value__high"
x="0"
y="0"
width="5"
height="5"
/>
</g>
</svg>
<svg
v-if="valueInBounds && typeNeedleDial"
class="c-dial__needle-value-wrapper"
viewBox="0 0 10 10"
>
<g
class="c-dial__needle-value"
:style="`transform: rotate(${degValue}deg)`"
>
<path d="M4.90234 9.39453L5.09766 9.39453L5.30146 8.20874C6.93993 8.05674 8.22265 6.67817 8.22266 5C8.22266 3.22018 6.77982 1.77734 5 1.77734C3.22018 1.77734 1.77734 3.22018 1.77734 5C1.77734 6.67817 3.06007 8.05674 4.69854 8.20874L4.90234 9.39453Z" />
</g>
</svg>
</template>
@ -219,9 +248,22 @@
<div class="c-meter__range__low">{{ rangeLow }}</div>
</div>
<div class="c-meter__bg">
<div
v-if="!valueInBounds && valueExpected"
class="c-meter__value-oor-indicator"
><svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
:preserveAspectRatio="meterOutOfRangeIndicatorAspectRatio"
><path
d="M448 0H64C28.7.1.1 28.7 0 64v384c.1 35.3 28.7 63.9 64 64h384c35.3-.1 63.9-28.7 64-64V64c-.1-35.3-28.7-63.9-64-64zM288 448h-64v-64h64v64zm10.9-192L280 352h-48l-18.9-96V64H299v192h-.1z"
/></svg></div>
<template v-if="typeMeterVertical">
<div
v-if="valueExpected"
class="c-meter__value"
:class="{'c-meter__value-needle' : typeNeedleMeter }"
:style="`transform: translateY(${meterValueToPerc}%)`"
></div>
@ -240,7 +282,9 @@
<template v-if="typeMeterHorizontal">
<div
v-if="valueExpected"
class="c-meter__value"
:class="{'c-meter__value-needle' : typeNeedleMeter }"
:style="`transform: translateX(${meterValueToPerc * -1}%)`"
></div>
@ -258,38 +302,42 @@
</template>
<svg
class="c-meter__current-value-text-wrapper"
viewBox="0 0 512 512"
class="c-gauge__current-value-text-wrapper"
:viewBox="curValViewBox"
preserveAspectRatio="xMidYMid meet"
>
<svg
v-if="displayCurVal"
class="c-meter__current-value-text-sizer"
:viewBox="curValViewBox"
preserveAspectRatio="xMidYMid meet"
<rect
class="svg-viewbox-debug"
x="0"
y="0"
width="100%"
height="100%"
/>
<text
class="c-meter__current-value-text js-gauge-current-value"
font-size="4"
lengthAdjust="spacing"
text-anchor="middle"
:dominant-baseline="meterTextBaseline"
x="50%"
y="50%"
>
<text
class="c-dial__current-value-text js-meter-current-value"
lengthAdjust="spacing"
text-anchor="middle"
style="transform: translate(50%, 70%)"
>
<template v-if="displayCurVal">
<tspan>{{ curVal }}</tspan>
<tspan
v-if="typeMeterHorizontal && displayUnits"
class="c-gauge__units"
font-size="10"
font-size="80%"
>{{ units }}</tspan>
</text>
<text
v-if="typeMeterVertical && displayUnits"
dy="12"
class="c-gauge__units"
font-size="10"
lengthAdjust="spacing"
text-anchor="middle"
style="transform: translate(50%, 70%)"
>{{ units }}</text>
</svg>
<tspan
v-if="typeMeterVertical && displayUnits"
x="50%"
dy="3.5"
class="c-gauge__units"
font-size="80%"
>{{ units }}</tspan>
</template>
</text>
</svg>
</div>
</div>
@ -343,14 +391,28 @@ export default {
dialLowLimitDeg() {
return this.percentToDegrees(this.valToPercent(this.limitLow));
},
meterOutOfRangeIndicatorAspectRatio() {
return this.typeMeterVertical ? 'xMidYMax meet' : 'xMinYMid meet';
},
meterTextBaseline() {
return this.typeMeterVertical ? 'auto' : 'middle';
},
curValViewBox() {
const DIGITS_RATIO = 10;
const VIEWBOX_STR = '0 0 X 15';
const DIGITS_RATIO = 3;
const VIEWBOX_STR = '0 0 X 10';
return VIEWBOX_STR.replace('X', this.digits * DIGITS_RATIO);
},
rangeFontSize() {
const CHAR_THRESHOLD = 3;
const START_PERC = 8.5;
const REDUCE_PERC = 0.8;
const RANGE_CHARS_MAX = Math.max(this.rangeLow.toString().length, this.rangeHigh.toString().length);
return this.fontSizeFromChars(RANGE_CHARS_MAX, CHAR_THRESHOLD, START_PERC, REDUCE_PERC);
},
isDialLowLimit() {
return this.limitLow.length > 0 && this.dialLowLimitDeg < getLimitDegree('low', 'max');
return this.limitLow.toString().length > 0 && this.dialLowLimitDeg < getLimitDegree('low', 'max');
},
isDialLowLimitLow() {
return this.dialLowLimitDeg >= getLimitDegree('low', 'q1');
@ -362,7 +424,7 @@ export default {
return this.dialLowLimitDeg >= getLimitDegree('low', 'q3');
},
isDialHighLimit() {
return this.limitHigh.length > 0 && this.dialHighLimitDeg < getLimitDegree('high', 'max');
return this.limitHigh.toString().length > 0 && this.dialHighLimitDeg < getLimitDegree('high', 'max');
},
isDialHighLimitLow() {
return this.dialHighLimitDeg <= getLimitDegree('high', 'max');
@ -383,10 +445,13 @@ export default {
return this.degValue >= getLimitDegree('low', 'q3');
},
isMeterLimitHigh() {
return this.limitHigh.length > 0 && this.meterHighLimitPerc > 0;
return this.limitHigh.toString().length > 0 && this.meterHighLimitPerc > 0;
},
isMeterLimitLow() {
return this.limitLow.length > 0 && this.meterLowLimitPerc > 0;
return this.limitLow.toString().length > 0 && this.meterLowLimitPerc > 0;
},
gaugeTitle() {
return this.valueInBounds ? 'Gauge' : 'Value is currently out of range and cannot be graphically displayed';
},
typeDial() {
return this.matchGaugeType('dial');
@ -409,15 +474,25 @@ export default {
typeMeterInverted() {
return this.matchGaugeType('inverted');
},
typeFilledMeter() {
return true; // Stubbing in for future capability
},
typeNeedleMeter() {
return false; // Stubbing in for future capability
},
meterValueToPerc() {
const meterDirection = (this.typeMeterInverted) ? -1 : 1;
if (this.curVal <= this.rangeLow) {
return meterDirection * 100;
}
if (this.typeFilledMeter) {
// Filled meter is a filled rectangle that is transformed along a vertical or horizontal axis
// So never move it below the low range more than 100%, or above the high range more than 0%
if (this.curVal <= this.rangeLow) {
return meterDirection * 100;
}
if (this.curVal >= this.rangeHigh) {
return 0;
if (this.curVal >= this.rangeHigh) {
return 0;
}
}
return this.valToPercentMeter(this.curVal) * meterDirection;
@ -428,6 +503,13 @@ export default {
meterLowLimitPerc() {
return 100 - this.valToPercentMeter(this.limitLow);
},
valueExpected() {
if (this.curVal === undefined || Object.is(this.curVal, 'null')) {
return false;
}
return this.curVal.toString().indexOf(DEFAULT_CURRENT_VALUE) === -1;
},
valueInBounds() {
return (this.curVal >= this.rangeLow && this.curVal <= this.rangeHigh);
},
@ -504,6 +586,11 @@ export default {
]
});
},
fontSizeFromChars(charNum, charThreshold, startPerc, reducePerc) {
const fs = (charNum <= charThreshold) ? startPerc : (startPerc - ((charNum - charThreshold) * reducePerc));
return fs.toString() + "%";
},
matchGaugeType(str) {
return this.gaugeType.indexOf(str) !== -1;
},

24
src/plugins/gauge/components/GaugeFormController.vue
View File

@ -40,7 +40,7 @@
<div class="c-form__row">
<span class="req-indicator req">
</span>
<label>Range minimum value</label>
<label>Minimum value</label>
<input
ref="min"
v-model.number="min"
@ -53,7 +53,7 @@
<div class="c-form__row">
<span class="req-indicator">
</span>
<label>Range low limit</label>
<label>Low limit</label>
<input
ref="limitLow"
v-model.number="limitLow"
@ -64,26 +64,26 @@
</div>
<div class="c-form__row">
<span class="req-indicator req">
<span class="req-indicator">
</span>
<label>Range maximum value</label>
<label>High limit</label>
<input
ref="max"
v-model.number="max"
data-field-name="max"
ref="limitHigh"
v-model.number="limitHigh"
data-field-name="limitHigh"
type="number"
@input="onChange"
>
</div>
<div class="c-form__row">
<span class="req-indicator">
<span class="req-indicator req">
</span>
<label>Range high limit</label>
<label>Maximum value</label>
<input
ref="limitHigh"
v-model.number="limitHigh"
data-field-name="limitHigh"
ref="max"
v-model.number="max"
data-field-name="max"
type="number"
@input="onChange"
>

163
src/plugins/gauge/gauge.scss
View File

@ -1,3 +1,8 @@
$meterNeedlePerc: 1%;
$meterNeedleMinPx: 4px;
$meterNeedleMaxPx: 20px;
$meterNeedleBorderRadius: 5px;
.is-object-type-gauge {
overflow: hidden;
}
@ -28,63 +33,64 @@
@include abs();
overflow: hidden;
}
&__current-value-text-wrapper {
// SVG
position: absolute;
height: 100%;
width: 100%;
}
}
.c-dial__value-oor-indicator,
.c-meter__value-oor-indicator {
fill: $colorGaugeRange;
opacity: 0.5;
}
/********************************************** DIAL GAUGE */
svg[class*='c-dial'] {
.c-dial {
max-height: 100%;
max-width: 100%;
position: absolute;
g {
transform-origin: center;
}
}
.c-dial {
&__bg {
background: $colorGaugeBg;
clip-path: url(#gaugeBgMask);
fill: $colorGaugeBg;
}
&__limit-high rect { fill: $colorGaugeLimitHigh; }
&__limit-low rect { fill: $colorGaugeLimitLow; }
&__filled-value-wrapper {
clip-path: url(#gaugeValueMask);
&__limit-high rect {
fill: $colorGaugeLimitHigh;
}
&__needle-value-wrapper {
clip-path: url(#gaugeValueMask);
&__limit-low rect {
fill: $colorGaugeLimitLow;
}
&__filled-value,
&__range-msg-text {
fill: $colorGaugeValue;
}
&__filled-value { fill: $colorGaugeValue; }
&__needle-value {
fill: $colorGaugeValue;
transition: transform $transitionTimeGauge;
}
&__current-value-text,
&__units-text {
&__current-value-text {
fill: $colorGaugeTextValue;
font-family: $heroFont;
}
&__units-text,
&__range-text {
fill: $colorGaugeRange;
}
&__graphics g {
transform-origin: center;
}
}
/********************************************** METER GAUGE */
.c-meter {
// Common styles for c-meter
$meterOutOfRangeIndicatorMaxSize: 50%;
@include abs();
display: flex;
svg {
// current-value-text
position: absolute;
height: 100%;
width: 100%;
}
&__range {
display: flex;
flex: 0 0 auto;
@ -102,10 +108,42 @@ svg[class*='c-dial'] {
// Filled area
position: absolute;
background: $colorGaugeValue;
transition: transform $transitionTimeGauge;
z-index: 1;
}
&__value-needle {
background: none !important;
&:before {
@include abs();
content: '';
display: block;
background: $colorGaugeValue;
}
}
&__value-oor-indicator {
$mxPx: 50px;
$wh: 50%;
position: absolute;
height: $wh;
width: $wh;
max-height: $mxPx;
max-width: $mxPx;
svg {
position: absolute;
width: 100%;
height: 100%;
max-height: 100%;
max-width: 100%;
}
}
&__current-value-text {
fill: $colorGaugeTextValue;
font-family: $heroFont;
}
.c-gauge__curval {
fill: $colorGaugeMeterTextValue !important;
}
@ -142,10 +180,28 @@ svg[class*='c-dial'] {
bottom: 0;
}
&__value-needle {
right: 0;
&:before {
border-bottom-left-radius: $meterNeedleBorderRadius;
border-top-left-radius: $meterNeedleBorderRadius;
height: $meterNeedlePerc;
min-height: $meterNeedleMinPx;
max-height: $meterNeedleMaxPx;
}
}
[class*='limit'] {
left: 0;
right: 0;
}
.c-meter__value-oor-indicator {
bottom: 10%;
left: 50%;
transform: translateX(-50%);
}
}
.c-gauge--meter-vertical & {
@ -156,6 +212,13 @@ svg[class*='c-dial'] {
&__limit-high {
top: 0;
}
&__value-needle {
&:before {
bottom: auto;
transform: translateY(-50%);
}
}
}
.c-gauge--meter-vertical-inverted & {
@ -174,6 +237,13 @@ svg[class*='c-dial'] {
&__range__high {
order: 2;
}
&__value-needle {
&:before {
top: auto;
transform: translateY(50%);
}
}
}
.c-gauge--meter-horizontal & {
@ -207,6 +277,20 @@ svg[class*='c-dial'] {
right: 0;
}
&__value-needle {
top: 0;
&:before {
border-bottom-left-radius: $meterNeedleBorderRadius;
border-bottom-right-radius: $meterNeedleBorderRadius;
left: auto;
width: $meterNeedlePerc;
min-width: $meterNeedleMinPx;
max-width: $meterNeedleMaxPx;
transform: translateX(50%);
}
}
[class*='limit'] {
top: 0;
bottom: 0;
@ -219,5 +303,16 @@ svg[class*='c-dial'] {
&__limit-high {
right: 0;
}
.c-meter__value-oor-indicator {
// Horizontal meter
left: 2%;
top: 50%;
transform: translateY(-50%);
}
}
}
.svg-viewbox-debug {
fill: rgba(deeppink, 0.5);
display: none;
}

11
src/plugins/imagery/components/imagery-view.scss
View File

@ -210,9 +210,10 @@
border-radius: $controlCr;
display: flex;
align-items: flex-start;
flex-direction: row;
justify-content: space-between;
padding: $interiorMargin;
width: min-content;
width: max-content;
> * + * {
margin-left: $interiorMargin;
@ -338,7 +339,6 @@
&__input {
display: flex;
align-items: center;
width: 100%;
&:before {
color: rgba($colorMenuFg, 0.5);
@ -353,13 +353,16 @@
&--filters {
// Styles specific to the brightness and contrast controls
.c-image-controls {
&__controls {
width: 80px; // About the minimum this element can be; cannot size based on % due to markup structure
}
&__sliders {
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-width: 80px;
width: 100%;
> * + * {
margin-top: 11px;

98
src/plugins/imagery/mixins/imageryData.js
View File

@ -30,7 +30,7 @@ export default {
this.timeSystemChange = this.timeSystemChange.bind(this);
this.setDataTimeContext = this.setDataTimeContext.bind(this);
this.setDataTimeContext();
this.openmct.objectViews.on('clearData', this.clearData);
this.openmct.objectViews.on('clearData', this.dataCleared);
// set
this.keyString = this.openmct.objects.makeKeyString(this.domainObject.identifier);
@ -44,8 +44,11 @@ export default {
this.timeKey = this.timeSystem.key;
this.timeFormatter = this.getFormatter(this.timeKey);
// kickoff
this.subscribe();
this.telemetryCollection = this.openmct.telemetry.requestCollection(this.domainObject, {});
this.telemetryCollection.on('add', this.dataAdded);
this.telemetryCollection.on('remove', this.dataRemoved);
this.telemetryCollection.on('clear', this.dataCleared);
this.telemetryCollection.load();
},
beforeDestroy() {
if (this.unsubscribe) {
@ -54,9 +57,34 @@ export default {
}
this.stopFollowingDataTimeContext();
this.openmct.objectViews.off('clearData', this.clearData);
this.openmct.objectViews.off('clearData', this.dataCleared);
this.telemetryCollection.off('add', this.dataAdded);
this.telemetryCollection.off('remove', this.dataRemoved);
this.telemetryCollection.off('clear', this.dataCleared);
this.telemetryCollection.destroy();
},
methods: {
dataAdded(dataToAdd) {
const normalizedDataToAdd = dataToAdd.map(datum => this.normalizeDatum(datum));
this.imageHistory = this.imageHistory.concat(normalizedDataToAdd);
},
dataCleared() {
this.imageHistory = [];
},
dataRemoved(dataToRemove) {
this.imageHistory = this.imageHistory.filter(existingDatum => {
const shouldKeep = dataToRemove.some(datumToRemove => {
const existingDatumTimestamp = this.parseTime(existingDatum);
const datumToRemoveTimestamp = this.parseTime(datumToRemove);
return (existingDatumTimestamp !== datumToRemoveTimestamp);
});
return shouldKeep;
});
},
setDataTimeContext() {
this.stopFollowingDataTimeContext();
this.timeContext = this.openmct.time.getContextForView(this.objectPath);
@ -70,19 +98,6 @@ export default {
this.timeContext.off('timeSystem', this.timeSystemChange);
}
},
isDatumValid(datum) {
//TODO: Add a check to see if there are duplicate images (identical image timestamp and url subsequently)
if (!datum) {
return false;
}
const datumTimeCheck = this.parseTime(datum);
const bounds = this.timeContext.bounds();
const isOutOfBounds = datumTimeCheck < bounds.start || datumTimeCheck > bounds.end;
return !isOutOfBounds;
},
formatImageUrl(datum) {
if (!datum) {
return;
@ -124,40 +139,6 @@ export default {
// forcibly reset the imageContainer size to prevent an aspect ratio distortion
delete this.imageContainerWidth;
delete this.imageContainerHeight;
return this.requestHistory();
},
async requestHistory() {
this.requestCount++;
const requestId = this.requestCount;
const bounds = this.timeContext.bounds();
const data = await this.openmct.telemetry
.request(this.domainObject, bounds) || [];
// wait until new request resolves to do comparison
if (this.requestCount !== requestId) {
return this.imageHistory = [];
}
const imagery = data.filter(this.isDatumValid).map(this.normalizeDatum);
this.imageHistory = imagery;
},
clearData(domainObjectToClear) {
// global clearData button is accepted therefore no truthy check on inputted param
const clearDataForObjectSelected = Boolean(domainObjectToClear);
if (clearDataForObjectSelected) {
const idsEqual = this.openmct.objects.areIdsEqual(
domainObjectToClear.identifier,
this.domainObject.identifier
);
if (!idsEqual) {
return;
}
}
// splice array to encourage garbage collection
this.imageHistory.splice(0, this.imageHistory.length);
},
timeSystemChange() {
this.timeSystem = this.timeContext.timeSystem();
@ -165,22 +146,7 @@ export default {
this.timeFormatter = this.getFormatter(this.timeKey);
this.durationFormatter = this.getFormatter(this.timeSystem.durationFormat || DEFAULT_DURATION_FORMATTER);
},
subscribe() {
this.unsubscribe = this.openmct.telemetry
.subscribe(this.domainObject, (datum) => {
let parsedTimestamp = this.parseTime(datum);
let bounds = this.timeContext.bounds();
if (!(parsedTimestamp >= bounds.start && parsedTimestamp <= bounds.end)) {
return;
}
if (this.isDatumValid(datum)) {
this.imageHistory.push(this.normalizeDatum(datum));
}
});
},
normalizeDatum(datum) {
const formattedTime = this.formatTime(datum);
const url = this.formatImageUrl(datum);
const time = this.parseTime(formattedTime);

249
src/plugins/imagery/pluginSpec.js
View File

@ -88,6 +88,7 @@ describe("The Imagery View Layouts", () => {
let openmct;
let parent;
let child;
let historicalProvider;
let imageTelemetry = generateTelemetry(START - TEN_MINUTES, COUNT);
let imageryObject = {
identifier: {
@ -122,50 +123,6 @@ describe("The Imagery View Layouts", () => {
"priority": 3
},
"source": "url"
// "relatedTelemetry": {
// "heading": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "heading",
// "valueKey": "value"
// }
// },
// "roll": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "roll",
// "valueKey": "value"
// }
// },
// "pitch": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "pitch",
// "valueKey": "value"
// }
// },
// "cameraPan": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "cameraPan",
// "valueKey": "value"
// }
// },
// "cameraTilt": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "cameraTilt",
// "valueKey": "value"
// }
// },
// "sunOrientation": {
// "comparisonFunction": comparisonFunction,
// "historical": {
// "telemetryObjectId": "sunOrientation",
// "valueKey": "value"
// }
// }
// }
},
{
"name": "Name",
@ -209,6 +166,13 @@ describe("The Imagery View Layouts", () => {
telemetryPromiseResolve = resolve;
});
historicalProvider = {
request: () => {
return Promise.resolve(imageTelemetry);
}
};
spyOn(openmct.telemetry, 'findRequestProvider').and.returnValue(historicalProvider);
spyOn(openmct.telemetry, 'request').and.callFake(() => {
telemetryPromiseResolve(imageTelemetry);
@ -409,39 +373,30 @@ describe("The Imagery View Layouts", () => {
return Vue.nextTick();
});
it("on mount should show the the most recent image", () => {
it("on mount should show the the most recent image", async () => {
//Looks like we need Vue.nextTick here so that computed properties settle down
return Vue.nextTick(() => {
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 1].timeId)).not.toEqual(-1);
});
await Vue.nextTick();
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 1].timeId)).not.toEqual(-1);
});
it("on mount should show the any image layers", (done) => {
it("on mount should show the any image layers", async () => {
//Looks like we need Vue.nextTick here so that computed properties settle down
Vue.nextTick().then(() => {
Vue.nextTick(() => {
const layerEls = parent.querySelectorAll('.js-layer-image');
console.log(layerEls);
expect(layerEls.length).toEqual(1);
done();
});
});
await Vue.nextTick();
const layerEls = parent.querySelectorAll('.js-layer-image');
console.log(layerEls);
expect(layerEls.length).toEqual(1);
});
it("should show the clicked thumbnail as the main image", (done) => {
it("should show the clicked thumbnail as the main image", async () => {
//Looks like we need Vue.nextTick here so that computed properties settle down
Vue.nextTick(() => {
const target = imageTelemetry[5].url;
parent.querySelectorAll(`img[src='${target}']`)[0].click();
Vue.nextTick(() => {
const imageInfo = getImageInfo(parent);
await Vue.nextTick();
const target = imageTelemetry[5].url;
parent.querySelectorAll(`img[src='${target}']`)[0].click();
await Vue.nextTick();
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[5].timeId)).not.toEqual(-1);
done();
});
});
expect(imageInfo.url.indexOf(imageTelemetry[5].timeId)).not.toEqual(-1);
});
xit("should show that an image is new", (done) => {
@ -460,71 +415,60 @@ describe("The Imagery View Layouts", () => {
});
});
it("should show that an image is not new", (done) => {
Vue.nextTick(() => {
const target = imageTelemetry[4].url;
parent.querySelectorAll(`img[src='${target}']`)[0].click();
it("should show that an image is not new", async () => {
await Vue.nextTick();
const target = imageTelemetry[4].url;
parent.querySelectorAll(`img[src='${target}']`)[0].click();
Vue.nextTick(() => {
const imageIsNew = isNew(parent);
await Vue.nextTick();
const imageIsNew = isNew(parent);
expect(imageIsNew).toBeFalse();
done();
});
});
expect(imageIsNew).toBeFalse();
});
it("should navigate via arrow keys", (done) => {
Vue.nextTick(() => {
let keyOpts = {
element: parent.querySelector('.c-imagery'),
key: 'ArrowLeft',
keyCode: 37,
type: 'keyup'
};
it("should navigate via arrow keys", async () => {
await Vue.nextTick();
const keyOpts = {
element: parent.querySelector('.c-imagery'),
key: 'ArrowLeft',
keyCode: 37,
type: 'keyup'
};
simulateKeyEvent(keyOpts);
simulateKeyEvent(keyOpts);
Vue.nextTick(() => {
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 2].timeId)).not.toEqual(-1);
done();
});
});
await Vue.nextTick();
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 2].timeId)).not.toEqual(-1);
});
it("should navigate via numerous arrow keys", (done) => {
Vue.nextTick(() => {
let element = parent.querySelector('.c-imagery');
let type = 'keyup';
let leftKeyOpts = {
element,
type,
key: 'ArrowLeft',
keyCode: 37
};
let rightKeyOpts = {
element,
type,
key: 'ArrowRight',
keyCode: 39
};
it("should navigate via numerous arrow keys", async () => {
await Vue.nextTick();
const element = parent.querySelector('.c-imagery');
const type = 'keyup';
const leftKeyOpts = {
element,
type,
key: 'ArrowLeft',
keyCode: 37
};
const rightKeyOpts = {
element,
type,
key: 'ArrowRight',
keyCode: 39
};
// left thrice
simulateKeyEvent(leftKeyOpts);
simulateKeyEvent(leftKeyOpts);
simulateKeyEvent(leftKeyOpts);
// right once
simulateKeyEvent(rightKeyOpts);
// left thrice
simulateKeyEvent(leftKeyOpts);
simulateKeyEvent(leftKeyOpts);
simulateKeyEvent(leftKeyOpts);
// right once
simulateKeyEvent(rightKeyOpts);
Vue.nextTick(() => {
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 3].timeId)).not.toEqual(-1);
done();
});
});
await Vue.nextTick();
const imageInfo = getImageInfo(parent);
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 3].timeId)).not.toEqual(-1);
});
it ('shows an auto scroll button when scroll to left', (done) => {
Vue.nextTick(() => {
@ -626,6 +570,20 @@ describe("The Imagery View Layouts", () => {
end: START + (5 * ONE_MINUTE)
});
const mockClock = jasmine.createSpyObj("clock", [
"on",
"off",
"currentValue"
]);
mockClock.key = 'mockClock';
mockClock.currentValue.and.returnValue(1);
openmct.time.addClock(mockClock);
openmct.time.clock('mockClock', {
start: START - (5 * ONE_MINUTE),
end: START + (5 * ONE_MINUTE)
});
openmct.router.path = [{
identifier: {
key: 'test-timestrip',
@ -660,7 +618,7 @@ describe("The Imagery View Layouts", () => {
it("on mount should show imagery within the given bounds", (done) => {
Vue.nextTick(() => {
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
expect(imageElements.length).toEqual(6);
expect(imageElements.length).toEqual(5);
done();
});
});
@ -680,5 +638,46 @@ describe("The Imagery View Layouts", () => {
});
});
});
it("should remove images when clock advances", async () => {
openmct.time.tick(ONE_MINUTE * 2);
await Vue.nextTick();
await Vue.nextTick();
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
expect(imageElements.length).toEqual(4);
});
it("should remove images when start bounds shorten", async () => {
openmct.time.timeSystem('utc', {
start: START,
end: START + (5 * ONE_MINUTE)
});
await Vue.nextTick();
await Vue.nextTick();
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
expect(imageElements.length).toEqual(1);
});
it("should remove images when end bounds shorten", async () => {
openmct.time.timeSystem('utc', {
start: START - (5 * ONE_MINUTE),
end: START - (2 * ONE_MINUTE)
});
await Vue.nextTick();
await Vue.nextTick();
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
expect(imageElements.length).toEqual(4);
});
it("should remove images when both bounds shorten", async () => {
openmct.time.timeSystem('utc', {
start: START - (2 * ONE_MINUTE),
end: START + (2 * ONE_MINUTE)
});
await Vue.nextTick();
await Vue.nextTick();
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
expect(imageElements.length).toEqual(3);
});
});
});

27
src/plugins/importFromJSONAction/ImportFromJSONAction.js
View File

@ -82,12 +82,14 @@ export default class ImportAsJSONAction {
* @param {object} seen
*/
_deepInstantiate(parent, tree, seen) {
if (this.openmct.composition.get(parent)) {
let objectIdentifiers = this._getObjectReferenceIds(parent);
if (objectIdentifiers.length) {
let newObj;
seen.push(parent.id);
parent.composition.forEach(async (childId) => {
objectIdentifiers.forEach(async (childId) => {
const keystring = this.openmct.objects.makeKeyString(childId);
if (!tree[keystring] || seen.includes(keystring)) {
return;
@ -101,6 +103,27 @@ export default class ImportAsJSONAction {
}, this);
}
}
/**
* @private
* @param {object} parent
* @returns [identifiers]
*/
_getObjectReferenceIds(parent) {
let objectIdentifiers = [];
let parentComposition = this.openmct.composition.get(parent);
if (parentComposition) {
objectIdentifiers = Array.from(parentComposition.domainObject.composition);
}
//conditional object styles are not saved on the composition, so we need to check for them
let parentObjectReference = parent.configuration?.objectStyles?.conditionSetIdentifier;
if (parentObjectReference) {
objectIdentifiers.push(parentObjectReference);
}
return objectIdentifiers;
}
/**
* @private
* @param {object} tree

1
src/plugins/notebook/components/Notebook.vue
View File

@ -144,6 +144,7 @@
v-if="selectedSection && selectedPage"
ref="notebookEntries"
class="c-notebook__entries"
aria-label="Notebook Entries"
>
<NotebookEntry
v-for="entry in filteredAndSortedEntries"

2
src/plugins/notebook/components/NotebookEntry.vue
View File

@ -23,6 +23,7 @@
<template>
<div
class="c-notebook__entry c-ne has-local-controls has-tag-applier"
aria-label="Notebook Entry"
:class="{ 'locked': isLocked }"
@dragover="changeCursor"
@drop.capture="cancelEditMode"
@ -58,6 +59,7 @@
<div
:id="entry.id"
class="c-ne__text c-ne__input"
aria-label="Notebook Entry Input"
tabindex="0"
contenteditable="true"
@focus="editingEntry()"

2
src/plugins/operatorStatus/operator-status.scss
View File

@ -80,7 +80,7 @@
&__content {
$m: $interiorMargin;
display: grid;
grid-template-columns: min-content 1fr;
grid-template-columns: max-content 1fr;
grid-column-gap: $m;
grid-row-gap: $m;

3
src/plugins/operatorStatus/operatorStatus/OperatorStatus.vue
View File

@ -57,6 +57,7 @@
</template>
<script>
const DEFAULT_POLL_QUESTION = 'NO POLL QUESTION';
export default {
inject: ['openmct', 'indicator', 'configuration'],
@ -75,7 +76,7 @@ export default {
allRoles: [],
role: '--',
pollQuestionUpdated: '--',
currentPollQuestion: '--',
currentPollQuestion: DEFAULT_POLL_QUESTION,
selectedStatus: undefined,
allStatuses: []
};

8
src/plugins/operatorStatus/pollQuestion/PollQuestion.vue
View File

@ -34,7 +34,7 @@
<div class="c-status-poll__section c-status-poll-panel__content c-spq">
<!-- Grid layout -->
<div class="c-spq__label">Current:</div>
<div class="c-spq__label">Current poll:</div>
<div class="c-spq__value c-status-poll-panel__poll-question">{{ currentPollQuestion }}</div>
<template v-if="statusCountViewModel.length > 0">
@ -43,6 +43,7 @@
<div
v-for="entry in statusCountViewModel"
:key="entry.status.key"
:title="entry.status.label"
class="c-status-poll-report__count"
:style="[{
background: entry.status.statusBgColor,
@ -69,6 +70,7 @@
>
<button
class="c-button"
title="Publish a new poll question and reset previous responses"
@click="updatePollQuestion"
>Update</button>
</div>
@ -78,6 +80,7 @@
</template>
<script>
import _ from 'lodash';
export default {
inject: ['openmct', 'indicator', 'configuration'],
@ -118,6 +121,9 @@ export default {
this.openmct.user.status.off('statusChange', this.fetchStatusSummary);
this.openmct.user.status.off('pollQuestionChange', this.setPollQuestion);
},
created() {
this.fetchStatusSummary = _.debounce(this.fetchStatusSummary);
},
methods: {
async fetchCurrentPoll() {
const pollQuestion = await this.openmct.user.status.getPollQuestion();

3
src/plugins/persistence/couch/CouchChangesFeed.js
View File

@ -93,8 +93,7 @@
message.state = 'close';
break;
default:
// Assume connection is closed
message.state = 'close';
message.state = 'unknown';
console.error('🚨 Received unexpected readyState value from CouchDB EventSource feed: 🚨', readyState);
break;
}

3
src/plugins/persistence/couch/CouchDocument.js
View File

@ -45,8 +45,7 @@ export default function CouchDocument(id, model, rev, markDeleted) {
"category": "domain object",
"type": model.type,
"owner": "admin",
"name": model.name,
"created": Date.now()
"name": model.name
},
"model": model
};

154
src/plugins/persistence/couch/CouchObjectProvider.js
View File

@ -22,7 +22,7 @@
import CouchDocument from "./CouchDocument";
import CouchObjectQueue from "./CouchObjectQueue";
import { PENDING, CONNECTED, DISCONNECTED } from "./CouchStatusIndicator";
import { PENDING, CONNECTED, DISCONNECTED, UNKNOWN } from "./CouchStatusIndicator";
import { isNotebookType } from '../../notebook/notebook-constants.js';
const REV = "_rev";
@ -112,7 +112,7 @@ class CouchObjectProvider {
* Takes in a state message from the CouchDB SharedWorker and returns an IndicatorState.
* @private
* @param {'open'|'close'|'pending'} message
* @returns import('./CouchStatusIndicator').IndicatorState
* @returns {import('./CouchStatusIndicator').IndicatorState}
*/
#messageToIndicatorState(message) {
let state;
@ -126,14 +126,52 @@ class CouchObjectProvider {
case 'pending':
state = PENDING;
break;
default:
state = PENDING;
case 'unknown':
state = UNKNOWN;
break;
}
return state;
}
/**
* Takes an HTTP status code and returns an IndicatorState
* @private
* @param {number} statusCode
* @returns {import("./CouchStatusIndicator").IndicatorState}
*/
#statusCodeToIndicatorState(statusCode) {
let state;
switch (statusCode) {
case CouchObjectProvider.HTTP_OK:
case CouchObjectProvider.HTTP_CREATED:
case CouchObjectProvider.HTTP_ACCEPTED:
case CouchObjectProvider.HTTP_NOT_MODIFIED:
case CouchObjectProvider.HTTP_BAD_REQUEST:
case CouchObjectProvider.HTTP_UNAUTHORIZED:
case CouchObjectProvider.HTTP_FORBIDDEN:
case CouchObjectProvider.HTTP_NOT_FOUND:
case CouchObjectProvider.HTTP_METHOD_NOT_ALLOWED:
case CouchObjectProvider.HTTP_NOT_ACCEPTABLE:
case CouchObjectProvider.HTTP_CONFLICT:
case CouchObjectProvider.HTTP_PRECONDITION_FAILED:
case CouchObjectProvider.HTTP_REQUEST_ENTITY_TOO_LARGE:
case CouchObjectProvider.HTTP_UNSUPPORTED_MEDIA_TYPE:
case CouchObjectProvider.HTTP_REQUESTED_RANGE_NOT_SATISFIABLE:
case CouchObjectProvider.HTTP_EXPECTATION_FAILED:
case CouchObjectProvider.HTTP_SERVER_ERROR:
state = CONNECTED;
break;
case CouchObjectProvider.HTTP_SERVICE_UNAVAILABLE:
state = DISCONNECTED;
break;
default:
state = UNKNOWN;
}
return state;
}
//backwards compatibility, options used to be a url. Now it's an object
#normalize(options) {
if (typeof options === 'string') {
@ -161,33 +199,48 @@ class CouchObjectProvider {
}
let response = null;
if (!this.isObservingObjectChanges()) {
this.#observeObjectChanges();
}
try {
response = await fetch(this.url + '/' + subPath, fetchOptions);
this.indicator.setIndicatorToState(CONNECTED);
const { status } = response;
const json = await response.json();
this.#handleResponseCode(status, json, fetchOptions);
if (response.status === CouchObjectProvider.HTTP_CONFLICT) {
throw new this.openmct.objects.errors.Conflict(`Conflict persisting ${fetchOptions.body.name}`);
} else if (response.status === CouchObjectProvider.HTTP_BAD_REQUEST
|| response.status === CouchObjectProvider.HTTP_UNAUTHORIZED
|| response.status === CouchObjectProvider.HTTP_NOT_FOUND
|| response.status === CouchObjectProvider.HTTP_PRECONDITION_FAILED) {
const error = await response.json();
throw new Error(`CouchDB Error: "${error.error}: ${error.reason}"`);
} else if (response.status === CouchObjectProvider.HTTP_SERVER_ERROR) {
throw new Error('CouchDB Error: "500 Internal Server Error"');
}
return await response.json();
return json;
} catch (error) {
// Network error, CouchDB unreachable.
if (response === null) {
this.indicator.setIndicatorToState(DISCONNECTED);
console.error(error.message);
throw new Error(`CouchDB Error - No response"`);
}
console.error(error.message);
}
}
/**
* Handle the response code from a CouchDB request.
* Sets the CouchDB indicator status and throws an error if needed.
* @private
*/
#handleResponseCode(status, json, fetchOptions) {
this.indicator.setIndicatorToState(this.#statusCodeToIndicatorState(status));
if (status === CouchObjectProvider.HTTP_CONFLICT) {
throw new this.openmct.objects.errors.Conflict(`Conflict persisting ${fetchOptions.body.name}`);
} else if (status >= CouchObjectProvider.HTTP_BAD_REQUEST) {
if (!json.error || !json.reason) {
throw new Error(`CouchDB Error ${status}`);
}
throw new Error(`CouchDB Error ${status}: "${json.error} - ${json.reason}"`);
}
}
/**
* Check the response to a create/update/delete request;
* track the rev if it's valid, otherwise return false to
@ -328,6 +381,8 @@ class CouchObjectProvider {
return this.request(ALL_DOCS, 'POST', query, signal).then((response) => {
if (response && response.rows !== undefined) {
return response.rows.reduce((map, row) => {
//row.doc === null if the document does not exist.
//row.doc === undefined if the document is not found.
if (row.doc !== undefined) {
map[row.key] = this.#getModel(row.doc);
}
@ -425,9 +480,6 @@ class CouchObjectProvider {
this.observers[keyString] = this.observers[keyString].filter(observer => observer !== callback);
if (this.observers[keyString].length === 0) {
delete this.observers[keyString];
if (Object.keys(this.observers).length === 0 && this.isObservingObjectChanges()) {
this.stopObservingObjectChanges();
}
}
}
};
@ -452,7 +504,6 @@ class CouchObjectProvider {
} else {
this.#initiateSharedWorkerFetchChanges(sseURL.toString());
}
}
/**
@ -479,18 +530,24 @@ class CouchObjectProvider {
onEventError(error) {
console.error('Error on feed', error);
if (Object.keys(this.observers).length > 0) {
this.#observeObjectChanges();
}
const { readyState } = error.target;
this.#updateIndicatorStatus(readyState);
}
onEventOpen(event) {
const { readyState } = event.target;
this.#updateIndicatorStatus(readyState);
}
onEventMessage(event) {
const { readyState } = event.target;
const eventData = JSON.parse(event.data);
const identifier = {
namespace: this.namespace,
key: eventData.id
};
const keyString = this.openmct.objects.makeKeyString(identifier);
this.#updateIndicatorStatus(readyState);
let observersForObject = this.observers[keyString];
if (observersForObject) {
@ -513,17 +570,18 @@ class CouchObjectProvider {
this.stopObservingObjectChanges = () => {
controller.abort();
couchEventSource.removeEventListener('message', this.onEventMessage);
couchEventSource.removeEventListener('message', this.onEventMessage.bind(this));
delete this.stopObservingObjectChanges;
};
console.debug('⇿ Opening CouchDB change feed connection ⇿');
couchEventSource = new EventSource(url);
couchEventSource.onerror = this.onEventError;
couchEventSource.onerror = this.onEventError.bind(this);
couchEventSource.onopen = this.onEventOpen.bind(this);
// start listening for events
couchEventSource.addEventListener('message', this.onEventMessage);
couchEventSource.addEventListener('message', this.onEventMessage.bind(this));
console.debug('⇿ Opened connection ⇿');
}
@ -541,6 +599,31 @@ class CouchObjectProvider {
return intermediateResponse;
}
/**
* Update the indicator status based on the readyState of the EventSource
* @private
*/
#updateIndicatorStatus(readyState) {
let message;
switch (readyState) {
case EventSource.CONNECTING:
message = 'pending';
break;
case EventSource.OPEN:
message = 'open';
break;
case EventSource.CLOSED:
message = 'close';
break;
default:
message = 'unknown';
break;
}
const indicatorState = this.#messageToIndicatorState(message);
this.indicator.setIndicatorToState(indicatorState);
}
/**
* @private
*/
@ -568,6 +651,7 @@ class CouchObjectProvider {
this.objectQueue[key].pending = true;
const queued = this.objectQueue[key].dequeue();
let document = new CouchDocument(key, queued.model);
document.metadata.created = Date.now();
this.request(key, "PUT", document).then((response) => {
console.log('create check response', key);
this.#checkResponse(response, queued.intermediateResponse, key);
@ -627,11 +711,25 @@ class CouchObjectProvider {
}
}
// https://docs.couchdb.org/en/3.2.0/api/basics.html
CouchObjectProvider.HTTP_OK = 200;
CouchObjectProvider.HTTP_CREATED = 201;
CouchObjectProvider.HTTP_ACCEPTED = 202;
CouchObjectProvider.HTTP_NOT_MODIFIED = 304;
CouchObjectProvider.HTTP_BAD_REQUEST = 400;
CouchObjectProvider.HTTP_UNAUTHORIZED = 401;
CouchObjectProvider.HTTP_FORBIDDEN = 403;
CouchObjectProvider.HTTP_NOT_FOUND = 404;
CouchObjectProvider.HTTP_METHOD_NOT_ALLOWED = 404;
CouchObjectProvider.HTTP_NOT_ACCEPTABLE = 406;
CouchObjectProvider.HTTP_CONFLICT = 409;
CouchObjectProvider.HTTP_PRECONDITION_FAILED = 412;
CouchObjectProvider.HTTP_REQUEST_ENTITY_TOO_LARGE = 413;
CouchObjectProvider.HTTP_UNSUPPORTED_MEDIA_TYPE = 415;
CouchObjectProvider.HTTP_REQUESTED_RANGE_NOT_SATISFIABLE = 416;
CouchObjectProvider.HTTP_EXPECTATION_FAILED = 417;
CouchObjectProvider.HTTP_SERVER_ERROR = 500;
// If CouchDB is containerized via Docker it will return 503 if service is unavailable.
CouchObjectProvider.HTTP_SERVICE_UNAVAILABLE = 503;
export default CouchObjectProvider;

2
src/plugins/persistence/couch/CouchSearchProvider.js
View File

@ -102,7 +102,7 @@ class CouchSearchProvider {
},
{
"model.annotationType": {
"$eq": "notebook"
"$eq": "NOTEBOOK"
}
},
{

8
src/plugins/persistence/couch/CouchStatusIndicator.js
View File

@ -56,10 +56,10 @@ export const DISCONNECTED = {
description: "CouchDB is offline and unavailable for requests."
};
/** @type {IndicatorState} */
export const MAINTENANCE = {
statusClass: "s-status-warning-lo",
text: "CouchDB is in maintenance mode",
description: "CouchDB is online, but not currently accepting requests."
export const UNKNOWN = {
statusClass: "s-status-info",
text: "CouchDB connectivity unknown",
description: "CouchDB is in an unknown state of connectivity."
};
export default class CouchStatusIndicator {

42
src/plugins/persistence/couch/pluginSpec.js
View File

@ -25,7 +25,7 @@ import {
createOpenMct,
resetApplicationState, spyOnBuiltins
} from 'utils/testing';
import { CONNECTED, DISCONNECTED, PENDING } from './CouchStatusIndicator';
import { CONNECTED, DISCONNECTED, PENDING, UNKNOWN } from './CouchStatusIndicator';
describe('the plugin', () => {
let openmct;
@ -152,7 +152,10 @@ describe('the plugin', () => {
mockDomainObject.id = mockDomainObject.identifier.key;
const fakeUpdateEvent = {
data: JSON.stringify(mockDomainObject)
data: JSON.stringify(mockDomainObject),
target: {
readyState: EventSource.CONNECTED
}
};
// eslint-disable-next-line require-await
@ -170,7 +173,6 @@ describe('the plugin', () => {
expect(provider.create).toHaveBeenCalled();
expect(provider.observe).toHaveBeenCalled();
expect(provider.isObservingObjectChanges).toHaveBeenCalled();
expect(provider.isObservingObjectChanges.calls.mostRecent().returnValue).toBe(true);
//Set modified timestamp it detects a change and persists the updated model.
mockDomainObject.modified = mockDomainObject.persisted + 1;
@ -181,6 +183,7 @@ describe('the plugin', () => {
expect(updatedResult).toBeTrue();
expect(provider.update).toHaveBeenCalled();
expect(provider.fetchChanges).toHaveBeenCalled();
expect(provider.isObservingObjectChanges.calls.mostRecent().returnValue).toBe(true);
sharedWorkerCallback(fakeUpdateEvent);
expect(provider.onEventMessage).toHaveBeenCalled();
@ -397,5 +400,38 @@ describe('the view', () => {
assertCouchIndicatorStatus(PENDING);
});
it("to 'unknown'", async () => {
const workerMessage = {
data: {
type: 'state',
state: 'unknown'
}
};
mockPromise = Promise.resolve({
status: 200,
json: () => {
return {
ok: true,
_id: 'some-value',
id: 'some-value',
_rev: 1,
model: {}
};
}
});
fetch.and.returnValue(mockPromise);
await openmct.objects.get({
namespace: '',
key: 'object-1'
});
// Simulate 'pending' state from worker message
provider.onSharedWorkerMessage(workerMessage);
await Vue.nextTick();
assertCouchIndicatorStatus(UNKNOWN);
});
});
});

2
src/plugins/plan/PlanViewProvider.js
View File

@ -39,7 +39,7 @@ export default function PlanViewProvider(openmct) {
},
canEdit(domainObject) {
return domainObject.type === 'plan';
return false;
},
view: function (domainObject, objectPath) {

12
src/plugins/plan/pluginSpec.js
View File

@ -96,6 +96,18 @@ describe('the plugin', function () {
let planView = applicableViews.find((viewProvider) => viewProvider.key === 'plan.view');
expect(planView).toBeDefined();
});
it('is not an editable view', () => {
const testViewObject = {
id: "test-object",
type: "plan"
};
openmct.router.path = [testViewObject];
const applicableViews = openmct.objectViews.get(testViewObject, [testViewObject]);
let planView = applicableViews.find((viewProvider) => viewProvider.key === 'plan.view');
expect(planView.canEdit()).toBeFalse();
});
});
describe('the plan view displays activities', () => {

2
src/plugins/plot/MctPlot.vue
View File

@ -484,7 +484,7 @@ export default {
end: range.max,
domain: this.config.xAxis.get('key')
})
.then(this.stopLoading());
.then(this.stopLoading.bind(this));
if (purge) {
plotSeries.purgeRecordsOutsideRange(range);
}

15
src/plugins/plot/Plot.vue
View File

@ -24,16 +24,16 @@
ref="plotWrapper"
class="c-plot holder holder-plot has-control-bar"
>
<div
ref="plotContainer"
class="l-view-section u-style-receiver js-style-receiver"
:class="{'s-status-timeconductor-unsynced': status && status === 'timeconductor-unsynced'}"
>
<div
<progress-bar
v-show="!!loading"
class="c-loading--overlay loading"
></div>
class="c-telemetry-table__progress-bar"
:model="{progressPerc: undefined}"
/>
<mct-plot
:init-grid-lines="gridLines"
:init-cursor-guide="cursorGuide"
@ -49,10 +49,12 @@
import eventHelpers from './lib/eventHelpers';
import ImageExporter from '../../exporters/ImageExporter';
import MctPlot from './MctPlot.vue';
import ProgressBar from "../../ui/components/ProgressBar.vue";
export default {
components: {
MctPlot
MctPlot,
ProgressBar
},
inject: ['openmct', 'domainObject', 'path'],
props: {
@ -89,17 +91,14 @@ export default {
destroy() {
this.stopListening();
},
exportJPG() {
const plotElement = this.$refs.plotContainer;
this.imageExporter.exportJPG(plotElement, 'plot.jpg', 'export-plot');
},
exportPNG() {
const plotElement = this.$refs.plotContainer;
this.imageExporter.exportPNG(plotElement, 'plot.png', 'export-plot');
},
setStatus(status) {
this.status = status;
},

4
src/plugins/plot/actions/ViewActions.js
View File

@ -25,7 +25,7 @@ const exportPNG = {
name: 'Export as PNG',
key: 'export-as-png',
description: 'Export This View\'s Data as PNG',
cssClass: 'c-icon-button icon-download',
cssClass: 'icon-download',
group: 'view',
invoke(objectPath, view) {
view.getViewContext().exportPNG();
@ -36,7 +36,7 @@ const exportJPG = {
name: 'Export as JPG',
key: 'export-as-jpg',
description: 'Export This View\'s Data as JPG',
cssClass: 'c-icon-button icon-download',
cssClass: 'icon-download',
group: 'view',
invoke(objectPath, view) {
view.getViewContext().exportJPG();

22
src/plugins/plot/axis/XAxis.vue
View File

@ -135,17 +135,21 @@ export default {
},
setUpXAxisOptions() {
const xAxisKey = this.xAxis.get('key');
this.xKeyOptions = [];
if (this.seriesModel.metadata) {
this.xKeyOptions = this.seriesModel.metadata
.valuesForHints(['domain'])
.map(function (o) {
return {
name: o.name,
key: o.key
};
});
}
this.xKeyOptions = this.seriesModel.metadata
.valuesForHints(['domain'])
.map(function (o) {
return {
name: o.name,
key: o.key
};
});
this.xAxisLabel = this.xAxis.get('label');
this.selectedXKeyOptionKey = this.getXKeyOption(xAxisKey).key;
this.selectedXKeyOptionKey = this.xKeyOptions.length > 0 ? this.getXKeyOption(xAxisKey).key : xAxisKey;
},
onTickWidthChange(width) {
this.$emit('tickWidthChanged', width);

22
src/plugins/plot/axis/YAxis.vue
View File

@ -120,21 +120,25 @@ export default {
}
},
setUpYAxisOptions() {
this.yKeyOptions = this.seriesModel.metadata
.valuesForHints(['range'])
.map(function (o) {
return {
name: o.name,
key: o.key
};
});
this.yKeyOptions = [];
if (this.seriesModel.metadata) {
this.yKeyOptions = this.seriesModel.metadata
.valuesForHints(['range'])
.map(function (o) {
return {
name: o.name,
key: o.key
};
});
}
// set yAxisLabel if none is set yet
if (this.yAxisLabel === 'none') {
let yKey = this.seriesModel.model.yKey;
let yKeyModel = this.yKeyOptions.filter(o => o.key === yKey)[0];
this.yAxisLabel = yKeyModel.name;
this.yAxisLabel = yKeyModel ? yKeyModel.name : '';
}
},
toggleYAxisLabel() {

6
src/plugins/plot/configuration/Model.js
View File

@ -34,6 +34,12 @@ export default class Model extends EventEmitter {
*/
constructor(options) {
super();
Object.defineProperty(this, '_events', {
value: this._events,
enumerable: false,
configurable: false,
writable: true
});
//need to do this as we're already extending EventEmitter
eventHelpers.extend(this);

46
src/plugins/plot/inspector/PlotOptionsBrowse.vue
View File

@ -197,25 +197,27 @@ export default {
},
methods: {
initConfiguration() {
this.label = this.config.yAxis.get('label');
this.autoscale = this.config.yAxis.get('autoscale');
this.logMode = this.config.yAxis.get('logMode');
this.autoscalePadding = this.config.yAxis.get('autoscalePadding');
const range = this.config.yAxis.get('range');
if (range) {
this.rangeMin = range.min;
this.rangeMax = range.max;
}
if (this.config) {
this.label = this.config.yAxis.get('label');
this.autoscale = this.config.yAxis.get('autoscale');
this.logMode = this.config.yAxis.get('logMode');
this.autoscalePadding = this.config.yAxis.get('autoscalePadding');
const range = this.config.yAxis.get('range');
if (range) {
this.rangeMin = range.min;
this.rangeMax = range.max;
}
this.position = this.config.legend.get('position');
this.hideLegendWhenSmall = this.config.legend.get('hideLegendWhenSmall');
this.expandByDefault = this.config.legend.get('expandByDefault');
this.valueToShowWhenCollapsed = this.config.legend.get('valueToShowWhenCollapsed');
this.showTimestampWhenExpanded = this.config.legend.get('showTimestampWhenExpanded');
this.showValueWhenExpanded = this.config.legend.get('showValueWhenExpanded');
this.showMinimumWhenExpanded = this.config.legend.get('showMinimumWhenExpanded');
this.showMaximumWhenExpanded = this.config.legend.get('showMaximumWhenExpanded');
this.showUnitsWhenExpanded = this.config.legend.get('showUnitsWhenExpanded');
this.position = this.config.legend.get('position');
this.hideLegendWhenSmall = this.config.legend.get('hideLegendWhenSmall');
this.expandByDefault = this.config.legend.get('expandByDefault');
this.valueToShowWhenCollapsed = this.config.legend.get('valueToShowWhenCollapsed');
this.showTimestampWhenExpanded = this.config.legend.get('showTimestampWhenExpanded');
this.showValueWhenExpanded = this.config.legend.get('showValueWhenExpanded');
this.showMinimumWhenExpanded = this.config.legend.get('showMinimumWhenExpanded');
this.showMaximumWhenExpanded = this.config.legend.get('showMaximumWhenExpanded');
this.showUnitsWhenExpanded = this.config.legend.get('showUnitsWhenExpanded');
}
},
getConfig() {
this.configId = this.openmct.objects.makeKeyString(this.domainObject.identifier);
@ -223,10 +225,12 @@ export default {
return configStore.get(this.configId);
},
registerListeners() {
this.config.series.forEach(this.addSeries, this);
if (this.config) {
this.config.series.forEach(this.addSeries, this);
this.listenTo(this.config.series, 'add', this.addSeries, this);
this.listenTo(this.config.series, 'remove', this.resetAllSeries, this);
this.listenTo(this.config.series, 'add', this.addSeries, this);
this.listenTo(this.config.series, 'remove', this.resetAllSeries, this);
}
},
addSeries(series, index) {

25
src/plugins/plot/inspector/PlotOptionsEdit.vue
View File

@ -64,6 +64,7 @@ import YAxisForm from "./forms/YAxisForm.vue";
import LegendForm from "./forms/LegendForm.vue";
import eventHelpers from "../lib/eventHelpers";
import configStore from "../configuration/ConfigStore";
import _ from "lodash";
export default {
components: {
@ -125,15 +126,25 @@ export default {
});
if (index < 0) {
index = stackedPlotObject.configuration.series.length;
const configPath = `configuration.series[${index}]`;
let newConfig = {
identifier: config.identifier
};
_.set(newConfig, `${config.path}`, config.value);
this.openmct.objects.mutate(
stackedPlotObject,
configPath,
newConfig
);
} else {
const configPath = `configuration.series[${index}].${config.path}`;
this.openmct.objects.mutate(
stackedPlotObject,
configPath,
config.value
);
}
const configPath = `configuration.series[${index}].${config.path}`;
this.openmct.objects.mutate(
stackedPlotObject,
configPath,
config.value
);
}
}
};

Some files were not shown because too many files have changed in this diff Show More