From d1273f86c430ed2285e676c964027acc6f074822 Mon Sep 17 00:00:00 2001
From: Rene Haas <hren@xxxlgroup.com>
Date: Fri, 14 May 2021 13:25:34 +0200
Subject: [PATCH] stable overflow tests for fractional devicepixelratio

---
 .../src/lifecycles/overflowLifecycle.ts       |  1 +
 .../structureLifecycle/index.browser.ts       | 31 ++++++++++++++-----
 2 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/packages/overlayscrollbars/src/lifecycles/overflowLifecycle.ts b/packages/overlayscrollbars/src/lifecycles/overflowLifecycle.ts
index ec3b706..74825fb 100644
--- a/packages/overlayscrollbars/src/lifecycles/overflowLifecycle.ts
+++ b/packages/overlayscrollbars/src/lifecycles/overflowLifecycle.ts
@@ -58,6 +58,7 @@ const sizeFraction = (elm: HTMLElement): WH<number> => {
     h: viewportRect.height - viewportOffsetSize.h,
   };
 };
+const isFractionalPixelRatio = () => window.devicePixelRatio % 1 !== 0;
 const setAxisOverflowStyle = (horizontal: boolean, overflowAmount: number, behavior: OverflowBehavior, styleObj: StyleObject) => {
   const overflowKey: keyof StyleObject = horizontal ? 'overflowX' : 'overflowY';
   const behaviorIsVisible = behavior.indexOf('visible') === 0;
diff --git a/packages/overlayscrollbars/tests/browser/lifecycles/structureLifecycle/index.browser.ts b/packages/overlayscrollbars/tests/browser/lifecycles/structureLifecycle/index.browser.ts
index 940090c..a2ea420 100644
--- a/packages/overlayscrollbars/tests/browser/lifecycles/structureLifecycle/index.browser.ts
+++ b/packages/overlayscrollbars/tests/browser/lifecycles/structureLifecycle/index.browser.ts
@@ -96,7 +96,11 @@ const metricsDimensionsEqual = (a: Metrics, b: Metrics) => {
 };
 
 const plusMinusArr = (original: number, plusMinus: number) => {
-  return [original, original + plusMinus, original - plusMinus];
+  const arr = Array.from(Array(plusMinus).keys())
+    .map((_, index) => original + (index + 1))
+    .concat(Array.from(Array(plusMinus).keys()).map((_, index) => original - (index + 1)));
+  arr.push(original);
+  return arr;
 };
 
 // @ts-ignore
@@ -108,6 +112,7 @@ msie11 && addClass(document.body, 'msie11');
 const useContentElement = false;
 const fixedDigits = msie11 ? 1 : 3;
 const fixedDigitsOffset = 3;
+const fractionalPixelRatioTollerance = 2;
 
 const startBtn: HTMLButtonElement | null = document.querySelector('#start');
 const target: HTMLElement | null = document.querySelector('#target');
@@ -218,16 +223,26 @@ const checkMetrics = async (checkComparison: CheckComparisonObj) => {
     should.equal(targetMetrics.size.height, comparisonMetrics.size.height, 'Size height equality.');
 
     if (isFractionalPixelRatio()) {
-      should.ok(plusMinusArr(targetMetrics.scroll.width, 1).indexOf(comparisonMetrics.scroll.width) > -1, 'Scroll width equality. (+-1)');
-      should.ok(plusMinusArr(targetMetrics.scroll.height, 1).indexOf(comparisonMetrics.scroll.height) > -1, 'Scroll height equality. (+-1)');
-
       should.ok(
-        plusMinusArr(osInstance.state()._overflowAmount.w, 1).indexOf(comparisonMetrics.scroll.width) > -1,
-        'Overflow amount width equality. (+-1)'
+        plusMinusArr(targetMetrics.scroll.width, fractionalPixelRatioTollerance).indexOf(comparisonMetrics.scroll.width) > -1,
+        `Scroll width equality. (+-${fractionalPixelRatioTollerance}) | Target: ${targetMetrics.scroll.width} | Comparison: ${comparisonMetrics.scroll.width}`
       );
       should.ok(
-        plusMinusArr(osInstance.state()._overflowAmount.h, 1).indexOf(comparisonMetrics.scroll.height) > -1,
-        'Overflow amount height equality. (+-1)'
+        plusMinusArr(targetMetrics.scroll.height, fractionalPixelRatioTollerance).indexOf(comparisonMetrics.scroll.height) > -1,
+        `Scroll height equality. (+-${fractionalPixelRatioTollerance}) | Target: ${targetMetrics.scroll.height} | Comparison: ${comparisonMetrics.scroll.height}`
+      );
+
+      should.ok(
+        plusMinusArr(osInstance.state()._overflowAmount.w, fractionalPixelRatioTollerance).indexOf(comparisonMetrics.scroll.width) > -1,
+        `Overflow amount width equality. (+-${fractionalPixelRatioTollerance}) | Amount: ${osInstance.state()._overflowAmount.w} | Comparison: ${
+          comparisonMetrics.scroll.width
+        }`
+      );
+      should.ok(
+        plusMinusArr(osInstance.state()._overflowAmount.h, fractionalPixelRatioTollerance).indexOf(comparisonMetrics.scroll.height) > -1,
+        `Overflow amount height equality. (+-${fractionalPixelRatioTollerance}) | Amount: ${osInstance.state()._overflowAmount.h} | Comparison: ${
+          comparisonMetrics.scroll.height
+        }`
       );
     } else {
       should.equal(targetMetrics.scroll.width, comparisonMetrics.scroll.width, 'Scroll width equality.');