Merge pull request #34 from lolmaus/ember-on-resize-modifier

Switch to ember-on-resize-modifier

Author: lolmaus

addon/-private/modifier.ts

@@ -1,5 +1,4 @@
 import Modifier from 'ember-modifier';
-import { observeResize } from 'ember-resize-observer-modifier/modifiers/observe-resize';
 import { action } from '@ember/object';
 import window from 'ember-window-mock';
 import { debounceTask } from 'ember-lifeline';
@@ -11,6 +10,7 @@ import {
   SIZES_DEFAULT,
   SIZES_HEIGHT_DEFAULT,
 } from 'ember-element-query';
+import { inject as service } from '@ember/service';
 export interface SizeObject {
   name: string;
   value: number;
@@ -19,8 +19,19 @@ export interface SizeObject {
 
 export type RangeDirection = 'at' | 'from' | 'to';
 
+interface ResizeObserverService {
+  observe(element: HTMLElement, callback?: () => void): void;
+  unobserve(element: HTMLElement, callback?: () => void): void;
+}
+
 /** @internal */
 export default class ElementQueryModifier extends Modifier<ModifierArgs> {
+  // -------------------
+  // Services
+  // -------------------
+
+  @service resizeObserver!: ResizeObserverService;
+
   // -------------------
   // Properties
   // -------------------
@@ -30,7 +41,6 @@ export default class ElementQueryModifier extends Modifier<ModifierArgs> {
   sizesRatioDefault: Sizes = SIZES_RATIO_DEFAULT;
 
   _element?: HTMLElement; // For some reason, this.element is not always available
-  teardownResizeObserver?: () => void;
 
   // -------------------
   // Computed properties
@@ -553,14 +563,11 @@ export default class ElementQueryModifier extends Modifier<ModifierArgs> {
   // -------------------
 
   didInstall(): void {
-    // @ts-ignore https://github.com/Microsoft/TypeScript/issues/28502#issuecomment-609607344
-    if (!ResizeObserver) return;
-
     if (!this.element) throw new Error('Expected this.element to be available');
 
     this._element = this.element;
 
-    this.teardownResizeObserver = observeResize(this.element, [this.didResizeHandler]); // eslint-disable-line @typescript-eslint/unbound-method
+    this.resizeObserver.observe(this.element, this.didResizeHandler); // eslint-disable-line @typescript-eslint/unbound-method
   }
 
   didUpdateArguments(): void {
@@ -571,9 +578,8 @@ export default class ElementQueryModifier extends Modifier<ModifierArgs> {
   }
 
   willRemove(): void {
-    // @ts-ignore https://github.com/Microsoft/TypeScript/issues/28502#issuecomment-609607344
-    if (!ResizeObserver) return;
+    if (!this.element) throw new Error('Expected this.element to be available');
 
-    if (this.teardownResizeObserver) this.teardownResizeObserver();
+    this.resizeObserver.unobserve(this.element, this.didResizeHandler); // eslint-disable-line @typescript-eslint/unbound-method
   }
 }

package.json

@@ -73,7 +73,7 @@
     "ember-element-helper": "^0.5.5",
     "ember-lifeline": "^6.0.2",
     "ember-modifier": "^2.1.2",
-    "ember-resize-observer-modifier": "^1.1.1",
+    "ember-resize-observer-service": "^0.3.0",
     "ember-window-mock": "^0.7.2"
   },
   "devDependencies": {

tests/dummy/config/environment.js

@@ -4,7 +4,7 @@ module.exports = function (environment) {
   const ENV = {
     modulePrefix: 'dummy',
     environment,
-    rootURL: '/ember-element-query/',
+    rootURL: '/',
     locationType: 'hash',
     EmberENV: {
       FEATURES: {
@@ -45,6 +45,7 @@ module.exports = function (environment) {
 
   if (environment === 'production') {
     // here you can enable a production-specific feature
+    ENV.rootURL = '/ember-element-query/';
   }
 
   return ENV;

yarn.lock

@@ -3695,11 +3695,6 @@ babel-plugin-filter-imports@^4.0.0:
     "@babel/types" "^7.7.2"
     lodash "^4.17.15"
 
-babel-plugin-htmlbars-inline-precompile@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-htmlbars-inline-precompile/-/babel-plugin-htmlbars-inline-precompile-4.1.0.tgz#11796422e65d900a968481fa3fb37e0425c928dd"
-  integrity sha512-gM+UP6HO5RlGiOQzJVGRUHgAsefJeOdh5Pn+rZRS6Tr1MnEqVgTJ2G2ywnl+G+Zcuec18fz7XA+O2tHhsmct6w==
-
 babel-plugin-htmlbars-inline-precompile@^5.0.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-htmlbars-inline-precompile/-/babel-plugin-htmlbars-inline-precompile-5.3.0.tgz#eeaff07c35415264aea4d6bafb5e71167f6ffb2f"
@@ -6665,7 +6660,7 @@ ember-cli-babel@^6.0.0-beta.4:
     ember-cli-version-checker "^2.1.2"
     semver "^5.5.0"
 
-ember-cli-babel@^7.0.0, ember-cli-babel@^7.10.0, ember-cli-babel@^7.13.0, ember-cli-babel@^7.18.0, ember-cli-babel@^7.7.3:
+ember-cli-babel@^7.0.0, ember-cli-babel@^7.10.0, ember-cli-babel@^7.13.0, ember-cli-babel@^7.7.3:
   version "7.21.0"
   resolved "https://registry.yarnpkg.com/ember-cli-babel/-/ember-cli-babel-7.21.0.tgz#c79e888876aee87dfc3260aee7cb580b74264bbc"
   integrity sha512-jHVi9melAibo0DrAG3GAxid+29xEyjBoU53652B4qcu3Xp58feZGTH/JGXovH7TjvbeNn65zgNyoV3bk1onULw==
@@ -6697,7 +6692,7 @@ ember-cli-babel@^7.0.0, ember-cli-babel@^7.10.0, ember-cli-babel@^7.13.0, ember-
     rimraf "^3.0.1"
     semver "^5.5.0"
 
-ember-cli-babel@^7.13.2, ember-cli-babel@^7.17.2, ember-cli-babel@^7.22.1, ember-cli-babel@^7.23.0, ember-cli-babel@^7.23.1, ember-cli-babel@^7.26.2, ember-cli-babel@^7.26.3, ember-cli-babel@^7.26.6:
+ember-cli-babel@^7.13.2, ember-cli-babel@^7.17.2, ember-cli-babel@^7.20.5, ember-cli-babel@^7.22.1, ember-cli-babel@^7.23.0, ember-cli-babel@^7.23.1, ember-cli-babel@^7.26.2, ember-cli-babel@^7.26.3, ember-cli-babel@^7.26.6:
   version "7.26.6"
   resolved "https://registry.yarnpkg.com/ember-cli-babel/-/ember-cli-babel-7.26.6.tgz#322fbbd3baad9dd99e3276ff05bc6faef5e54b39"
   integrity sha512-040svtfj2RC35j/WMwdWJFusZaXmNoytLAMyBDGLMSlRvznudTxZjGlPV6UupmtTBApy58cEF8Fq4a+COWoEmQ==
@@ -6746,7 +6741,7 @@ ember-cli-get-component-path-option@^1.0.0:
   resolved "https://registry.yarnpkg.com/ember-cli-get-component-path-option/-/ember-cli-get-component-path-option-1.0.0.tgz#0d7b595559e2f9050abed804f1d8eff1b08bc771"
   integrity sha1-DXtZVVni+QUKvtgE8djv8bCLx3E=
 
-[email protected], ember-cli-htmlbars@^5.1.0, ember-cli-htmlbars@^5.3.1, ember-cli-htmlbars@^5.7.1:
+[email protected], ember-cli-htmlbars@^5.1.0, ember-cli-htmlbars@^5.1.2, ember-cli-htmlbars@^5.3.1, ember-cli-htmlbars@^5.7.1:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/ember-cli-htmlbars/-/ember-cli-htmlbars-5.7.1.tgz#eb5b88c7d9083bc27665fb5447a9b7503b32ce4f"
   integrity sha512-9laCgL4tSy48orNoQgQKEHp93MaqAs9ZOl7or5q+8iyGGJHW6sVXIYrVv5/5O9HfV6Ts8/pW1rSoaeKyLUE+oA==
@@ -6778,27 +6773,6 @@ ember-cli-htmlbars@^3.0.0:
     json-stable-stringify "^1.0.1"
     strip-bom "^3.0.0"
 
-ember-cli-htmlbars@^5.0.0:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/ember-cli-htmlbars/-/ember-cli-htmlbars-5.1.2.tgz#b07cdb6b870bb223605dbed915c9c8d5185c53bb"
-  integrity sha512-//TZ3g0YYsSXylK4RhaFDDr694YOnjrO884+vzNteirYDLB9Yk0SnERlFC2qH6UKZ8koSZtdiXeEtltEqv5wew==
-  dependencies:
-    "@ember/edition-utils" "^1.2.0"
-    babel-plugin-htmlbars-inline-precompile "^4.1.0"
-    broccoli-debug "^0.6.5"
-    broccoli-persistent-filter "^2.3.1"
-    broccoli-plugin "^4.0.3"
-    common-tags "^1.8.0"
-    ember-cli-babel-plugin-helpers "^1.1.0"
-    fs-tree-diff "^2.0.1"
-    hash-for-dep "^1.5.1"
-    heimdalljs-logger "^0.1.10"
-    json-stable-stringify "^1.0.1"
-    semver "^7.3.2"
-    silent-error "^1.1.1"
-    strip-bom "^4.0.0"
-    walk-sync "^2.1.0"
-
 ember-cli-inject-live-reload@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/ember-cli-inject-live-reload/-/ember-cli-inject-live-reload-2.1.0.tgz#ef63c733c133024d5726405a3c247fa12e88a385"
@@ -7208,7 +7182,7 @@ ember-modifier-manager-polyfill@^1.1.0, ember-modifier-manager-polyfill@^1.2.0:
     ember-cli-version-checker "^2.1.2"
     ember-compatibility-helpers "^1.2.0"
 
-ember-modifier@^2.1.0, ember-modifier@^2.1.2:
+ember-modifier@^2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/ember-modifier/-/ember-modifier-2.1.2.tgz#62d18faedf972dcd9d34f90d5321fbc943d139b1"
   integrity sha512-3Lsu1fV1sIGa66HOW07RZc6EHISwKt5VA5AUnFss2HX6OTfpxTJ2qvPctt2Yt0XPQXJ4G6BQasr/F35CX7UGJA==
@@ -7243,14 +7217,13 @@ ember-qunit@^5.1.4:
     silent-error "^1.1.1"
     validate-peer-dependencies "^1.1.0"
 
-ember-resize-observer-modifier@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/ember-resize-observer-modifier/-/ember-resize-observer-modifier-1.1.1.tgz#848567a33901d799a6b4e5e187c1ca9574d1878c"
-  integrity sha512-M4XLrXw7L5AQgVM5INiENEjxHBiatHcWoOKWruuTsiyWkkIa7J5KZX44KGK3bUNmEAWHX/BAYjxGxBDP6V/loQ==
+ember-resize-observer-service@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/ember-resize-observer-service/-/ember-resize-observer-service-0.3.0.tgz#69b6e29bd6d742001ebe0ec70249f20f46fedc4a"
+  integrity sha512-FrKPowJ9CwLBok+WZOhudoRXPg9xHArpotMdZ2FyztcBHIb8D1mVB6ELLw62KGa62Wf7RoRhfmkloZax/5WHwg==
   dependencies:
-    ember-cli-babel "^7.18.0"
-    ember-cli-htmlbars "^5.0.0"
-    ember-modifier "^2.1.0"
+    ember-cli-babel "^7.20.5"
+    ember-cli-htmlbars "^5.1.2"
 
 ember-resolver@^8.0.2:
   version "8.0.2"
@@ -15195,7 +15168,7 @@ walk-sync@^1.0.0, walk-sync@^1.1.3:
     ensure-posix-path "^1.1.0"
     matcher-collection "^1.1.1"
 
-walk-sync@^2.0.0, walk-sync@^2.0.2, walk-sync@^2.1.0:
+walk-sync@^2.0.0, walk-sync@^2.0.2:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/walk-sync/-/walk-sync-2.1.0.tgz#e214248e5f5cf497ddd87db5a2a02e47e29c6501"
   integrity sha512-KpH9Xw64LNSx7/UI+3guRZvJWlDxVA4+KKb/4puRoVrG8GkvZRxnF3vhxdjgpoKJGL2TVg1OrtkXIE/VuGPLHQ==