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

Fix unreliable frame-observer test

Because of the debouncing of mutation observer, sometimes 50ms was not
enough to trigger the callback function (`onFrameAdded`).

For the `FrameObserver` tests, I have disabled the debouncing. It has
the benefit that the test run faster now.
parent f43663c6
import { import { delay } from '../../test-util/wait';
FrameObserver, import { FrameObserver, onDocumentReady, $imports } from '../frame-observer';
DEBOUNCE_WAIT,
onDocumentReady,
} from '../frame-observer';
describe('annotator/frame-observer', () => { describe('annotator/frame-observer', () => {
describe('FrameObserver', () => { describe('FrameObserver', () => {
...@@ -12,11 +9,6 @@ describe('annotator/frame-observer', () => { ...@@ -12,11 +9,6 @@ describe('annotator/frame-observer', () => {
let onFrameRemoved; let onFrameRemoved;
const sandbox = sinon.createSandbox(); const sandbox = sinon.createSandbox();
// FrameObserver waits a few milliseconds (DEBOUNCE_WAIT) to detect changes in the DOM
function waitForFrameObserver() {
return new Promise(resolve => setTimeout(resolve, DEBOUNCE_WAIT + 10));
}
function createAnnotatableIFrame( function createAnnotatableIFrame(
attribute = 'enable-annotation', attribute = 'enable-annotation',
value = '' value = ''
...@@ -36,6 +28,12 @@ describe('annotator/frame-observer', () => { ...@@ -36,6 +28,12 @@ describe('annotator/frame-observer', () => {
beforeEach(() => { beforeEach(() => {
container = document.createElement('div'); container = document.createElement('div');
document.body.appendChild(container); document.body.appendChild(container);
sandbox.stub(console, 'warn');
$imports.$mock({
// Disable debouncing
'lodash.debounce': callback => callback,
});
onFrameAdded = sandbox.stub(); onFrameAdded = sandbox.stub();
onFrameRemoved = sandbox.stub(); onFrameRemoved = sandbox.stub();
frameObserver = new FrameObserver( frameObserver = new FrameObserver(
...@@ -43,45 +41,45 @@ describe('annotator/frame-observer', () => { ...@@ -43,45 +41,45 @@ describe('annotator/frame-observer', () => {
onFrameAdded, onFrameAdded,
onFrameRemoved onFrameRemoved
); );
sandbox.stub(console, 'warn');
}); });
afterEach(() => { afterEach(() => {
container.remove(); container.remove();
frameObserver.disconnect(); frameObserver.disconnect();
sandbox.restore(); sandbox.restore();
$imports.$restore();
}); });
it('triggers onFrameAdded when an annotatable iframe is added', async () => { it('triggers onFrameAdded when an annotatable iframe is added', async () => {
let iframe = createAnnotatableIFrame(); let iframe = createAnnotatableIFrame();
await waitForFrameObserver(); await delay(0);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe = createAnnotatableIFrame('enable-annotation', 'yes'); iframe = createAnnotatableIFrame('enable-annotation', 'yes');
await waitForFrameObserver(); await delay(0);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe = createAnnotatableIFrame('enable-annotation', 'true'); iframe = createAnnotatableIFrame('enable-annotation', 'true');
await waitForFrameObserver(); await delay(0);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe = createAnnotatableIFrame('enable-annotation', '1'); iframe = createAnnotatableIFrame('enable-annotation', '1');
await waitForFrameObserver(); await delay(0);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe = createAnnotatableIFrame('enable-annotation', 'false'); // the actual value of the attribute is irrelevant iframe = createAnnotatableIFrame('enable-annotation', 'false'); // the actual value of the attribute is irrelevant
await waitForFrameObserver(); await delay(0);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
}); });
it("doesn't trigger onFrameAdded when non-annotatable iframes are added", async () => { it("doesn't trigger onFrameAdded when non-annotatable iframes are added", async () => {
createAnnotatableIFrame('dummy-attribute'); createAnnotatableIFrame('dummy-attribute');
await waitForFrameObserver(); await delay(0);
assert.notCalled(onFrameAdded); assert.notCalled(onFrameAdded);
}); });
...@@ -89,26 +87,26 @@ describe('annotator/frame-observer', () => { ...@@ -89,26 +87,26 @@ describe('annotator/frame-observer', () => {
it('removal of the annotatable iframe triggers onFrameRemoved', async () => { it('removal of the annotatable iframe triggers onFrameRemoved', async () => {
const iframe = createAnnotatableIFrame(); const iframe = createAnnotatableIFrame();
await waitForFrameObserver(); await delay(0);
assert.calledOnce(onFrameAdded); assert.calledOnce(onFrameAdded);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe.remove(); iframe.remove();
await waitForFrameObserver(); await delay(0);
assert.calledOnce(onFrameRemoved); assert.calledOnce(onFrameRemoved);
assert.calledWith(onFrameRemoved, iframe); assert.calledWith(onFrameRemoved, iframe);
}); });
it('removal of the `enable-annotation` attribute triggers onFrameRemoved', async () => { it('removal of the `enable-annotation` attribute triggers onFrameRemoved', async () => {
const iframe = createAnnotatableIFrame(); const iframe = createAnnotatableIFrame();
await waitForFrameObserver(); await delay(0);
assert.calledOnce(onFrameAdded); assert.calledOnce(onFrameAdded);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe.removeAttribute('enable-annotation'); iframe.removeAttribute('enable-annotation');
await waitForFrameObserver(); await delay(0);
assert.calledOnce(onFrameRemoved); assert.calledOnce(onFrameRemoved);
assert.calledWith(onFrameRemoved, iframe); assert.calledWith(onFrameRemoved, iframe);
...@@ -116,12 +114,12 @@ describe('annotator/frame-observer', () => { ...@@ -116,12 +114,12 @@ describe('annotator/frame-observer', () => {
it('changing the `src` attribute triggers onFrameRemoved', async () => { it('changing the `src` attribute triggers onFrameRemoved', async () => {
const iframe = createAnnotatableIFrame(); const iframe = createAnnotatableIFrame();
await waitForFrameObserver(); await delay(0);
assert.calledOnce(onFrameAdded); assert.calledOnce(onFrameAdded);
assert.calledWith(onFrameAdded, iframe); assert.calledWith(onFrameAdded, iframe);
iframe.setAttribute('src', document.location); iframe.setAttribute('src', 'http://localhost:1');
await waitForIFrameUnload(iframe); await waitForIFrameUnload(iframe);
assert.calledOnce(onFrameRemoved); assert.calledOnce(onFrameRemoved);
...@@ -147,7 +145,7 @@ describe('annotator/frame-observer', () => { ...@@ -147,7 +145,7 @@ describe('annotator/frame-observer', () => {
// (it is not reachable) it could take longer, that's why, in addition, we // (it is not reachable) it could take longer, that's why, in addition, we
// wait for the iframe's document to completely load. // wait for the iframe's document to completely load.
await onDocumentReady(iframe); await onDocumentReady(iframe);
await waitForFrameObserver(); await delay(0);
assert.notCalled(onFrameAdded); assert.notCalled(onFrameAdded);
assert.calledOnce(console.warn); assert.calledOnce(console.warn);
......
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