Create the test like this:
var items = [];
for ( var i = 0; i < 100; i++ ) {
items[i] = new OO.ui.MenuOptionWidget( { data: i, label: String(i) } );
}
var page = new OO.ui.PageLayout();
for ( var i = 0; i < 20; i++ ) {
page.$element.append( $( '<p>' ).text( 'spacing...' ) );
}
page.$element.append( new OO.ui.DropdownWidget( { menu: { items: items } } ).$element );
for ( var i = 0; i < 100; i++ ) {
page.$element.append( $( '<p>' ).text( 'spacing...' ) );
}
var booklet = new OO.ui.BookletLayout( {
outlined: true
} );
booklet.addPages ( [ page ] );
$( 'body' ).append( booklet.$element );Scroll the pane of the BookletLayout so it's not at the top. Open the DropdownWidget. The dropdown menu will extend off the bottom of the visible area, at least in Firefox 37.0.2 and Chromium 42.0.2311.135.