From aac9d88c3ef9bbd827ee5930879e420890a59864 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Fri, 19 Sep 2025 16:31:00 +0800 Subject: [PATCH 1/3] fix: missing align style --- src/UniqueProvider/index.tsx | 5 +++- tests/unique.test.tsx | 52 ++++++++++++++++++++++++++++++++++++ 2 files changed, 56 insertions(+), 1 deletion(-) diff --git a/src/UniqueProvider/index.tsx b/src/UniqueProvider/index.tsx index 92c74867..2d8aae34 100644 --- a/src/UniqueProvider/index.tsx +++ b/src/UniqueProvider/index.tsx @@ -216,7 +216,10 @@ const UniqueProvider = ({ children }: UniqueProviderProps) => { offsetY={offsetY} popupSize={popupSize} motion={options.popupMotion} - uniqueBgClassName={options.uniqueBgClassName} + uniqueBgClassName={classNames( + options.uniqueBgClassName, + alignedClassName, + )} uniqueBgStyle={options.uniqueBgStyle} /> diff --git a/tests/unique.test.tsx b/tests/unique.test.tsx index 001a2a1b..b33c6dd9 100644 --- a/tests/unique.test.tsx +++ b/tests/unique.test.tsx @@ -211,4 +211,56 @@ describe('Trigger.Unique', () => { expect(uniqueBody).toBeTruthy(); expect(uniqueBody.className).not.toContain('undefined'); }); + + it('should combine alignedClassName with uniqueBgClassName', async () => { + const getPopupClassNameFromAlign = (align: any) => { + return `custom-align-${align.points?.[0] || 'default'}`; + }; + + const { container } = render( + + tooltip} + unique + popupPlacement="bottomLeft" + builtinPlacements={{ + bottomLeft: { + points: ['tl', 'bl'], + offset: [0, 4], + overflow: { + adjustX: 0, + adjustY: 1, + }, + }, + }} + getPopupClassNameFromAlign={getPopupClassNameFromAlign} + uniqueBgClassName="custom-bg-class" + > +
click me
+
+
, + ); + + // Initially no popup should be visible + expect(document.querySelector('.rc-trigger-popup')).toBeFalsy(); + + // Click trigger to show popup + fireEvent.click(container.querySelector('.target')); + await awaitFakeTimer(); + + // Wait a bit more for alignment to complete + await awaitFakeTimer(); + + // Check that popup exists + const popup = document.querySelector('.rc-trigger-popup'); + expect(popup).toBeTruthy(); + expect(popup.querySelector('.x-content').textContent).toBe('tooltip'); + + // Check that both custom background className and aligned className are applied to UniqueBody + const uniqueBody = document.querySelector('.rc-trigger-popup-unique-body'); + expect(uniqueBody).toBeTruthy(); + expect(uniqueBody.className).toContain('custom-bg-class'); + expect(uniqueBody.className).toContain('custom-align'); + }); }); From e65ce7778ef6887c2f0f97c5cc3a0088fa2d6c96 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Fri, 19 Sep 2025 16:43:03 +0800 Subject: [PATCH 2/3] test: simplify test case --- tests/unique.test.tsx | 44 ++++++++++++++----------------------------- 1 file changed, 14 insertions(+), 30 deletions(-) diff --git a/tests/unique.test.tsx b/tests/unique.test.tsx index b33c6dd9..0f37bc9a 100644 --- a/tests/unique.test.tsx +++ b/tests/unique.test.tsx @@ -125,9 +125,9 @@ describe('Trigger.Unique', () => { // There should only be one popup element expect(document.querySelectorAll('.rc-trigger-popup').length).toBe(1); - expect(document.querySelectorAll('.rc-trigger-popup-unique-body').length).toBe( - 1, - ); + expect( + document.querySelectorAll('.rc-trigger-popup-unique-body').length, + ).toBe(1); // FloatBg open prop should not have changed during transition (no close animation) expect(global.openChangeLog).toHaveLength(0); @@ -192,7 +192,9 @@ describe('Trigger.Unique', () => { }); it('should apply uniqueBgStyle to UniqueBody component', async () => { - await setupAndOpenPopup({ uniqueBgStyle: { backgroundColor: 'red', border: '1px solid blue' } }); + await setupAndOpenPopup({ + uniqueBgStyle: { backgroundColor: 'red', border: '1px solid blue' }, + }); // Check that UniqueBody has the custom background style const uniqueBody = document.querySelector('.rc-trigger-popup-unique-body'); @@ -213,17 +215,17 @@ describe('Trigger.Unique', () => { }); it('should combine alignedClassName with uniqueBgClassName', async () => { - const getPopupClassNameFromAlign = (align: any) => { - return `custom-align-${align.points?.[0] || 'default'}`; - }; + const getPopupClassNameFromAlign = () => 'bamboo'; - const { container } = render( + render( tooltip} unique + popupVisible popupPlacement="bottomLeft" + getPopupClassNameFromAlign={getPopupClassNameFromAlign} builtinPlacements={{ bottomLeft: { points: ['tl', 'bl'], @@ -234,33 +236,15 @@ describe('Trigger.Unique', () => { }, }, }} - getPopupClassNameFromAlign={getPopupClassNameFromAlign} - uniqueBgClassName="custom-bg-class" >
click me
, ); - // Initially no popup should be visible - expect(document.querySelector('.rc-trigger-popup')).toBeFalsy(); - - // Click trigger to show popup - fireEvent.click(container.querySelector('.target')); - await awaitFakeTimer(); - - // Wait a bit more for alignment to complete - await awaitFakeTimer(); - - // Check that popup exists - const popup = document.querySelector('.rc-trigger-popup'); - expect(popup).toBeTruthy(); - expect(popup.querySelector('.x-content').textContent).toBe('tooltip'); - - // Check that both custom background className and aligned className are applied to UniqueBody - const uniqueBody = document.querySelector('.rc-trigger-popup-unique-body'); - expect(uniqueBody).toBeTruthy(); - expect(uniqueBody.className).toContain('custom-bg-class'); - expect(uniqueBody.className).toContain('custom-align'); + expect(document.querySelector('.rc-trigger-popup')).toHaveClass('bamboo'); + expect(document.querySelector('.rc-trigger-popup-unique-body')).toHaveClass( + 'bamboo', + ); }); }); From 9fe18a1e04577dd5a9e061f26fa72804bc2a8db6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Fri, 19 Sep 2025 16:45:28 +0800 Subject: [PATCH 3/3] test: rename --- tests/unique.test.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/unique.test.tsx b/tests/unique.test.tsx index 0f37bc9a..ec6f57d2 100644 --- a/tests/unique.test.tsx +++ b/tests/unique.test.tsx @@ -214,7 +214,7 @@ describe('Trigger.Unique', () => { expect(uniqueBody.className).not.toContain('undefined'); }); - it('should combine alignedClassName with uniqueBgClassName', async () => { + it('should pass alignedClassName on unique body', async () => { const getPopupClassNameFromAlign = () => 'bamboo'; render(