@openfin/web-utils 0.41.144 → 0.42.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/out/custom-elements/of-view.d.ts +2 -8
- package/out/custom-elements/of-view.js +11 -69
- package/out/utils/main.d.ts +0 -1
- package/out/utils/main.js +0 -1
- package/package.json +1 -1
- package/out/utils/utils.d.ts +0 -2
- package/out/utils/utils.js +0 -50
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
declare const mixin: (Base: typeof HTMLElement) => {
|
|
2
2
|
new (): {
|
|
3
|
-
"__#1@#titleObserver": MutationObserver | null;
|
|
4
|
-
"__#1@#initObservers"(): void;
|
|
5
|
-
"__#1@#clearObservers"(): void;
|
|
6
|
-
readonly lastKnownUrl: string | undefined;
|
|
7
3
|
connectedCallback(): void;
|
|
8
|
-
|
|
9
|
-
title: string;
|
|
4
|
+
"__#1@#iframe": HTMLIFrameElement;
|
|
10
5
|
brokerUrl: string | null;
|
|
11
6
|
name: string | null;
|
|
12
7
|
forceFrameName: string | null;
|
|
@@ -14,7 +9,6 @@ declare const mixin: (Base: typeof HTMLElement) => {
|
|
|
14
9
|
src: string | null;
|
|
15
10
|
providerId: string | null;
|
|
16
11
|
contextGroup: string | null;
|
|
17
|
-
allow: string | null;
|
|
18
12
|
accessKey: string;
|
|
19
13
|
readonly accessKeyLabel: string;
|
|
20
14
|
autocapitalize: string;
|
|
@@ -31,6 +25,7 @@ declare const mixin: (Base: typeof HTMLElement) => {
|
|
|
31
25
|
readonly offsetWidth: number;
|
|
32
26
|
outerText: string;
|
|
33
27
|
spellcheck: boolean;
|
|
28
|
+
title: string;
|
|
34
29
|
translate: boolean;
|
|
35
30
|
attachInternals(): ElementInternals;
|
|
36
31
|
click(): void;
|
|
@@ -333,7 +328,6 @@ export type OfViewAttributes = {
|
|
|
333
328
|
'of-name': string;
|
|
334
329
|
'of-broker'?: string;
|
|
335
330
|
'forceFrameName'?: string;
|
|
336
|
-
'allow'?: string;
|
|
337
331
|
'src': string;
|
|
338
332
|
};
|
|
339
333
|
type OfViewElementConstructor = ReturnType<typeof mixin>;
|
|
@@ -1,33 +1,5 @@
|
|
|
1
1
|
import { encodeOptions } from '../utils/options-encoder';
|
|
2
|
-
import { getTitleObserver, isSameOrigin } from '../utils/utils';
|
|
3
2
|
const mixin = (Base) => class _OfViewElement extends Base {
|
|
4
|
-
constructor() {
|
|
5
|
-
super(...arguments);
|
|
6
|
-
this.#titleObserver = null;
|
|
7
|
-
}
|
|
8
|
-
#titleObserver;
|
|
9
|
-
#initObservers() {
|
|
10
|
-
// we can only monitor the DOM if the iframe is same-origin
|
|
11
|
-
const iframe = this.iframe;
|
|
12
|
-
if (iframe &&
|
|
13
|
-
iframe.contentDocument?.head &&
|
|
14
|
-
iframe.contentWindow &&
|
|
15
|
-
window.top &&
|
|
16
|
-
isSameOrigin(iframe.contentWindow.window, window.top)) {
|
|
17
|
-
this.#titleObserver = getTitleObserver(iframe.contentDocument.head, (title) => this.dispatchEvent(new CustomEvent('page-title-updated', { detail: { title } })));
|
|
18
|
-
// Emit initial document.title
|
|
19
|
-
this.dispatchEvent(new CustomEvent('page-title-updated', { detail: { title: iframe.contentDocument.title } }));
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
#clearObservers() {
|
|
23
|
-
if (this.#titleObserver) {
|
|
24
|
-
this.#titleObserver.disconnect();
|
|
25
|
-
this.#titleObserver = null;
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
get lastKnownUrl() {
|
|
29
|
-
return this.iframe?.contentDocument?.location.href;
|
|
30
|
-
}
|
|
31
3
|
connectedCallback() {
|
|
32
4
|
if (!this.name || !this.uuid) {
|
|
33
5
|
throw new Error('<of-view> Name or uuid attribute missing');
|
|
@@ -35,28 +7,18 @@ const mixin = (Base) => class _OfViewElement extends Base {
|
|
|
35
7
|
if (!this.src) {
|
|
36
8
|
throw new Error(`<of-view> missing 'src' attribute.`);
|
|
37
9
|
}
|
|
38
|
-
if (!this
|
|
39
|
-
|
|
40
|
-
iframe.
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
iframe.addEventListener('unload', () => {
|
|
45
|
-
this.#clearObservers();
|
|
46
|
-
});
|
|
47
|
-
iframe.src = this.src;
|
|
48
|
-
if (this.allow) {
|
|
49
|
-
iframe.allow = this.allow;
|
|
50
|
-
}
|
|
51
|
-
iframe.style.height = '100%';
|
|
52
|
-
iframe.style.width = '100%';
|
|
53
|
-
iframe.style.border = 'none';
|
|
10
|
+
if (!this.#iframe) {
|
|
11
|
+
this.#iframe = document.createElement('iframe');
|
|
12
|
+
this.#iframe.src = this.src;
|
|
13
|
+
this.#iframe.style.height = '100%';
|
|
14
|
+
this.#iframe.style.width = '100%';
|
|
15
|
+
this.#iframe.style.border = 'none';
|
|
54
16
|
if (this.forceFrameName) {
|
|
55
17
|
// if forceFrameName is set, the consumer is intentionally breaking auto-connection
|
|
56
|
-
iframe.setAttribute('name', this.forceFrameName);
|
|
18
|
+
this.#iframe.setAttribute('name', this.forceFrameName);
|
|
57
19
|
}
|
|
58
20
|
else {
|
|
59
|
-
iframe.setAttribute('name', encodeOptions({
|
|
21
|
+
this.#iframe.setAttribute('name', encodeOptions({
|
|
60
22
|
brokerUrl: this.brokerUrl,
|
|
61
23
|
name: this.name,
|
|
62
24
|
uuid: this.uuid,
|
|
@@ -64,23 +26,11 @@ const mixin = (Base) => class _OfViewElement extends Base {
|
|
|
64
26
|
contextGroup: this.contextGroup
|
|
65
27
|
}, 'of-frame'));
|
|
66
28
|
}
|
|
67
|
-
iframe.setAttribute('id', this.name);
|
|
68
|
-
this.appendChild(iframe);
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
get iframe() {
|
|
72
|
-
return this.querySelector(`iframe[id="${this.name}"]`);
|
|
73
|
-
}
|
|
74
|
-
get title() {
|
|
75
|
-
return this.getAttribute('title') ?? this.iframe?.title ?? '';
|
|
76
|
-
}
|
|
77
|
-
set title(val) {
|
|
78
|
-
this.setAttribute('title', val);
|
|
79
|
-
// keep iframe title attribute in sync with of-view
|
|
80
|
-
if (this.iframe) {
|
|
81
|
-
this.iframe.title = val;
|
|
29
|
+
this.#iframe.setAttribute('id', this.name);
|
|
30
|
+
this.appendChild(this.#iframe);
|
|
82
31
|
}
|
|
83
32
|
}
|
|
33
|
+
#iframe;
|
|
84
34
|
get brokerUrl() {
|
|
85
35
|
return this.getAttribute('of-broker');
|
|
86
36
|
}
|
|
@@ -137,14 +87,6 @@ const mixin = (Base) => class _OfViewElement extends Base {
|
|
|
137
87
|
this.setAttribute('of-context-group', val);
|
|
138
88
|
}
|
|
139
89
|
}
|
|
140
|
-
get allow() {
|
|
141
|
-
return this.getAttribute('allow');
|
|
142
|
-
}
|
|
143
|
-
set allow(val) {
|
|
144
|
-
if (val) {
|
|
145
|
-
this.setAttribute('allow', val);
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
90
|
static get observedAttributes() {
|
|
149
91
|
return ['name'];
|
|
150
92
|
}
|
package/out/utils/main.d.ts
CHANGED
package/out/utils/main.js
CHANGED
package/package.json
CHANGED
package/out/utils/utils.d.ts
DELETED
package/out/utils/utils.js
DELETED
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
export const isSameOrigin = (windowA, windowB) => {
|
|
2
|
-
try {
|
|
3
|
-
return windowA.origin === windowB.origin;
|
|
4
|
-
}
|
|
5
|
-
catch (error) {
|
|
6
|
-
// CORS errors on access of window proxy origin means the windows are in different origins.
|
|
7
|
-
return false;
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
export const getTitleObserver = (documentHead, setter) => {
|
|
11
|
-
const observer = new MutationObserver((mutations) => {
|
|
12
|
-
let shouldEmit = false;
|
|
13
|
-
mutations.forEach((mutation) => {
|
|
14
|
-
// title DOM structure looks like this <title><text_node /><title> and all mutations boil down to:
|
|
15
|
-
// - mutation.target is <text_node>: text_node changed
|
|
16
|
-
// - mutation.target is <title> : text_node either added or removed
|
|
17
|
-
// - mutation.target is <head> : title is either added or removed
|
|
18
|
-
// check easy cases first and early return
|
|
19
|
-
// case 1
|
|
20
|
-
if (mutation.target.parentNode?.nodeName === 'TITLE') {
|
|
21
|
-
shouldEmit = true;
|
|
22
|
-
return;
|
|
23
|
-
}
|
|
24
|
-
// case 2
|
|
25
|
-
if (mutation.target.nodeName === 'TITLE') {
|
|
26
|
-
shouldEmit = true;
|
|
27
|
-
return;
|
|
28
|
-
}
|
|
29
|
-
// case 3 - check removed nodes first
|
|
30
|
-
mutation.removedNodes.forEach((node) => {
|
|
31
|
-
if (node.nodeName === 'TITLE' || node.parentNode?.nodeName === 'TITLE') {
|
|
32
|
-
shouldEmit = true;
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
mutation.addedNodes.forEach((node) => {
|
|
36
|
-
if (node.nodeName === 'TITLE' || node.parentNode?.nodeName === 'TITLE') {
|
|
37
|
-
shouldEmit = true;
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
});
|
|
41
|
-
// don't use mutation record for values, just grab a new title elem from DOM
|
|
42
|
-
const title = documentHead.querySelector('title')?.textContent ?? '';
|
|
43
|
-
if (shouldEmit) {
|
|
44
|
-
setter(title);
|
|
45
|
-
}
|
|
46
|
-
});
|
|
47
|
-
observer.observe(documentHead, { childList: true, subtree: true, characterData: true });
|
|
48
|
-
return observer;
|
|
49
|
-
};
|
|
50
|
-
// TODO: getFavIconObserver()
|