Skip to content

Commit

Permalink
fix(popover): add test to verify positioning logic
Browse files Browse the repository at this point in the history
  • Loading branch information
williamernest committed Jan 31, 2024
1 parent 22059dc commit bcf8a5f
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -394,6 +394,28 @@ export default function (): void {
expect(handleVerticalAxisTwoViolationsSpy).not.toHaveBeenCalled();
expect(handleHorizontalAxisTwoViolationsSpy.calls.count()).toEqual(1);
});

it('content is rendered within the the body (y >= 0) when AXIS is HORIZONTAL and there is a BOTTOM ViewportViolation', function (this: TestContext) {
const bottomLeftViolation: ClrPopoverPosition = {
axis: ClrAxis.VERTICAL,
side: ClrSide.AFTER,
anchor: ClrAlignment.END,
content: ClrAlignment.START,
};

// Set the popover content to be as big as the window
popoverContent.style.width = '25px';
popoverContent.style.height = window.innerHeight + 'px';
// Set the anchor element to render at the bottom of the body/window
this.eventService.anchorButtonRef.nativeElement.style.bottom = '100%';
this.eventService.anchorButtonRef.nativeElement.style.position = 'absolute';
this.positionService.position = bottomLeftViolation;
document.body.appendChild(popoverContent);
const result = this.positionService.alignContent(popoverContent);

// Verify the yOffset is not a negative value (on the view this would translate to a negative top value).
expect(result.yOffset).toBeGreaterThanOrEqual(0);
});
});

describe('handles content realignment', function (this: TestContext) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,6 @@ export class ClrPopoverPositionService {
* popover rendering above the top of the body (y coordinate outside the body). In that event, it should be rendered within the body
* as much as possible, so this logic sets the top of popover to render touching the top of the body.
*/

if (this.contentOffsets.yOffset + this.currentAnchorCoords.y < 0) {
this.contentOffsets.yOffset = 0 - this.currentContentCoords.top;
}
Expand Down

0 comments on commit bcf8a5f

Please sign in to comment.