From 9dbb43eb71b6ae700f73a51274aa13580cc7d805 Mon Sep 17 00:00:00 2001 From: Anders Kaseorg Date: Sat, 24 Dec 2022 20:32:51 -0800 Subject: [PATCH] realm_logo: Add fallback for MediaQueryList.addEventListener. MediaQueryList.addEventListener is missing in Safari < 14: https://caniuse.com/mdn-api_mediaquerylist_eventtarget_inheritance Fixes #23915. Signed-off-by: Anders Kaseorg --- static/js/realm_logo.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/static/js/realm_logo.js b/static/js/realm_logo.js index 265576a4ce..4af5b026bc 100644 --- a/static/js/realm_logo.js +++ b/static/js/realm_logo.js @@ -105,10 +105,16 @@ export function initialize() { render(); // Rerender the realm-logo when the browser detects color scheme changes. - const dark_mode_media_query_list = window.matchMedia("(prefers-color-scheme: dark)"); - dark_mode_media_query_list.addEventListener("change", () => { + const media_query_list = window.matchMedia("(prefers-color-scheme: dark)"); + // MediaQueryList.addEventListener is missing in Safari < 14 + const listener = () => { if ($(":root").hasClass("color-scheme-automatic")) { render(); } - }); + }; + if ("addEventListener" in media_query_list) { + media_query_list.addEventListener("change", listener); + } else { + media_query_list.addListener(listener); + } }