Skip to content
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions src/hooks/useAlign.ts
Original file line number Diff line number Diff line change
Expand Up @@ -213,13 +213,15 @@ export default function useAlign(
} else {
const rect = target.getBoundingClientRect();
targetRect = {
x: rect.x,
y: rect.y,
x: rect.x || rect.left,
y: rect.y || rect.top,
width: rect.width,
height: rect.height,
};
}
const popupRect = popupElement.getBoundingClientRect();
popupRect.x = popupRect.x || popupRect.left;
popupRect.y = popupRect.y || popupRect.top;
const {
clientWidth,
clientHeight,
Expand Down
78 changes: 78 additions & 0 deletions tests/rect.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
import { cleanup, render } from '@testing-library/react';
import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
import React from 'react';
import Trigger from '../src';
import { awaitFakeTimer } from './util';

describe('Trigger.Rect', () => {
let targetVisible = true;

let rectX = 100;
let rectY = 100;
let rectWidth = 100;
let rectHeight = 100;

beforeAll(() => {
spyElementPrototypes(HTMLDivElement, {
getBoundingClientRect: () => ({
left: rectX,
top: rectY,
width: rectWidth,
height: rectHeight,
right: 200,
bottom: 200,
}),
});

spyElementPrototypes(HTMLElement, {
offsetParent: {
get: () => (targetVisible ? document.body : null),
},
});
spyElementPrototypes(SVGElement, {
offsetParent: {
get: () => (targetVisible ? document.body : null),
},
});
});

beforeEach(() => {
targetVisible = true;

rectX = 100;
rectY = 100;
rectWidth = 100;
rectHeight = 100;

jest.useFakeTimers();
});

afterEach(() => {
cleanup();
jest.useRealTimers();
});

it('getBoundingClientRect top and left', async () => {
render(
<Trigger
popupVisible
popup={<span className="bamboo" />}
popupAlign={{
points: ['bc', 'tc'],
_experimental: {
dynamicInset: true,
},
}}
>
<div />
</Trigger>,
);

await awaitFakeTimer();

expect(document.querySelector('.rc-trigger-popup')).toHaveStyle({
bottom: `100px`,
});
});

});
Loading