Make XULElementBase into a mixin to reduce code duplication (#5270)

This commit is contained in:
Abe Jellinek 2025-05-09 01:00:43 -04:00 • committed by GitHub
parent 0b339a3a30
commit c42e144f56
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 52 additions and 71 deletions

View file

@ -23,47 +23,63 @@
***** END LICENSE BLOCK *****
*/
class XULElementBase extends XULElement {
initialized = false;
/**
* @return {DocumentFragment | null}
*/
get content() {
return null;
}
/**
* Add utility functions to XULElement or a subclass.
* @param {{ new(): XULElement }} Class
*/
function XULElementMixin(Class) {
return class extends Class {
initialized = false;
init() {}
destroy() {}
connectedCallback() {
let content = this.content;
if (content) {
content = document.importNode(content, true);
this.append(content);
/**
* @return {DocumentFragment | null}
*/
get content() {
return null;
}
MozXULElement.insertFTLIfNeeded("branding/brand.ftl");
MozXULElement.insertFTLIfNeeded("zotero.ftl");
if (document.l10n && this.shadowRoot) {
document.l10n.connectRoot(this.shadowRoot);
init() {}
destroy() {}
connectedCallback() {
if (typeof super.connectedCallback === 'function') {
super.connectedCallback();
}
let content = this.content;
if (content) {
content = document.importNode(content, true);
this.append(content);
}
MozXULElement.insertFTLIfNeeded("branding/brand.ftl");
MozXULElement.insertFTLIfNeeded("zotero.ftl");
if (document.l10n && this.shadowRoot) {
document.l10n.connectRoot(this.shadowRoot);
}
window.addEventListener("unload", this._handleWindowUnload);
this.initialized = true;
this.init();
}
window.addEventListener("unload", this._handleWindowUnload);
disconnectedCallback() {
if (typeof super.disconnectedCallback === 'function') {
super.disconnectedCallback();
}
this.initialized = true;
this.init();
}
this.replaceChildren();
this.destroy();
window.removeEventListener("unload", this._handleWindowUnload);
this.initialized = false;
}
disconnectedCallback() {
this.replaceChildren();
this.destroy();
window.removeEventListener("unload", this._handleWindowUnload);
this.initialized = false;
}
_handleWindowUnload = () => {
this.disconnectedCallback();
_handleWindowUnload = () => {
this.disconnectedCallback();
};
};
}
var XULElementBase = XULElementMixin(XULElement);

View file

@ -30,7 +30,7 @@
delete document.createXULElement("panel");
}
const XULPanelElement = customElements.get("panel");
class TabsMenuPanel extends XULPanelElement {
class TabsMenuPanel extends XULElementMixin(XULPanelElement) {
content = MozXULElement.parseXULToFragment(`
<vbox id="zotero-tabs-menu-wrapper" class="focus-states-target">
<html:input id="zotero-tabs-menu-filter"
@ -89,36 +89,6 @@
this.openPopup(elem, "after_start", -20, -2, false, false);
}
// From XULElementBase
connectedCallback() {
super.connectedCallback();
let content = this.content;
if (content) {
content = document.importNode(content, true);
this.append(content);
}
MozXULElement.insertFTLIfNeeded("branding/brand.ftl");
MozXULElement.insertFTLIfNeeded("zotero.ftl");
if (document.l10n && this.shadowRoot) {
document.l10n.connectRoot(this.shadowRoot);
}
window.addEventListener("unload", this._handleWindowUnload);
this.initialized = true;
this.init();
}
// From XULElementBase
disconnectedCallback() {
super.disconnectedCallback();
this.replaceChildren();
this.destroy();
window.removeEventListener("unload", this._handleWindowUnload);
this.initialized = false;
}
/**
* Create the list of opened tabs in tabs menu.
*/
@ -374,11 +344,6 @@
this._filterInput.focus();
}
// From XULElementBase
_handleWindowUnload = () => {
this.disconnectedCallback();
};
_handleShowing = (event) => {
if (event.originalTarget !== this) return;