long live ResizeObserver, let's ditch MutationObserver five-ever

This commit is contained in:
Tamius Han 2021-03-29 23:30:54 +02:00
parent 3185e500d1
commit 03f37fa1a3
2 changed files with 8 additions and 8 deletions

View File

@ -65,7 +65,7 @@ class PlayerData {
extensionMode: any; extensionMode: any;
dimensions: any; dimensions: any;
private playerIdElement: any; private playerIdElement: any;
private observer: MutationObserver; private observer: ResizeObserver;
//#endregion //#endregion
constructor(videoData) { constructor(videoData) {
@ -141,7 +141,7 @@ class PlayerData {
try { try {
if (BrowserDetect.firefox) { if (BrowserDetect.firefox) {
this.observer = new MutationObserver( this.observer = new ResizeObserver(
_.debounce( // don't do this too much: _.debounce( // don't do this too much:
this.onPlayerDimensionsChanged, this.onPlayerDimensionsChanged,
250, // do it once per this many ms 250, // do it once per this many ms
@ -154,7 +154,7 @@ class PlayerData {
} else { } else {
// Chrome for some reason insists that this.onPlayerDimensionsChanged is not a function // Chrome for some reason insists that this.onPlayerDimensionsChanged is not a function
// when it's not wrapped into an anonymous function // when it's not wrapped into an anonymous function
this.observer = new MutationObserver( this.observer = new ResizeObserver(
_.debounce( // don't do this too much: _.debounce( // don't do this too much:
(m,o) => this.onPlayerDimensionsChanged(m,o), (m,o) => this.onPlayerDimensionsChanged(m,o),
250, // do it once per this many ms 250, // do it once per this many ms
@ -172,7 +172,7 @@ class PlayerData {
attributeOldValue: true, attributeOldValue: true,
}; };
this.observer.observe(this.element, observerConf); this.observer.observe(this.element);
} catch (e) { } catch (e) {
console.error("failed to set observer",e ) console.error("failed to set observer",e )
} }

View File

@ -25,7 +25,7 @@ class VideoData {
//#region misc stuff //#region misc stuff
vdid: string; vdid: string;
video: any; video: any;
observer: MutationObserver; observer: ResizeObserver;
extensionMode: any; extensionMode: any;
userCssClassName: string; userCssClassName: string;
validationId: number; validationId: number;
@ -182,7 +182,7 @@ class VideoData {
// INIT OBSERVERS // INIT OBSERVERS
try { try {
if (BrowserDetect.firefox) { if (BrowserDetect.firefox) {
this.observer = new MutationObserver( this.observer = new ResizeObserver(
_.debounce( _.debounce(
this.onVideoDimensionsChanged, this.onVideoDimensionsChanged,
250, 250,
@ -195,7 +195,7 @@ class VideoData {
} else { } else {
// Chrome for some reason insists that this.onPlayerDimensionsChanged is not a function // Chrome for some reason insists that this.onPlayerDimensionsChanged is not a function
// when it's not wrapped into an anonymous function // when it's not wrapped into an anonymous function
this.observer = new MutationObserver( this.observer = new ResizeObserver(
_.debounce( _.debounce(
(m, o) => { (m, o) => {
this.onVideoDimensionsChanged(m, o) this.onVideoDimensionsChanged(m, o)
@ -211,7 +211,7 @@ class VideoData {
} catch (e) { } catch (e) {
console.error('[VideoData] Observer setup failed:', e); console.error('[VideoData] Observer setup failed:', e);
} }
this.observer.observe(this.video, observerConf); this.observer.observe(this.video);
// INIT AARD // INIT AARD
this.arDetector = new ArDetector(this); // this starts Ar detection. needs optional parameter that prevets ardetdctor from starting this.arDetector = new ArDetector(this); // this starts Ar detection. needs optional parameter that prevets ardetdctor from starting