Issue #3834 Reimplement New Tab action in vanilla JS (#3876)

* [Reimplement] create new action plugin for issue #3834

Co-authored-by mariuszr mariusz.rosinski@gmail.com
Co-authored-by: Henry Hsu <henryhsu@henrys-air.lan>
Co-authored-by: Andrew Henry <akhenry@gmail.com>
This commit is contained in:
Henry Hsu 2021-06-21 16:11:31 -07:00 committed by GitHub
parent 925518c83f
commit d56d176aac
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 185 additions and 129 deletions

View File

@ -24,7 +24,6 @@ define([
"./src/navigation/NavigationService",
"./src/navigation/NavigateAction",
"./src/navigation/OrphanNavigationHandler",
"./src/windowing/NewTabAction",
"./res/templates/browse.html",
"./res/templates/browse-object.html",
"./res/templates/browse/object-header.html",
@ -37,7 +36,6 @@ define([
NavigationService,
NavigateAction,
OrphanNavigationHandler,
NewTabAction,
browseTemplate,
browseObjectTemplate,
objectHeaderTemplate,
@ -128,23 +126,6 @@ define([
"depends": [
"navigationService"
]
},
{
"key": "window",
"name": "Open In New Tab",
"implementation": NewTabAction,
"description": "Open in a new browser tab",
"category": [
"view-control",
"contextual"
],
"depends": [
"urlService",
"$window"
],
"group": "windowing",
"priority": 10,
"cssClass": "icon-new-window"
}
],
"runs": [

View File

@ -1,75 +0,0 @@
/*****************************************************************************
* Open MCT, Copyright (c) 2014-2021, 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.
*****************************************************************************/
define(
["../../src/windowing/NewTabAction"],
function (NewTabAction) {
describe("The new tab action", function () {
var actionSelected,
actionCurrent,
mockWindow,
mockContextCurrent,
mockContextSelected,
mockUrlService;
beforeEach(function () {
mockWindow = jasmine.createSpyObj("$window", ["open", "location"]);
// Context if the current object is selected
// For example, when the top right new tab
// button is clicked, the user is using the
// current domainObject
mockContextCurrent = jasmine.createSpyObj("context", ["domainObject"]);
// Context if the selected object is selected
// For example, when an object in the left
// tree is opened in a new tab using the
// context menu
mockContextSelected = jasmine.createSpyObj("context", ["selectedObject",
"domainObject"]);
// Mocks the urlService used to make the new tab's url from a
// domainObject and mode
mockUrlService = jasmine.createSpyObj("urlService", ["urlForNewTab"]);
// Action done using the current context or mockContextCurrent
actionCurrent = new NewTabAction(mockUrlService, mockWindow,
mockContextCurrent);
// Action done using the selected context or mockContextSelected
actionSelected = new NewTabAction(mockUrlService, mockWindow,
mockContextSelected);
});
it("new tab with current url is opened", function () {
actionCurrent.perform();
});
it("new tab with a selected url is opened", function () {
actionSelected.perform();
});
});
}
);

View File

@ -274,6 +274,7 @@ define([
this.install(ImageryPlugin.default());
this.install(this.plugins.FlexibleLayout());
this.install(this.plugins.GoToOriginalAction());
this.install(this.plugins.OpenInNewTabAction());
this.install(this.plugins.ImportExport());
this.install(this.plugins.WebPage());
this.install(this.plugins.Condition());

View File

@ -0,0 +1,38 @@
/*****************************************************************************
* Open MCT, Copyright (c) 2014-2021, 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.
*****************************************************************************/
import objectPathToUrl from '/src/tools/url';
export default class OpenInNewTab {
constructor(openmct) {
this.name = 'Open In New Tab';
this.key = 'newTab';
this.description = 'Open in a new browser tab';
this.group = "windowing";
this.priority = 10;
this.cssClass = "icon-new-window";
this._openmct = openmct;
}
invoke(objectPath) {
let url = objectPathToUrl(this._openmct, objectPath);
window.open(url);
}
}

View File

@ -0,0 +1,28 @@
/*****************************************************************************
* Open MCT, Copyright (c) 2014-2021, 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.
*****************************************************************************/
import OpenInNewTabAction from './openInNewTabAction';
export default function () {
return function (openmct) {
openmct.actions.register(new OpenInNewTabAction(openmct));
};
}

View File

@ -0,0 +1,78 @@
/*****************************************************************************
* Open MCT, Copyright (c) 2014-2021, 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.
*****************************************************************************/
import {
createOpenMct,
resetApplicationState,
spyOnBuiltins
} from 'utils/testing';
describe("the plugin", () => {
let openmct;
let openInNewTabAction;
let mockObjectPath;
beforeEach((done) => {
openmct = createOpenMct();
openmct.on('start', done);
openmct.startHeadless();
openInNewTabAction = openmct.actions._allActions.newTab;
});
afterEach(() => {
return resetApplicationState(openmct);
});
it('installs the open in new tab action', () => {
expect(openInNewTabAction).toBeDefined();
});
describe('when invoked', () => {
beforeEach(async () => {
mockObjectPath = [{
name: 'mock folder',
type: 'folder',
identifier: {
key: 'mock-folder',
namespace: ''
}
}];
spyOn(openmct.objects, 'get').and.returnValue(Promise.resolve({
identifier: {
namespace: '',
key: 'test'
}
}));
spyOnBuiltins(['open']);
await openInNewTabAction.invoke(mockObjectPath);
});
afterEach(() => {
return resetApplicationState(openmct);
});
it('it opens in a new tab', () => {
expect(window.open).toHaveBeenCalled();
});
});
});

View File

@ -46,6 +46,7 @@ define([
'./filters/plugin',
'./objectMigration/plugin',
'./goToOriginalAction/plugin',
'./openInNewTabAction/plugin',
'./clearData/plugin',
'./webPage/plugin',
'./condition/plugin',
@ -91,6 +92,7 @@ define([
Filters,
ObjectMigration,
GoToOriginalAction,
OpenInNewTabAction,
ClearData,
WebPagePlugin,
ConditionPlugin,
@ -190,6 +192,7 @@ define([
plugins.Filters = Filters;
plugins.ObjectMigration = ObjectMigration.default;
plugins.GoToOriginalAction = GoToOriginalAction.default;
plugins.OpenInNewTabAction = OpenInNewTabAction.default;
plugins.ClearData = ClearData;
plugins.WebPage = WebPagePlugin.default;
plugins.Espresso = Espresso.default;

View File

@ -21,38 +21,39 @@
*****************************************************************************/
/**
* Module defining NewTabAction (Originally NewWindowAction). Created by vwoeltje on 11/18/14.
* Module defining url handling.
*/
define(
[],
function () {
/**
* The new tab action allows a domain object to be opened
* into a new browser tab.
* @memberof platform/commonUI/browse
* @constructor
* @implements {Action}
*/
function NewTabAction(urlService, $window, context) {
context = context || {};
this.urlService = urlService;
this.open = function () {
arguments[0] += "&hideTree=true&hideInspector=true";
$window.open.apply($window, arguments);
};
// Choose the object to be opened into a new tab
this.domainObject = context.selectedObject || context.domainObject;
export function paramsToArray(openmct) {
// parse urParams from an object to an array.
let urlParams = openmct.router.getParams();
let newTabParams = [];
for (let key in urlParams) {
if ({}.hasOwnProperty.call(urlParams, key)) {
let param = `${key}=${urlParams[key]}`;
newTabParams.push(param);
}
NewTabAction.prototype.perform = function () {
this.open(
this.urlService.urlForNewTab("browse", this.domainObject),
"_blank"
);
};
return NewTabAction;
}
);
return newTabParams;
}
export function identifierToString(openmct, objectPath) {
let identifier = '#/browse/' + objectPath.map(function (o) {
return o && openmct.objects.makeKeyString(o.identifier);
})
.reverse()
.join('/');
return identifier;
}
export default function objectPathToUrl(openmct, objectPath) {
let url = identifierToString(openmct, objectPath);
let urlParams = paramsToArray(openmct);
if (urlParams.length) {
url += '?' + urlParams.join('&');
}
return url;
}

View File

@ -1,3 +1,5 @@
import objectPathToUrl from '/src/tools/url';
export default {
inject: ['openmct'],
props: {
@ -18,10 +20,9 @@ export default {
return '#' + this.navigateToPath;
}
return '#/browse/' + this.objectPath
.map(o => o && this.openmct.objects.makeKeyString(o.identifier))
.reverse()
.join('/');
let url = objectPathToUrl(this.openmct, this.objectPath);
return url;
}
}
};