From d95105b3a5251d5dcd4f4f3217587c814ebba053 Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
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
---
 ghost/admin/app/services/resize-detector.js   | 27 +++++++++++++++++++
 ghost/admin/package.json                      |  2 +-
 .../unit/services/resize-detector-test.js     | 16 +++++++++++
 ghost/admin/yarn.lock                         |  6 +++++
 4 files changed, 50 insertions(+), 1 deletion(-)
 create mode 100644 ghost/admin/app/services/resize-detector.js
 create mode 100644 ghost/admin/tests/unit/services/resize-detector-test.js

diff --git a/ghost/admin/app/services/resize-detector.js b/ghost/admin/app/services/resize-detector.js
new file mode 100644
index 0000000000..e9d47d622c
--- /dev/null
+++ b/ghost/admin/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/ghost/admin/package.json b/ghost/admin/package.json
index 470323fa7a..deb6836e46 100644
--- a/ghost/admin/package.json
+++ b/ghost/admin/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/ghost/admin/tests/unit/services/resize-detector-test.js b/ghost/admin/tests/unit/services/resize-detector-test.js
new file mode 100644
index 0000000000..f3352efab1
--- /dev/null
+++ b/ghost/admin/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/ghost/admin/yarn.lock b/ghost/admin/yarn.lock
index b128f7b3b4..5a4145afac 100644
--- a/ghost/admin/yarn.lock
+++ b/ghost/admin/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"