From ff830f201e2d4256ee6a766f0e12ad1822ac2faa Mon Sep 17 00:00:00 2001 From: Derk-Jan Hartman Date: Sun, 22 Jan 2023 17:37:56 +0100 Subject: [PATCH] DI: Make pinnable elements work on Safari 13 and earlier The pinnable element would cause exceptions on older versions of Safari during the setup and the ToC menu would show instead of being pinned and hidden. Bug: T327602 Change-Id: I99b656d0070d3e9af5641274134736b742c28f58 --- resources/skins.vector.es6/pinnableElement.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/resources/skins.vector.es6/pinnableElement.js b/resources/skins.vector.es6/pinnableElement.js index d4f7208ec..af0e28a8c 100644 --- a/resources/skins.vector.es6/pinnableElement.js +++ b/resources/skins.vector.es6/pinnableElement.js @@ -129,7 +129,13 @@ function bindPinnableToggleButtons( header ) { // Check the breakpoint in case an override is needed on pageload. disablePinningAtBreakpoint( header, pinnableBreakpoint ); // Add match media handler. - pinnableBreakpoint.addEventListener( 'change', disablePinningAtBreakpoint.bind( null, header ) ); + if ( pinnableBreakpoint.addEventListener ) { + pinnableBreakpoint.addEventListener( 'change', disablePinningAtBreakpoint.bind( null, header ) ); + } else { + // Before Safari 14, MediaQueryList is based on EventTarget, + // so you must use addListener() and removeListener() to observe media query lists. + pinnableBreakpoint.addListener( disablePinningAtBreakpoint.bind( null, header ) ); + } } /**