Commit bbe76799 authored by Eduardo Sanz García's avatar Eduardo Sanz García Committed by Eduardo

Remove two steps process for `FrameObserver`

Previously, after `FrameObserver` was constructed it required
`.observe(callback1, callback2)` method to be executed to start the
observation.

With this change the callbacks are provided in the constructor and the
observation starts immediately.
parent ea9252dd
...@@ -12,8 +12,16 @@ let difference = (arrayA, arrayB) => { ...@@ -12,8 +12,16 @@ let difference = (arrayA, arrayB) => {
export const DEBOUNCE_WAIT = 40; export const DEBOUNCE_WAIT = 40;
export default class FrameObserver { export default class FrameObserver {
constructor(target) { /**
this._target = target; * @param {Element} element - root of the DOM subtree to watch for the addition
* and removal of annotatable iframes
* @param {FrameCallback} onFrameAdded - callback fired when an annotatable iframe is added
* @param {FrameCallback} onFrameRemoved - callback triggered when the annotatable iframe is removed
*/
constructor(element, onFrameAdded, onFrameRemoved) {
this._element = element;
this._onFrameAdded = onFrameAdded;
this._onFrameRemoved = onFrameRemoved;
/** @type {HTMLIFrameElement[]} */ /** @type {HTMLIFrameElement[]} */
this._handledFrames = []; this._handledFrames = [];
...@@ -22,22 +30,8 @@ export default class FrameObserver { ...@@ -22,22 +30,8 @@ export default class FrameObserver {
this._discoverFrames(); this._discoverFrames();
}, DEBOUNCE_WAIT) }, DEBOUNCE_WAIT)
); );
}
/**
* Registers two listeners: the first callback is fired when an Hypothesis frame
* is added, the second when an Hypothesis frame is removed.
* This method is expected to be called only once.
*
* @param {FrameCallback} onFrameAdded
* @param {FrameCallback} onFrameRemoved
*/
observe(onFrameAdded, onFrameRemoved) {
this._onFrameAdded = onFrameAdded;
this._onFrameRemoved = onFrameRemoved;
this._discoverFrames(); this._discoverFrames();
this._mutationObserver.observe(this._target, { this._mutationObserver.observe(this._element, {
childList: true, childList: true,
subtree: true, subtree: true,
attributeFilter: ['enable-annotation'], attributeFilter: ['enable-annotation'],
...@@ -59,8 +53,7 @@ export default class FrameObserver { ...@@ -59,8 +53,7 @@ export default class FrameObserver {
this._removeFrame(frame); this._removeFrame(frame);
}); });
this._handledFrames.push(frame); this._handledFrames.push(frame);
// this._onFrameAdded is never undefined when reached this line this._onFrameAdded(frame);
/** @type {FrameCallback} */ (this._onFrameAdded)(frame);
}); });
} else { } else {
// Could warn here that frame was not cross origin accessible // Could warn here that frame was not cross origin accessible
...@@ -71,15 +64,14 @@ export default class FrameObserver { ...@@ -71,15 +64,14 @@ export default class FrameObserver {
* @param {HTMLIFrameElement} frame * @param {HTMLIFrameElement} frame
*/ */
_removeFrame(frame) { _removeFrame(frame) {
// this._onFrameRemoved is never undefined when reached this line this._onFrameRemoved(frame);
/** @type {FrameCallback} */ (this._onFrameRemoved)(frame);
// Remove the frame from our list // Remove the frame from our list
this._handledFrames = this._handledFrames.filter(x => x !== frame); this._handledFrames = this._handledFrames.filter(x => x !== frame);
} }
_discoverFrames() { _discoverFrames() {
let frames = FrameUtil.findFrames(this._target); let frames = FrameUtil.findFrames(this._element);
for (let frame of frames) { for (let frame of frames) {
if (!this._handledFrames.includes(frame)) { if (!this._handledFrames.includes(frame)) {
......
...@@ -24,11 +24,10 @@ export class HypothesisInjector { ...@@ -24,11 +24,10 @@ export class HypothesisInjector {
constructor(element, bridge, config) { constructor(element, bridge, config) {
this._bridge = bridge; this._bridge = bridge;
this._config = config; this._config = config;
this._frameObserver = new FrameObserver(element);
/** @type {Map<HTMLIFrameElement, string>} */ /** @type {Map<HTMLIFrameElement, string>} */
this._frameIdentifiers = new Map(); this._frameIdentifiers = new Map();
this._frameObserver = new FrameObserver(
this._frameObserver.observe( element,
frame => this._injectIntoFrame(frame), frame => this._injectIntoFrame(frame),
frame => this._iframeUnloaded(frame) frame => this._iframeUnloaded(frame)
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment