Added tall and wide test cases, improved synchronization and test refactoring

This commit is contained in:
houseofyin 2013-03-23 21:06:38 -04:00
parent 0c94007ed0
commit 81fd8114f6

View File

@ -1,5 +1,4 @@
QUnit.config.autostart = false; QUnit.config.autostart = false;
QUnit.config.testTimeout = 5000;
(function () { (function () {
var viewer = null; var viewer = null;
@ -8,262 +7,347 @@ QUnit.config.testTimeout = 5000;
start(); start();
}); });
var assessNumericValueWithSomeVariance = function (value1, value2, variance, message) var assessNumericValueWithSomeVariance = function (value1, value2, variance, message) {
{ var varianceAsPortionOfTargetValue = Math.max(.03, Math.abs(value1 * variance));
ok(Math.abs (value1 - value2) <= variance, message + " " + value1 + ":" + value2); ok(Math.abs(value1 - value2) <= varianceAsPortionOfTargetValue, message + " Expected:" + value1 + " Found: " + value2 + " Variance: " + varianceAsPortionOfTargetValue);
}; };
var assessNavigatorLocation = function (expectedX, expectedY) var assessNavigatorLocation = function (expectedX, expectedY) {
{
var navigator = $(".navigator"); var navigator = $(".navigator");
assessNumericValueWithSomeVariance(expectedX,navigator.offset().left,5,status + ' Navigator x position'); assessNumericValueWithSomeVariance(expectedX, navigator.offset().left, .1, ' Navigator x position');
assessNumericValueWithSomeVariance(expectedY,navigator.offset().top,5,status +' Navigator y position'); assessNumericValueWithSomeVariance(expectedY, navigator.offset().top, .1, ' Navigator y position');
}; };
var assessNavigatorDisplayRegionAndMainViewerState = function (theViewer, theNavigatorSelector, theDisplayRegionSelector, status) var assessNavigatorDisplayRegionAndMainViewerState = function (theViewer, theDisplayRegionSelector, status) {
{
var navigator = $(theNavigatorSelector);
var displayRegion = $(theDisplayRegionSelector); var displayRegion = $(theDisplayRegionSelector);
var mainViewerBounds = theViewer.viewport.getBounds(); var mainViewerBounds = theViewer.viewport.getBounds();
var borderSpaceInPixels = new OpenSeadragon.Point(theViewer.navigator.borderWidth * 2, theViewer.navigator.borderWidth * 2);
//TODO These calculation need to be tweaked for non-square images var displayTopLeftLocationInPixels = new OpenSeadragon.Point(displayRegion.position().left, displayRegion.position().top);
assessNumericValueWithSomeVariance(mainViewerBounds.width,displayRegion.width() / navigator.width(),.025,status + ' Width synchronization'); var displayRegionDimensionsInPixels = new OpenSeadragon.Point((displayRegion.width()),(displayRegion.height()))
assessNumericValueWithSomeVariance(mainViewerBounds.height,displayRegion.height() / navigator.height(),.025,status +' Height synchronization'); .plus(borderSpaceInPixels);
assessNumericValueWithSomeVariance(mainViewerBounds.x,displayRegion.position().left / navigator.width(),.025,status + ' Left synchronization'); var displayBottomRightLocationInPixels = displayTopLeftLocationInPixels.plus(displayRegionDimensionsInPixels);
assessNumericValueWithSomeVariance(mainViewerBounds.y,displayRegion.position().top /navigator.height(),.025,status + ' Top synchronization');
var displayLocationInPoints = theViewer.navigator.viewport.pointFromPixel(displayTopLeftLocationInPixels);
var displayRegionDimensionsInPoints = theViewer.navigator.viewport.pointFromPixel(displayBottomRightLocationInPixels).minus(displayLocationInPoints);
assessNumericValueWithSomeVariance(mainViewerBounds.width, displayRegionDimensionsInPoints.x, .05, status + ' Width synchronization');
assessNumericValueWithSomeVariance(mainViewerBounds.height, displayRegionDimensionsInPoints.y, .05, status + ' Height synchronization');
assessNumericValueWithSomeVariance(mainViewerBounds.x, displayLocationInPoints.x, .05, status + ' Left synchronization');
assessNumericValueWithSomeVariance(mainViewerBounds.y, displayLocationInPoints.y, .05, status + ' Top synchronization');
}; };
var filterToDetectThatDisplayRegionHasBeenDrawn = function () { var filterToDetectThatDisplayRegionHasBeenDrawn = function () {
var self = $(this); var self = $(this);
OpenSeadragon.console.log( "Checking:" + self.html + "\n");
return self.width() > 0 && return self.width() > 0 &&
self.height() > 0 && self.height() > 0 &&
(typeof self.position !== 'undefined'); (typeof self.position() !== 'undefined');
}; };
var waitUntilFilterSatisfied = function () { var waitUntilFilterSatisfied = function () {
return function () { return function () {
var found = false;
var cancel = false;
return function (selector, filterfunction, handler, recursiveCall, count) { return function (selector, filterfunction, handler, recursiveCall, count) {
if (recursiveCall !== true) var found;
{ if (recursiveCall !== true) {
found = false;
cancel = false;
count = 0; count = 0;
} }
var $this = $(selector).filter(filterfunction); var $this = $(selector).filter(filterfunction);
found = found || $this.length > 0; found = found || $this.length > 0;
if (!found && !cancel && count < 20) { if (!found && count < 20) {
setTimeout(function () { setTimeout(function () {
count++; count++;
waitUntilFilterSatisfied(selector, filterfunction, handler, true, count); waitUntilFilterSatisfied(selector, filterfunction, handler, true, count);
}, 50) }, 50)
} }
else { else {
if (!cancel) {
cancel = true;
handler(); handler();
} }
return $this;
}
return $this;
}; };
}(); }();
}(); }();
var waitForDrawer = function () { var waitForViewer = function () {
return function () { return function () {
var drawerDone = false; return function (theViewer, handler, targetPropery, viewportFunctionToInspectTargetProperty, recursiveCall, count) {
var cancel = false; var propertyAchieved = false;
return function (theViewer, handler, recursiveCall, count) { if (recursiveCall !== true) {
if (recursiveCall !== true)
{
drawerDone = false;
cancel = false;
count = 0; count = 0;
} }
drawerDone = drawerDone || !theViewer.drawer.needsUpdate(); if (typeof viewportFunctionToInspectTargetProperty === "function") {
if (!drawerDone && !cancel && count < 20) { try
{
propertyAchieved = targetPropery === viewportFunctionToInspectTargetProperty.call(theViewer.viewport, true);
}
catch(err)
{
//Ignore. Subsequent code will try again shortly
}
}
if ((theViewer.drawer === null || theViewer.drawer.needsUpdate() || !propertyAchieved) && count < 40) {
count++; count++;
setTimeout(function () { setTimeout(function () {
waitForDrawer(theViewer, handler, true, count); waitForViewer(theViewer, handler, targetPropery, viewportFunctionToInspectTargetProperty, true, count);
}, 50) }, 50)
} }
else { else {
if (!cancel) {
cancel = true;
handler(); handler();
} }
return;
}
return;
}; };
}(); }();
}(); }();
var assessNavigatorViewerPlacement = function (seadragonProperties, testProperties) {
viewer = OpenSeadragon(seadragonProperties);
var assessNavigatorAfterDrag = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer, testProperties.displayRegionLocator, "After pan");
start();
};
var assessNavigatorAfterZoom = function () {
var target = new OpenSeadragon.Point(0.4, 0.4);
assessNavigatorDisplayRegionAndMainViewerState(viewer, testProperties.displayRegionLocator, "After image zoom");
viewer.viewport.panTo(target);
waitForViewer(viewer, assessNavigatorAfterDrag, target, viewer.viewport.getCenter);
};
var captureInitialStateAfterOpenAndThenAct = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer, testProperties.displayRegionLocator, "After image load");
testProperties.determineExpectationsAndAssessNavigatorLocation(seadragonProperties, testProperties);
viewer.viewport.zoomTo(viewer.viewport.getZoom() * 2);
waitForViewer(viewer, assessNavigatorAfterZoom, 2, viewer.viewport.getZoom);
};
var proceedOnceTheIntialImagesAreLoaded = function () {
waitUntilFilterSatisfied(testProperties.displayRegionLocator, filterToDetectThatDisplayRegionHasBeenDrawn, captureInitialStateAfterOpenAndThenAct);
};
var waitForNavigator = function () {
waitForViewer(viewer.navigator, proceedOnceTheIntialImagesAreLoaded);
};
var openHandler = function () {
viewer.removeHandler('open', openHandler);
waitForViewer(viewer, waitForNavigator);
};
viewer.addHandler('open', openHandler);
};
module("navigator", { module("navigator", {
setup:function () { setup:function () {
QUnit.config.testTimeout = 5000; //TODO This is alonger than is ideal so the tests will pass cleanly under Safari
if ($('#exampleNavigator').is(':ui-dialog')) QUnit.config.testTimeout = 20000;
{ if (viewer != null) {
viewer.close();
}
if ($('#exampleNavigator').is(':ui-dialog')) {
$('#exampleNavigator').dialog('destroy'); $('#exampleNavigator').dialog('destroy');
} }
$("#exampleNavigator").remove();
$(".navigator").remove();
$("#example").empty(); $("#example").empty();
$("#exampleNavigator").empty(); $("#tallexample").empty();
}, teardown: function() { $("#wideexample").empty();
viewer.removeAllHandlers('animationfinish'); $("#example").parent().append('<div id="exampleNavigator"></div>');
} }
}); });
asyncTest('ZoomAndDragOnCustomNavigatorLocation', function () { asyncTest('ZoomAndDragOnCustomNavigatorLocation', function () {
viewer = OpenSeadragon({ assessNavigatorViewerPlacement({
id:'example', id:'example',
navigatorId:'exampleNavigator', navigatorId:'exampleNavigator',
prefixUrl:'/build/openseadragon/images/', prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/testpattern.dzi', tileSources:'/test/data/testpattern.dzi',
showNavigator:true showNavigator:true
}); },
{
var assessNavigatorAfterDrag = function () { displayRegionLocator:'#exampleNavigator .displayregion',
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After pan"); navigatorLocator:'#exampleNavigator',
start(); determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
}; var mainViewerElement = $("#" + seadragonProperties.id);
var assessNavigatorAfterZoom = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After image zoom");
viewer.viewport.panTo(new OpenSeadragon.Point(0.1, 0.1));
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterDrag)},1000);
};
var captureInitialStateAfterOpenAndThenAct = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After image load");
var mainViewerElement = $('#example');
assessNavigatorLocation(mainViewerElement.offset().left, assessNavigatorLocation(mainViewerElement.offset().left,
mainViewerElement.offset().top + mainViewerElement.height()); mainViewerElement.offset().top + mainViewerElement.height());
}
viewer.viewport.zoomTo(2);
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterZoom)},1000);
};
var proceedOnceTheIntialImagesAreLoaded = function () {
waitUntilFilterSatisfied('#exampleNavigator .displayregion', filterToDetectThatDisplayRegionHasBeenDrawn, captureInitialStateAfterOpenAndThenAct);
};
var waitForNavigator = function () {
waitForDrawer(viewer.navigator, proceedOnceTheIntialImagesAreLoaded);
};
var openHandler = function () {
viewer.removeHandler('open',openHandler );
waitForDrawer(viewer, waitForNavigator);
};
viewer.addHandler('open', openHandler);
}); });
asyncTest('NavigatorOnJQueryDialog', function () {
$('#exampleNavigator').dialog();
viewer = OpenSeadragon({
id:'example',
navigatorId:'exampleNavigator',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/testpattern.dzi',
showNavigator:true
});
var assessNavigatorAfterDrag = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After pan");
start();
};
var assessNavigatorAfterZoom = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After image zoom");
viewer.viewport.panTo(new OpenSeadragon.Point(0.1, 0.1));
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterDrag)},1000);
};
var captureInitialStateAfterOpenAndThenAct = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,"#exampleNavigator",".displayregion", "After image load");
var jqueryDialog = $('#exampleNavigator');
assessNavigatorLocation(jqueryDialog.offset().left,
jqueryDialog.offset().top);
viewer.viewport.zoomTo(2);
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterZoom)},1000);
};
var proceedOnceTheIntialImagesAreLoaded = function () {
waitUntilFilterSatisfied('#exampleNavigator .displayregion', filterToDetectThatDisplayRegionHasBeenDrawn, captureInitialStateAfterOpenAndThenAct);
};
var waitForNavigator = function () {
waitForDrawer(viewer.navigator, proceedOnceTheIntialImagesAreLoaded);
};
var openHandler = function () {
viewer.removeHandler('open',openHandler );
waitForDrawer(viewer, waitForNavigator);
};
viewer.addHandler('open', openHandler);
}); });
asyncTest('DefaultNavigatorLocation', function () { asyncTest('DefaultNavigatorLocation', function () {
viewer = OpenSeadragon({ assessNavigatorViewerPlacement({
id:'example', id:'example',
prefixUrl:'/build/openseadragon/images/', prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/testpattern.dzi', tileSources:'/test/data/testpattern.dzi',
showNavigator:true showNavigator:true
}); },
{
var assessNavigatorAfterDrag = function () { displayRegionLocator:'.navigator .displayregion',
assessNavigatorDisplayRegionAndMainViewerState(viewer,".navigator",".displayregion", "After pan"); navigatorLocator:'.navigator',
start(); determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
}; var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
var assessNavigatorAfterZoom = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,".navigator",".displayregion", "After image zoom");
viewer.viewport.panTo(new OpenSeadragon.Point(0.1, 0.1));
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterDrag)},1000);
};
var captureInitialStateAfterOpenAndThenAct = function () {
assessNavigatorDisplayRegionAndMainViewerState(viewer,".navigator",".displayregion", "After image load");
var mainViewerElement = $('#example');
var navigatorElement = $('.navigator');
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(), assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top); mainViewerElement.offset().top);
}
});
});
viewer.viewport.zoomTo(2); asyncTest('NavigatorOnJQueryDialog', function () {
setTimeout(function() {waitForDrawer(viewer.navigator, assessNavigatorAfterZoom)},1000); assessNavigatorViewerPlacement({
}; id:'example',
navigatorId:'exampleNavigator',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/testpattern.dzi',
showNavigator:true
},
{
displayRegionLocator:'#exampleNavigator .displayregion',
navigatorLocator:'#exampleNavigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var jqueryDialog = $(testProperties.navigatorLocator);
assessNavigatorLocation(jqueryDialog.offset().left,
jqueryDialog.offset().top);
}
});
});
var proceedOnceTheIntialImagesAreLoaded = function () { asyncTest('DefaultNavigatorLocationWithWideImageSquareViewer', function () {
waitUntilFilterSatisfied('.navigator .displayregion', filterToDetectThatDisplayRegionHasBeenDrawn, captureInitialStateAfterOpenAndThenAct); assessNavigatorViewerPlacement({
}; id:'example',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/wide.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
var waitForNavigator = function () { asyncTest('DefaultNavigatorLocationWithWideImageTallViewer', function () {
waitForDrawer(viewer.navigator, proceedOnceTheIntialImagesAreLoaded); assessNavigatorViewerPlacement({
}; id:'tallexample',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/wide.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
var openHandler = function () { asyncTest('DefaultNavigatorLocationWithWideImageWideViewer', function () {
viewer.removeHandler('open',openHandler ); assessNavigatorViewerPlacement({
waitForDrawer(viewer, waitForNavigator); id:'wideexample',
}; prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/wide.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
viewer.addHandler('open', openHandler); asyncTest('DefaultNavigatorLocationWithTallImageSquareViewer', function () {
assessNavigatorViewerPlacement({
id:'example',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/tall.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
asyncTest('DefaultNavigatorLocationWithTallImageSquareViewer', function () {
assessNavigatorViewerPlacement({
id:'example',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/tall.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
asyncTest('DefaultNavigatorLocationWithTallImageSquareViewer', function () {
assessNavigatorViewerPlacement({
id:'tallexample',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/tall.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
});
asyncTest('DefaultNavigatorLocationWithTallImageWideViewer', function () {
assessNavigatorViewerPlacement({
id:'wideexample',
prefixUrl:'/build/openseadragon/images/',
tileSources:'/test/data/tall.dzi',
showNavigator:true
},
{
displayRegionLocator:'.navigator .displayregion',
navigatorLocator:'.navigator',
determineExpectationsAndAssessNavigatorLocation:function (seadragonProperties, testProperties) {
var mainViewerElement = $("#" + seadragonProperties.id);
var navigatorElement = $(testProperties.navigatorLocator);
assessNavigatorLocation(mainViewerElement.offset().left + mainViewerElement.width() - navigatorElement.width(),
mainViewerElement.offset().top);
}
});
}); });
@ -273,7 +357,6 @@ QUnit.config.testTimeout = 5000;
//Other tests that require additional sample images //Other tests that require additional sample images
//Switch content, make sure things work //Switch content, make sure things work
//Try images with different shapes (i.e. including wide and tall)
//Other tests that require a reasonable event simulation approachj //Other tests that require a reasonable event simulation approachj
//Test autohide //Test autohide