From 85cfe6b80a8868bca1ba2aa391a8b63c67f562e0 Mon Sep 17 00:00:00 2001
From: Ivan Stefanov <ivan.stefanov90@gmail.com>
Date: Sun, 29 Sep 2024 08:57:23 +0300
Subject: [PATCH] fix: get correct values from 'getTabSize' in older browsers
 (#694)

Co-authored-by: Ivan Stefanov <ivan.stefanov@chaos.com>
---
 src/TabNavList/index.tsx |  6 +++---
 tests/overflow.test.tsx  | 12 ++++++------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/TabNavList/index.tsx b/src/TabNavList/index.tsx
index 0d377fb4..2b5e8852 100644
--- a/src/TabNavList/index.tsx
+++ b/src/TabNavList/index.tsx
@@ -57,14 +57,14 @@ export interface TabNavListProps {
   };
 }
 
-const getTabSize = (tab: HTMLElement, containerRect: { x: number; y: number }) => {
+const getTabSize = (tab: HTMLElement, containerRect: { left: number; top: number }) => {
   // tabListRef
   const { offsetWidth, offsetHeight, offsetTop, offsetLeft } = tab;
-  const { width, height, x, y } = tab.getBoundingClientRect();
+  const { width, height, left, top } = tab.getBoundingClientRect();
 
   // Use getBoundingClientRect to avoid decimal inaccuracy
   if (Math.abs(width - offsetWidth) < 1) {
-    return [width, height, x - containerRect.x, y - containerRect.y];
+    return [width, height, left - containerRect.left, top - containerRect.top];
   }
 
   return [offsetWidth, offsetHeight, offsetLeft, offsetTop];
diff --git a/tests/overflow.test.tsx b/tests/overflow.test.tsx
index 981d6ab9..509bbae6 100644
--- a/tests/overflow.test.tsx
+++ b/tests/overflow.test.tsx
@@ -21,7 +21,7 @@ describe('Tabs.Overflow', () => {
 
   let mockGetBoundingClientRect: (
     ele: HTMLElement,
-  ) => { x: number; y: number; width: number; height: number } | void = null;
+  ) => { left: number; top: number; width: number; height: number } | void = null;
 
   beforeEach(() => {
     mockGetBoundingClientRect = null;
@@ -49,8 +49,8 @@ describe('Tabs.Overflow', () => {
       getBoundingClientRect() {
         return (
           mockGetBoundingClientRect?.(this) || {
-            x: 0,
-            y: 0,
+            left: 0,
+            top: 0,
             width: 0,
             height: 0,
           }
@@ -526,8 +526,8 @@ describe('Tabs.Overflow', () => {
     mockGetBoundingClientRect = ele => {
       if (ele.classList.contains('rc-tabs-tab')) {
         const sharedRect = {
-          x: 0,
-          y: 0,
+          left: 0,
+          top: 0,
           width: 14.5,
           height: 14.5,
         };
@@ -538,7 +538,7 @@ describe('Tabs.Overflow', () => {
             }
           : {
               ...sharedRect,
-              x: 14.5,
+              left: 14.5,
             };
       }
       // console.log('ele!!!', ele.className);