mirror of
https://github.com/atom/atom.git
synced 2026-02-05 20:25:04 -05:00
72c5fcad82
No packages use it currently, and it's really complex to support so we should kill it while we have the chance. When it comes time to rewrite the tooltip code or add features, not worrying about selectors will make it easier.
155 lines
6.8 KiB
CoffeeScript
155 lines
6.8 KiB
CoffeeScript
TooltipManager = require '../src/tooltip-manager'
|
|
_ = require 'underscore-plus'
|
|
|
|
describe "TooltipManager", ->
|
|
[manager, element] = []
|
|
|
|
ctrlX = _.humanizeKeystroke("ctrl-x")
|
|
ctrlY = _.humanizeKeystroke("ctrl-y")
|
|
|
|
beforeEach ->
|
|
manager = new TooltipManager(keymapManager: atom.keymaps, viewRegistry: atom.views)
|
|
element = document.createElement('div')
|
|
element.classList.add('foo')
|
|
jasmine.attachToDOM(element)
|
|
|
|
hover = (element, fn) ->
|
|
element.dispatchEvent(new CustomEvent('mouseenter', bubbles: false))
|
|
element.dispatchEvent(new CustomEvent('mouseover', bubbles: true))
|
|
advanceClock(manager.hoverDefaults.delay.show)
|
|
fn()
|
|
element.dispatchEvent(new CustomEvent('mouseleave', bubbles: false))
|
|
element.dispatchEvent(new CustomEvent('mouseout', bubbles: true))
|
|
advanceClock(manager.hoverDefaults.delay.hide)
|
|
|
|
describe "::add(target, options)", ->
|
|
describe "when the trigger is 'hover' (the default)", ->
|
|
it "creates a tooltip when hovering over the target element", ->
|
|
manager.add element, title: "Title"
|
|
hover element, ->
|
|
expect(document.body.querySelector(".tooltip")).toHaveText("Title")
|
|
|
|
describe "when the trigger is 'manual'", ->
|
|
it "creates a tooltip immediately and only hides it on dispose", ->
|
|
disposable = manager.add element, title: "Title", trigger: "manual"
|
|
expect(document.body.querySelector(".tooltip")).toHaveText("Title")
|
|
disposable.dispose()
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
describe "when the trigger is 'click'", ->
|
|
it "shows and hides the tooltip when the target element is clicked", ->
|
|
disposable = manager.add element, title: "Title", trigger: "click"
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
element.click()
|
|
expect(document.body.querySelector(".tooltip")).not.toBeNull()
|
|
element.click()
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
# Hide the tooltip when clicking anywhere but inside the tooltip element
|
|
element.click()
|
|
expect(document.body.querySelector(".tooltip")).not.toBeNull()
|
|
document.body.querySelector(".tooltip").click()
|
|
expect(document.body.querySelector(".tooltip")).not.toBeNull()
|
|
document.body.querySelector(".tooltip").firstChild.click()
|
|
expect(document.body.querySelector(".tooltip")).not.toBeNull()
|
|
document.body.click()
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
# Tooltip can show again after hiding due to clicking outside of the tooltip
|
|
element.click()
|
|
expect(document.body.querySelector(".tooltip")).not.toBeNull()
|
|
element.click()
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
it "allows a custom item to be specified for the content of the tooltip", ->
|
|
tooltipElement = document.createElement('div')
|
|
manager.add element, item: {element: tooltipElement}
|
|
hover element, ->
|
|
expect(tooltipElement.closest(".tooltip")).not.toBeNull()
|
|
|
|
it "allows a custom class to be specified for the tooltip", ->
|
|
tooltipElement = document.createElement('div')
|
|
manager.add element, title: 'Title', class: 'custom-tooltip-class'
|
|
hover element, ->
|
|
expect(document.body.querySelector(".tooltip").classList.contains('custom-tooltip-class')).toBe(true)
|
|
|
|
it "allows jQuery elements to be passed as the target", ->
|
|
element2 = document.createElement('div')
|
|
jasmine.attachToDOM(element2)
|
|
|
|
fakeJqueryWrapper = [element, element2]
|
|
fakeJqueryWrapper.jquery = 'any-version'
|
|
disposable = manager.add fakeJqueryWrapper, title: "Title"
|
|
|
|
hover element, -> expect(document.body.querySelector(".tooltip")).toHaveText("Title")
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
hover element2, -> expect(document.body.querySelector(".tooltip")).toHaveText("Title")
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
disposable.dispose()
|
|
|
|
hover element, -> expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
hover element2, -> expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
describe "when a keyBindingCommand is specified", ->
|
|
describe "when a title is specified", ->
|
|
it "appends the key binding corresponding to the command to the title", ->
|
|
atom.keymaps.add 'test',
|
|
'.foo': 'ctrl-x ctrl-y': 'test-command'
|
|
'.bar': 'ctrl-x ctrl-z': 'test-command'
|
|
|
|
manager.add element, title: "Title", keyBindingCommand: 'test-command'
|
|
|
|
hover element, ->
|
|
tooltipElement = document.body.querySelector(".tooltip")
|
|
expect(tooltipElement).toHaveText "Title #{ctrlX} #{ctrlY}"
|
|
|
|
describe "when no title is specified", ->
|
|
it "shows the key binding corresponding to the command alone", ->
|
|
atom.keymaps.add 'test', '.foo': 'ctrl-x ctrl-y': 'test-command'
|
|
|
|
manager.add element, keyBindingCommand: 'test-command'
|
|
|
|
hover element, ->
|
|
tooltipElement = document.body.querySelector(".tooltip")
|
|
expect(tooltipElement).toHaveText "#{ctrlX} #{ctrlY}"
|
|
|
|
describe "when a keyBindingTarget is specified", ->
|
|
it "looks up the key binding relative to the target", ->
|
|
atom.keymaps.add 'test',
|
|
'.bar': 'ctrl-x ctrl-z': 'test-command'
|
|
'.foo': 'ctrl-x ctrl-y': 'test-command'
|
|
|
|
manager.add element, keyBindingCommand: 'test-command', keyBindingTarget: element
|
|
|
|
hover element, ->
|
|
tooltipElement = document.body.querySelector(".tooltip")
|
|
expect(tooltipElement).toHaveText "#{ctrlX} #{ctrlY}"
|
|
|
|
it "does not display the keybinding if there is nothing mapped to the specified keyBindingCommand", ->
|
|
manager.add element, title: 'A Title', keyBindingCommand: 'test-command', keyBindingTarget: element
|
|
|
|
hover element, ->
|
|
tooltipElement = document.body.querySelector(".tooltip")
|
|
expect(tooltipElement.textContent).toBe "A Title"
|
|
|
|
describe "when .dispose() is called on the returned disposable", ->
|
|
it "no longer displays the tooltip on hover", ->
|
|
disposable = manager.add element, title: "Title"
|
|
|
|
hover element, ->
|
|
expect(document.body.querySelector(".tooltip")).toHaveText("Title")
|
|
|
|
disposable.dispose()
|
|
|
|
hover element, ->
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|
|
|
|
describe "when the window is resized", ->
|
|
it "hides the tooltips", ->
|
|
manager.add element, title: "Title"
|
|
hover element, ->
|
|
expect(document.body.querySelector(".tooltip")).toBeDefined()
|
|
window.dispatchEvent(new CustomEvent('resize'))
|
|
expect(document.body.querySelector(".tooltip")).toBeNull()
|