make onResize method not round dimensions

src/dom.js

@@ -1014,8 +1014,9 @@ type OnResizeOptions = {|
 |};
 
 export function onResize(el : HTMLElement, handler : ({| width : number, height : number |}) => void, { width = true, height = true, interval = 100, win = window } : OnResizeOptions = {}) : {| cancel : () => void |} {
-    let currentWidth = el.offsetWidth;
-    let currentHeight = el.offsetHeight;
+    const currentRect = el.getBoundingClientRect();
+    let currentWidth = currentRect.width;
+    let currentHeight = currentRect.height;
     let canceled = false;
 
     handler({ width: currentWidth, height: currentHeight });
@@ -1025,8 +1026,9 @@ export function onResize(el : HTMLElement, handler : ({| width : number, height
             return;
         }
 
-        const newWidth = el.offsetWidth;
-        const newHeight = el.offsetHeight;
+        const newRect = el.getBoundingClientRect();
+        const newWidth = newRect.width;
+        const newHeight = newRect.height;
 
         if ((width && newWidth !== currentWidth) || (height && newHeight !== currentHeight)) {
             handler({ width: newWidth, height: newHeight });

test/tests/dom/index.js

@@ -12,3 +12,4 @@ import './getCurrentScriptUID';
 import './submitForm';
 import './getBody';
 import './popup';
+import './onResize';

test/tests/dom/onResize.js

@@ -0,0 +1,52 @@
+import { onResize } from '../../../src';
+
+const setupTest = () => {
+  document.body.innerHTML = '';
+  const div = document.createElement('div');
+  div.style.width = '200.43px';
+  div.style.height = '100.72px';
+  document.body.appendChild(div);
+
+  return { el: div };
+};
+
+const isAlmostEqual = (valueA, valueB, marginOfError = 0.02) => {
+  if (valueA === valueB) return true;
+  if (valueA > valueB && valueA < valueB + marginOfError) {
+    return true;
+  }
+  if (valueA < valueB && valueA > valueB - marginOfError) {
+    return true;
+  }
+  return false;
+};
+
+describe('onResize cases', () => {
+  it('should call handler width correct element dimension', () => {
+    const { el } = setupTest();
+
+    let handlerCalledSuccessfully = false;
+
+    const handler = (dimension) => {
+      const expectedDimension = { width: 200.43, height: 100.72 };
+
+      if (
+        !isAlmostEqual(dimension.width, expectedDimension.width) ||
+        !isAlmostEqual(dimension.height, expectedDimension.height)
+      ) {
+        throw new Error(
+          `Expected handler to have been with ${JSON.stringify(
+            expectedDimension
+          )} but it was ${JSON.stringify(dimension)}`
+        );
+      }
+      handlerCalledSuccessfully = true;
+    };
+
+    onResize(el, handler);
+
+    if (!handlerCalledSuccessfully) {
+      throw new Error('Handler function was not called');
+    }
+  });
+});