@@ -1777,6 +1777,47 @@ describe('FlexibleConnectedPositionStrategy', () => {
1777
1777
document . body . removeChild ( veryLargeElement ) ;
1778
1778
} ) ;
1779
1779
1780
+ it ( 'should size the bounding box correctly when opening downwards on a scrolled page' , ( ) => {
1781
+ const viewportMargin = 10 ;
1782
+ const veryLargeElement : HTMLElement = document . createElement ( 'div' ) ;
1783
+ veryLargeElement . style . width = '4000px' ;
1784
+ veryLargeElement . style . height = '4000px' ;
1785
+ document . body . appendChild ( veryLargeElement ) ;
1786
+ window . scroll ( 2100 , 2100 ) ;
1787
+
1788
+ originElement . style . position = 'fixed' ;
1789
+ originElement . style . top = '100px' ;
1790
+ originElement . style . left = '200px' ;
1791
+
1792
+ positionStrategy
1793
+ . withFlexibleDimensions ( )
1794
+ . withPush ( false )
1795
+ . withViewportMargin ( viewportMargin )
1796
+ . withPositions ( [ {
1797
+ overlayY : 'top' ,
1798
+ overlayX : 'start' ,
1799
+ originY : 'bottom' ,
1800
+ originX : 'start'
1801
+ } ] ) ;
1802
+
1803
+ attachOverlay ( { positionStrategy} ) ;
1804
+
1805
+ const boundingBox = overlayContainer
1806
+ . getContainerElement ( )
1807
+ . querySelector ( '.cdk-overlay-connected-position-bounding-box' ) as HTMLElement ;
1808
+
1809
+ // Use the `documentElement` here to determine the viewport
1810
+ // height since it's what is used by the overlay.
1811
+ const viewportHeight = document . documentElement ! . clientHeight - ( 2 * viewportMargin ) ;
1812
+ const originRect = originElement . getBoundingClientRect ( ) ;
1813
+ const boundingBoxRect = boundingBox . getBoundingClientRect ( ) ;
1814
+
1815
+ expect ( Math . floor ( boundingBoxRect . height ) )
1816
+ . toBe ( Math . floor ( viewportHeight - originRect . bottom + viewportMargin ) ) ;
1817
+
1818
+ window . scroll ( 0 , 0 ) ;
1819
+ document . body . removeChild ( veryLargeElement ) ;
1820
+ } ) ;
1780
1821
1781
1822
} ) ;
1782
1823
0 commit comments