PowerTip Edge Case Tests

Tooltip CSS Theme:

Open on load

The button below has a tooltip that will open when the document loads. The tooltip should be properly positioned.

Click toggle

The button below has a tooltip that will toggle when clicked.

Self-disabling button

The button below will disable itself when used with the mouse or keyboard. The tooltip should close.

Auto-disabling button

The button below will disable itself 2 seconds after you hover or focus on it. The tooltip should close.

Long delay

The two buttons below have tooltips with long delays. Mousing from one to the other should open tooltips normally.

Manual and interactive

The buttons below have tooltips, one with manual enabled, the other with mouseOnToPopup enabled. The manual tooltip should not close when you mouse off of the tooltip element.

Huge Text

The tooltips for the buttons below have a lot of text. The tooltip div is completely elastic for this demo. The tooltips should be properly placed when they render.



Huge Text with Smart Placement

The tooltips for the buttons below have a lot of text. The tooltip div is completely elastic for this demo. The tooltips should be properly placed when they render.



SVG Elements

The following glyphs are SVG elements. Tooltips should be placed correctly on all SVG elements.

Complex SVG Elements

The following shapes are created using SVG. Tooltips should be placed correctly on all SVG elements.

Text

Rotated SVG Elements

The following SVG shapes have been rotated. Tooltips should be placed correctly on all SVG elements.

Trapped mouse following tooltip

This box has a mouse following tooltip.

Trap it in the bottom right corner of the viewport. It should flip out of the way. It should not flip if it only hits one edge.