mirror of
https://github.com/discourse/discourse.git
synced 2025-02-25 18:55:32 -06:00
DEV: Cleanup ace-editor event listeners (#27844)
- set in constructor so they're guaranteed to be present, even if async-import hasn't finished yet - ensure they're all cleaned up properly - combine two cleanup methods into one
This commit is contained in:
parent
5ec227334a
commit
374279b93e
@ -2,7 +2,7 @@ import Component from "@ember/component";
|
|||||||
import { action } from "@ember/object";
|
import { action } from "@ember/object";
|
||||||
import { next } from "@ember/runloop";
|
import { next } from "@ember/runloop";
|
||||||
import { classNames } from "@ember-decorators/component";
|
import { classNames } from "@ember-decorators/component";
|
||||||
import { observes, on } from "@ember-decorators/object";
|
import { observes } from "@ember-decorators/object";
|
||||||
import loadAce from "discourse/lib/load-ace-editor";
|
import loadAce from "discourse/lib/load-ace-editor";
|
||||||
import { bind } from "discourse-common/utils/decorators";
|
import { bind } from "discourse-common/utils/decorators";
|
||||||
import I18n from "discourse-i18n";
|
import I18n from "discourse-i18n";
|
||||||
@ -19,6 +19,14 @@ export default class AceEditor extends Component {
|
|||||||
_editor = null;
|
_editor = null;
|
||||||
_skipContentChangeEvent = null;
|
_skipContentChangeEvent = null;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super(...arguments);
|
||||||
|
this.appEvents.on("ace:resize", this.resize);
|
||||||
|
window.addEventListener("resize", this.resize);
|
||||||
|
this._darkModeListener = window.matchMedia("(prefers-color-scheme: dark)");
|
||||||
|
this._darkModeListener.addListener(this.setAceTheme);
|
||||||
|
}
|
||||||
|
|
||||||
@observes("editorId")
|
@observes("editorId")
|
||||||
editorIdChanged() {
|
editorIdChanged() {
|
||||||
if (this.autofocus) {
|
if (this.autofocus) {
|
||||||
@ -73,17 +81,6 @@ export default class AceEditor extends Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@on("willDestroyElement")
|
|
||||||
_destroyEditor() {
|
|
||||||
if (this._editor) {
|
|
||||||
this._editor.destroy();
|
|
||||||
this._editor = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.appEvents.off("ace:resize", this.resize);
|
|
||||||
window.removeEventListener("resize", this.resize);
|
|
||||||
}
|
|
||||||
|
|
||||||
@action
|
@action
|
||||||
resize() {
|
resize() {
|
||||||
if (this._editor) {
|
if (this._editor) {
|
||||||
@ -145,29 +142,25 @@ export default class AceEditor extends Component {
|
|||||||
this.changeDisabledState();
|
this.changeDisabledState();
|
||||||
this.warnSCSSDeprecations();
|
this.warnSCSSDeprecations();
|
||||||
|
|
||||||
window.addEventListener("resize", this.resize);
|
|
||||||
|
|
||||||
this.appEvents.on("ace:resize", this.resize);
|
|
||||||
|
|
||||||
if (this.autofocus) {
|
if (this.autofocus) {
|
||||||
this.send("focus");
|
this.send("focus");
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setAceTheme();
|
this.setAceTheme();
|
||||||
|
|
||||||
this._darkModeListener = window.matchMedia(
|
|
||||||
"(prefers-color-scheme: dark)"
|
|
||||||
);
|
|
||||||
this._darkModeListener.addListener(this.setAceTheme);
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
willDestroyElement() {
|
willDestroyElement() {
|
||||||
|
if (this._editor) {
|
||||||
|
this._editor.destroy();
|
||||||
|
this._editor = null;
|
||||||
|
}
|
||||||
|
|
||||||
super.willDestroyElement(...arguments);
|
super.willDestroyElement(...arguments);
|
||||||
|
|
||||||
this._darkModeListener?.removeListener(this.setAceTheme);
|
this._darkModeListener?.removeListener(this.setAceTheme);
|
||||||
window.addEventListener("resize", () => {
|
window.removeEventListener("resize", this.resize);
|
||||||
this.appEvents.trigger("ace:resize");
|
this.appEvents.off("ace:resize", this.resize);
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
get aceTheme() {
|
get aceTheme() {
|
||||||
|
Loading…
Reference in New Issue
Block a user