diff --git a/addon/mixins/components/tooltips.js b/addon/mixins/components/tooltips.js index fcf28b66..2253f5a6 100644 --- a/addon/mixins/components/tooltips.js +++ b/addon/mixins/components/tooltips.js @@ -1,6 +1,8 @@ import Ember from 'ember'; import renderTooltip from 'ember-tooltips/utils/render-tooltip'; +const { on } = Ember; + export default Ember.Mixin.create({ /** @@ -40,6 +42,21 @@ export default Ember.Mixin.create({ tooltipSpacing: 10, tooltipTypeClass: null, + /** + Removes a tooltip from the DOM if the element it is attached + to is destroyed. + + @method destroyTooltip + */ + + destroyTooltip: on('willDestroyElement', function() { + const tooltip = this.get('tooltip'); + + if (tooltip) { + tooltip.detach(); + } + }), + /** Adds a tooltip to the current view using the values of the tooltip properties on the view or, if a `{{tooltip-on-parent}}` component is @@ -81,7 +98,7 @@ export default Ember.Mixin.create({ @param [maybeTooltipComponent] An optionally-passed component for a `{{tooltip-on-parent}}` class */ - renderTooltip: Ember.on('didInsertElement', function(maybeTooltipComponent) { + renderTooltip: on('didInsertElement', function(maybeTooltipComponent) { const componentWasPassed = Ember.typeOf(maybeTooltipComponent) === 'instance'; const component = componentWasPassed ? maybeTooltipComponent : Ember.Object.create({}); diff --git a/app/initializers/ember-tooltips.js b/app/initializers/ember-tooltips.js index 5c91cfaf..4d56fdc8 100644 --- a/app/initializers/ember-tooltips.js +++ b/app/initializers/ember-tooltips.js @@ -7,7 +7,6 @@ import Tooltips from '../mixins/components/tooltips'; export function initialize() { const defaultOptions = { addTo: ['Component', 'View'], - disableInitializer: true, }; const overridingOptions = ENV.tooltips || {}; const options = Ember.merge(defaultOptions, overridingOptions); diff --git a/package.json b/package.json index f0285db1..66d7c22d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-tooltips", - "version": "0.2.0", + "version": "0.2.1", "description": "Renders and positions plain text tooltips and HTMLBars tooltips on any Ember view or component", "directories": { "doc": "doc", diff --git a/tests/.jshintrc b/tests/.jshintrc index c63a30a4..0f7f5d14 100644 --- a/tests/.jshintrc +++ b/tests/.jshintrc @@ -25,7 +25,8 @@ "inspect", "mouseOut", "mouseOver", - "assertTooltipProperties" + "assertTooltipProperties", + "andThenAfterRender" ], "node": false, "browser": false, diff --git a/tests/acceptance/destroy-on-transition-test.js b/tests/acceptance/destroy-on-transition-test.js new file mode 100644 index 00000000..1db8fbf8 --- /dev/null +++ b/tests/acceptance/destroy-on-transition-test.js @@ -0,0 +1,54 @@ +import Ember from 'ember'; +import { module, test } from 'qunit'; +import selectorFor from '../helpers/selector-for'; +import startApp from '../helpers/start-app'; + +var application; + +module('Acceptance | destroy on transition', { + beforeEach: function() { + application = startApp(); + }, + + afterEach: function() { + Ember.run(application, 'destroy'); + } +}); + +test('visiting /destroy-on-transition', function(assert) { + const tooltip = 'show-on-click'; + + assert.expect(9); + + visit('/destroy-on-transition'); + + andThenAfterRender(function() { + assert.equal(currentURL(), '/destroy-on-transition', + 'Should be on correct route'); + + assertTooltipProperties(assert, tooltip, { + content: 'Should be removed on transition', + event: 'click', + }); + + }); + + click(selectorFor(tooltip)); + + andThenAfterRender(function() { + + assert.ok(inspect(tooltip).length, + 'The tooltip should be in the DOM'); + + }); + + visit('/'); + + andThen(function() { + + assert.ok(inspect(tooltip).length === 0, + 'The tooltip should not be in the DOM after a route transition'); + + }); + +}); diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 849f4221..c51ef3b3 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -6,6 +6,7 @@ var Router = Ember.Router.extend({ }); Router.map(function() { + this.route('destroy-on-transition'); this.route('tooltip-as-component'); this.route('tooltip-on-element'); this.route('tooltip-on-helper'); diff --git a/tests/dummy/app/templates/destroy-on-transition.hbs b/tests/dummy/app/templates/destroy-on-transition.hbs new file mode 100644 index 00000000..2b6fb21f --- /dev/null +++ b/tests/dummy/app/templates/destroy-on-transition.hbs @@ -0,0 +1,13 @@ +

Tooltips on helpers

+ + diff --git a/tests/helpers/async/and-then-after-render.js b/tests/helpers/async/and-then-after-render.js new file mode 100644 index 00000000..fefb3bd4 --- /dev/null +++ b/tests/helpers/async/and-then-after-render.js @@ -0,0 +1,9 @@ +import Ember from 'ember'; + +export default Ember.Test.registerAsyncHelper('andThenAfterRender', + function(app, callback) { + andThen(function() { + Ember.run.scheduleOnce('afterRender', this, callback); + }); + } +); diff --git a/tests/helpers/async/assert-tooltip-properties.js b/tests/helpers/async/assert-tooltip-properties.js index 3701dd25..847fa5b8 100644 --- a/tests/helpers/async/assert-tooltip-properties.js +++ b/tests/helpers/async/assert-tooltip-properties.js @@ -11,7 +11,6 @@ function cleanWhitespace(jQueryElement) { return jQueryElement; } - /* like click() but runs asyncrously allowing you to use it outside of an andThen function with the same stuff in the DOM */ diff --git a/tests/helpers/start-app.js b/tests/helpers/start-app.js index 7871ac73..f73ebffe 100644 --- a/tests/helpers/start-app.js +++ b/tests/helpers/start-app.js @@ -3,6 +3,7 @@ import Application from '../../app'; import Router from '../../router'; import config from '../../config/environment'; +import andThenAfterRender from './async/and-then-after-render'; import assertTooltipProperties from './async/assert-tooltip-properties'; import mouseOut from './async/mouse-out'; import mouseOver from './async/mouse-over';