add fractional testcases

This commit is contained in:
Rene
2021-05-08 12:28:29 +02:00
parent a109bdc6b1
commit f04eaff64d
5 changed files with 33 additions and 30 deletions
@@ -266,7 +266,7 @@ export const createOverflowLifecycle = (lifecycleHub: LifecycleHub): Lifecycle =
const verticalPaddingValue = viewportPaddingStyle.paddingBottom as number;
// horizontal
viewportStyleObj.maxWidth = `calc(100% + ${hideOffsetY + horizontalMarginValue * -1}px)`;
viewportStyleObj.width = `calc(100% + ${hideOffsetY + horizontalMarginValue * -1}px)`;
viewportStyleObj[horizontalMarginKey] = -hideOffsetY + horizontalMarginValue;
// vertical
@@ -420,7 +420,7 @@ export const createOverflowLifecycle = (lifecycleHub: LifecycleHub): Lifecycle =
marginRight: 0,
marginBottom: 0,
marginLeft: 0,
maxWidth: '',
width: '',
overflowY: '',
overflowX: '',
};
@@ -433,12 +433,10 @@ export const createOverflowLifecycle = (lifecycleHub: LifecycleHub): Lifecycle =
fixFlexboxGlue(viewportOverflowState, !!heightIntrinsic);
}
// TODO: enlargen viewport if div too small for firefox scrollbar hiding behavior
// TODO: hide host overflow if scroll x or y and no padding element there
// TODO: Test without content
// TODO: Test without padding
// TODO: overflow: visible on padding / host if overflow visible on both axis
// TODO: change lifecyclehub communication to single object & assign
style(_viewport, viewportStyle);
@@ -45,7 +45,7 @@ export const createPaddingLifecycle = (lifecycleHub: LifecycleHub): Lifecycle =>
right: 0,
bottom: 0,
left: 0,
maxWidth: paddingRelative ? `calc(100% + ${paddingHorizontal}px)` : '',
width: paddingRelative ? `calc(100% + ${paddingHorizontal}px)` : '',
};
const viewportStyle: StyleObject = {
paddingTop: paddingRelative ? padding!.t : 0,
@@ -89,7 +89,6 @@
padding: 0;
margin: 0;
border: none;
max-width: 100%;
z-index: 0;
}
@@ -100,7 +100,7 @@ const plusMinusArr = (original: number, plusMinus: number) => {
// @ts-ignore
const msie11 = !!window.MSInputMethodContext && !!document.documentMode;
const msedge = window.navigator.userAgent.indexOf('Edge') > -1;
const msedge = window.navigator.userAgent.toLowerCase().indexOf('edge') > -1;
msie11 && addClass(document.body, 'msie11');
@@ -234,10 +234,10 @@ const checkMetrics = async (checkComparison: CheckComparisonObj) => {
should.equal(osInstance.state()._overflowAmount.w, comparisonMetrics.scroll.width, 'Overflow amount width equality.');
should.equal(osInstance.state()._overflowAmount.h, comparisonMetrics.scroll.height, 'Overflow amount height equality.');
}
//should.equal(targetMetrics.hasOverflow.x, comparisonMetrics.hasOverflow.x, 'Has overflow x equality.');
//should.equal(targetMetrics.hasOverflow.y, comparisonMetrics.hasOverflow.y, 'Has overflow y equality.');
should.equal(targetMetrics.hasOverflow.x, comparisonMetrics.hasOverflow.x, 'Has overflow x equality.');
should.equal(targetMetrics.hasOverflow.y, comparisonMetrics.hasOverflow.y, 'Has overflow y equality.');
}
if (targetMetrics.hasOverflow.x) {
should.equal(style(targetViewport!, 'overflowX'), 'scroll', 'Overflow-X should result in scroll.');
@@ -262,6 +262,11 @@ const checkMetrics = async (checkComparison: CheckComparisonObj) => {
should.equal(targetMetrics.endElm.height, comparisonMetrics.endElm.height, 'End Elements height equality.');
await timeout(1);
// steady pace for ie11 or it will freeze progressively
if (msie11) {
await timeout(25);
}
});
};
@@ -396,17 +401,19 @@ const overflowTest = async () => {
height: comparison!.scrollHeight - comparison!.clientHeight,
};
if (width) {
should.ok(overflowAmountCheck.width >= addOverflow, 'Correct smallest possible overflow width.');
} else {
should.equal(overflowAmountCheck.width, 0, 'Correct smallest possible overflow width.');
}
await waitForOrFailTest(() => {
if (width) {
should.ok(overflowAmountCheck.width >= addOverflow, 'Correct smallest possible overflow width.');
} else {
should.equal(overflowAmountCheck.width, 0, 'Correct smallest possible overflow width.');
}
if (height) {
should.ok(overflowAmountCheck.height >= addOverflow, 'Correct smallest possible overflow height.');
} else {
should.equal(overflowAmountCheck.height, 0, 'Correct smallest possible overflow height.');
}
if (height) {
should.ok(overflowAmountCheck.height >= addOverflow, 'Correct smallest possible overflow height.');
} else {
should.equal(overflowAmountCheck.height, 0, 'Correct smallest possible overflow height.');
}
});
style(targetResize, styleObj);
@@ -458,13 +465,11 @@ const overflowTest = async () => {
await iterateHeight(async () => {
await iterateWidth(async () => {
await iterateBorder(async () => {
// assume this part isn't critical for IE11, to boost test speed
// assume this part isn't critical
/*
if (!msie11) {
await iterateFloat(async () => {
await iterateMargin();
});
}
await iterateFloat(async () => {
await iterateMargin();
});
*/
await iteratePadding(async () => {
@@ -234,10 +234,10 @@ body {
}
.minMaxFixed > .container {
min-height: 180px;
min-width: 180px;
max-height: 420px;
max-width: 420px;
min-height: 180.5px;
min-width: 180.5px;
max-height: 420.3px;
max-width: 420.8px;
}
.minMaxNone > .container {
@@ -307,6 +307,7 @@ body {
.os-environment,
.os-viewport {
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
}