diff --git a/src/vs/base/browser/ui/hover/hoverWidget.ts b/src/vs/base/browser/ui/hover/hoverWidget.ts index 3593cdcba61f2..c05a9658101a2 100644 --- a/src/vs/base/browser/ui/hover/hoverWidget.ts +++ b/src/vs/base/browser/ui/hover/hoverWidget.ts @@ -18,7 +18,7 @@ export class HoverWidget extends Disposable { public readonly containerDomNode: HTMLElement; public readonly contentsDomNode: HTMLElement; - private readonly _scrollbar: DomScrollableElement; + public readonly scrollbar: DomScrollableElement; constructor() { super(); @@ -31,14 +31,14 @@ export class HoverWidget extends Disposable { this.contentsDomNode = document.createElement('div'); this.contentsDomNode.className = 'monaco-hover-content'; - this._scrollbar = this._register(new DomScrollableElement(this.contentsDomNode, { + this.scrollbar = this._register(new DomScrollableElement(this.contentsDomNode, { consumeMouseWheelIfScrollbarIsNeeded: true })); - this.containerDomNode.appendChild(this._scrollbar.getDomNode()); + this.containerDomNode.appendChild(this.scrollbar.getDomNode()); } public onContentsChanged(): void { - this._scrollbar.scanDomNode(); + this.scrollbar.scanDomNode(); } } diff --git a/src/vs/base/browser/ui/scrollbar/scrollableElement.ts b/src/vs/base/browser/ui/scrollbar/scrollableElement.ts index 97f6f31d12ac5..aa6be1c229bbe 100644 --- a/src/vs/base/browser/ui/scrollbar/scrollableElement.ts +++ b/src/vs/base/browser/ui/scrollbar/scrollableElement.ts @@ -175,6 +175,10 @@ export abstract class AbstractScrollableElement extends Widget { private readonly _onWillScroll = this._register(new Emitter()); public readonly onWillScroll: Event = this._onWillScroll.event; + public get options(): Readonly { + return this._options; + } + protected constructor(element: HTMLElement, options: ScrollableElementCreationOptions, scrollable: Scrollable) { super(); element.style.overflow = 'hidden'; diff --git a/src/vs/editor/contrib/hover/browser/contentHover.ts b/src/vs/editor/contrib/hover/browser/contentHover.ts index 03e32f66a94d4..e6b7f3336029c 100644 --- a/src/vs/editor/contrib/hover/browser/contentHover.ts +++ b/src/vs/editor/contrib/hover/browser/contentHover.ts @@ -417,10 +417,11 @@ export class ContentHoverWidget extends Disposable implements IContentWidget { this._hover.contentsDomNode.textContent = ''; this._hover.contentsDomNode.appendChild(node); + this._hover.contentsDomNode.style.paddingBottom = ''; this._updateFont(); this._editor.layoutContentWidget(this); - this._hover.onContentsChanged(); + this.onContentsChanged(); // Simply force a synchronous render on the editor // such that the widget does not really render with left = '0px' @@ -429,7 +430,7 @@ export class ContentHoverWidget extends Disposable implements IContentWidget { // See https://github.com/microsoft/vscode/issues/140339 // TODO: Doing a second layout of the hover after force rendering the editor this._editor.layoutContentWidget(this); - this._hover.onContentsChanged(); + this.onContentsChanged(); if (visibleData.stoleFocus) { this._hover.containerDomNode.focus(); @@ -452,6 +453,18 @@ export class ContentHoverWidget extends Disposable implements IContentWidget { public onContentsChanged(): void { this._hover.onContentsChanged(); + + const scrollDimensions = this._hover.scrollbar.getScrollDimensions(); + const hasHorizontalScrollbar = (scrollDimensions.scrollWidth > scrollDimensions.width); + if (hasHorizontalScrollbar) { + // There is just a horizontal scrollbar + const extraBottomPadding = `${this._hover.scrollbar.options.horizontalScrollbarSize}px`; + if (this._hover.contentsDomNode.style.paddingBottom !== extraBottomPadding) { + this._hover.contentsDomNode.style.paddingBottom = extraBottomPadding; + this._editor.layoutContentWidget(this); + this._hover.onContentsChanged(); + } + } } public clear(): void {