webview: Use private members.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg
2023-04-04 20:48:08 -07:00
parent 2ed400c23c
commit 1569890f4d

View File

@@ -51,13 +51,13 @@ export default class WebView {
} }
static async create(props: WebViewProps): Promise<WebView> { static async create(props: WebViewProps): Promise<WebView> {
const $element = generateNodeFromHtml( const $webview = generateNodeFromHtml(
WebView.templateHtml(props), WebView.templateHtml(props),
) as HTMLElement; ) as HTMLElement;
props.$root.append($element); props.$root.append($webview);
await new Promise<void>((resolve) => { await new Promise<void>((resolve) => {
$element.addEventListener( $webview.addEventListener(
"did-attach", "did-attach",
() => { () => {
resolve(); resolve();
@@ -87,37 +87,30 @@ export default class WebView {
throw new TypeError("Failed to get WebContents ID"); throw new TypeError("Failed to get WebContents ID");
} }
return new WebView(props, $element, webContentsId); return new WebView(props, $webview, webContentsId);
} }
zoomFactor: number; badgeCount = 0;
badgeCount: number; loading = true;
loading: boolean; private zoomFactor = 1;
customCss: string | false | null; private customCss: string | false | null;
$webviewsContainer: DOMTokenList; private readonly $webviewsContainer: DOMTokenList;
$el: HTMLElement;
webContentsId: number;
private constructor( private constructor(
readonly props: WebViewProps, readonly props: WebViewProps,
$element: HTMLElement, private readonly $webview: HTMLElement,
webContentsId: number, readonly webContentsId: number,
) { ) {
this.zoomFactor = 1;
this.loading = true;
this.badgeCount = 0;
this.customCss = ConfigUtil.getConfigItem("customCSS", null); this.customCss = ConfigUtil.getConfigItem("customCSS", null);
this.$webviewsContainer = document.querySelector( this.$webviewsContainer = document.querySelector(
"#webviews-container", "#webviews-container",
)!.classList; )!.classList;
this.$el = $element;
this.webContentsId = webContentsId;
this.registerListeners(); this.registerListeners();
} }
destroy(): void { destroy(): void {
this.$el.remove(); this.$webview.remove();
} }
getWebContents(): WebContents { getWebContents(): WebContents {
@@ -136,11 +129,11 @@ export default class WebView {
this.props.onTitleChange(); this.props.onTitleChange();
}); });
this.$el.addEventListener("did-navigate-in-page", () => { this.$webview.addEventListener("did-navigate-in-page", () => {
this.canGoBackButton(); this.canGoBackButton();
}); });
this.$el.addEventListener("did-navigate", () => { this.$webview.addEventListener("did-navigate", () => {
this.canGoBackButton(); this.canGoBackButton();
}); });
@@ -164,7 +157,7 @@ export default class WebView {
contextMenu(webContents, event, menuParameters); contextMenu(webContents, event, menuParameters);
}); });
this.$el.addEventListener("dom-ready", () => { this.$webview.addEventListener("dom-ready", () => {
this.loading = false; this.loading = false;
this.props.switchLoading(false, this.props.url); this.props.switchLoading(false, this.props.url);
this.show(); this.show();
@@ -181,11 +174,11 @@ export default class WebView {
} }
}); });
this.$el.addEventListener("did-start-loading", () => { this.$webview.addEventListener("did-start-loading", () => {
this.props.switchLoading(true, this.props.url); this.props.switchLoading(true, this.props.url);
}); });
this.$el.addEventListener("did-stop-loading", () => { this.$webview.addEventListener("did-stop-loading", () => {
this.props.switchLoading(false, this.props.url); this.props.switchLoading(false, this.props.url);
}); });
} }
@@ -208,7 +201,7 @@ export default class WebView {
// To show or hide the loading indicator in the active tab // To show or hide the loading indicator in the active tab
this.$webviewsContainer.toggle("loaded", !this.loading); this.$webviewsContainer.toggle("loaded", !this.loading);
this.$el.classList.add("active"); this.$webview.classList.add("active");
this.focus(); this.focus();
this.props.onTitleChange(); this.props.onTitleChange();
// Injecting preload css in webview to override some css rules // Injecting preload css in webview to override some css rules
@@ -233,13 +226,13 @@ export default class WebView {
} }
focus(): void { focus(): void {
this.$el.focus(); this.$webview.focus();
// Work around https://github.com/electron/electron/issues/31918 // Work around https://github.com/electron/electron/issues/31918
this.$el.shadowRoot?.querySelector("iframe")?.focus(); this.$webview.shadowRoot?.querySelector("iframe")?.focus();
} }
hide(): void { hide(): void {
this.$el.classList.remove("active"); this.$webview.classList.remove("active");
} }
load(): void { load(): void {