From 93bd1ce9d7077f186564b4a2a7afa392cb695c92 Mon Sep 17 00:00:00 2001 From: Kevin Ansfield Date: Mon, 30 Apr 2018 17:03:29 +0100 Subject: [PATCH] Remove usage of `ember-element-resize-detector` no issue - fixes babel deprecation warning coming from `ember-element-resize-detector` - re-created basic `resize-detector` service to wrap `element-resize-detector` - import `element-resize-detector` directly from `npm` (includes bump to latest version) - drop usage of jQuery selectors --- app/services/resize-detector.js | 27 +++++++++++++++++++++ package.json | 2 +- tests/unit/services/resize-detector-test.js | 16 ++++++++++++ yarn.lock | 6 +++++ 4 files changed, 50 insertions(+), 1 deletion(-) create mode 100644 app/services/resize-detector.js create mode 100644 tests/unit/services/resize-detector-test.js diff --git a/app/services/resize-detector.js b/app/services/resize-detector.js new file mode 100644 index 000000000..e9d47d622 --- /dev/null +++ b/app/services/resize-detector.js @@ -0,0 +1,27 @@ +import Service from '@ember/service'; +import erd from 'npm:element-resize-detector'; + +export default Service.extend({ + init() { + this._super(...arguments); + this.detector = erd({ + strategy: 'scroll' + }); + }, + + setup(selector, callback) { + let element = document.querySelector(selector); + if (!element) { + // eslint-disable-next-line + console.error(`service:resize-detector - could not find element matching ${selector}`); + } + this.detector.listenTo(element, callback); + }, + + teardown(selector, callback) { + let element = document.querySelector(selector); + if (element) { + this.detector.removeListener(element, callback); + } + } +}); diff --git a/package.json b/package.json index 470323fa7..deb6836e4 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,7 @@ "csscomb": "4.2.0", "current-device": "0.7.7", "deparam": "1.0.5", + "element-resize-detector": "^1.1.14", "ember-ajax": "3.1.0", "ember-assign-helper": "0.1.2", "ember-browserify": "1.2.2", @@ -69,7 +70,6 @@ "ember-concurrency": "0.8.18", "ember-data": "3.1.1", "ember-drag-drop": "0.4.7", - "ember-element-resize-detector": "0.1.5", "ember-export-application-global": "2.0.0", "ember-fetch": "3.4.5", "ember-in-viewport": "3.0.2", diff --git a/tests/unit/services/resize-detector-test.js b/tests/unit/services/resize-detector-test.js new file mode 100644 index 000000000..f3352efab --- /dev/null +++ b/tests/unit/services/resize-detector-test.js @@ -0,0 +1,16 @@ +import {describe, it} from 'mocha'; +import {expect} from 'chai'; +import {setupTest} from 'ember-mocha'; + +describe('Unit: Service: resize-detector', function () { + setupTest('service:resize-detector', { + // Specify the other units that are required for this test. + // needs: ['service:foo'] + }); + + // Replace this with your real tests. + it('exists', function () { + let service = this.subject(); + expect(service).to.be.ok; + }); +}); diff --git a/yarn.lock b/yarn.lock index b128f7b3b..5a4145afa 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3223,6 +3223,12 @@ element-resize-detector@1.1.4: dependencies: batch-processor "^1.0.0" +element-resize-detector@^1.1.14: + version "1.1.14" + resolved "https://registry.yarnpkg.com/element-resize-detector/-/element-resize-detector-1.1.14.tgz#af064a0a618a820ad570a95c5eec5b77be0128c1" + dependencies: + batch-processor "^1.0.0" + elliptic@^6.0.0: version "6.4.0" resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.4.0.tgz#cac9af8762c85836187003c8dfe193e5e2eae5df"