From f915ecd400d680a71f2d66b3abb1de9910e3e72a Mon Sep 17 00:00:00 2001
From: Dmitry Lyzo <ashephard0@gmail.com>
Date: Sat, 29 Aug 2020 19:44:05 +0300
Subject: [PATCH] Add vendor styles polyfill

---
 src/legacy/vendorStyles.js | 32 ++++++++++++++++++++++++++++++++
 src/scripts/site.js        |  2 ++
 2 files changed, 34 insertions(+)
 create mode 100644 src/legacy/vendorStyles.js

diff --git a/src/legacy/vendorStyles.js b/src/legacy/vendorStyles.js
new file mode 100644
index 0000000000..3b9dd9cf10
--- /dev/null
+++ b/src/legacy/vendorStyles.js
@@ -0,0 +1,32 @@
+// Polyfill for vendor prefixed style properties
+
+(function () {
+    const vendorProperties = {
+        'transform': ['webkitTransform'],
+        'transition': ['webkitTransition']
+    };
+
+    const elem = document.createElement('div');
+
+    function polyfillProperty(name) {
+        if (!(name in elem.style)) {
+            for (const vendorName of vendorProperties[name] || []) {
+                if (vendorName in elem.style) {
+                    console.debug(`polyfill '${name}' with '${vendorName}'`);
+
+                    Object.defineProperty(CSSStyleDeclaration.prototype, name, {
+                        get: function () { return this[vendorName]; },
+                        set: function (val) { this[vendorName] = val; }
+                    });
+
+                    break;
+                }
+            }
+        }
+    }
+
+    if (elem.style instanceof CSSStyleDeclaration) {
+        polyfillProperty('transform');
+        polyfillProperty('transition');
+    }
+})();
diff --git a/src/scripts/site.js b/src/scripts/site.js
index 0e1e44251c..fda46b8dbe 100644
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@@ -222,6 +222,7 @@ function initClient() {
                 });
                 require(['mouseManager']);
                 require(['focusPreventScroll']);
+                require(['vendorStyles']);
                 require(['autoFocuser'], function(autoFocuser) {
                     autoFocuser.enable();
                 });
@@ -655,6 +656,7 @@ function initClient() {
         });
         define('slideshow', [componentsPath + '/slideshow/slideshow'], returnFirstDependency);
         define('focusPreventScroll', ['legacy/focusPreventScroll'], returnFirstDependency);
+        define('vendorStyles', ['legacy/vendorStyles'], returnFirstDependency);
         define('userdataButtons', [componentsPath + '/userdatabuttons/userdatabuttons'], returnFirstDependency);
         define('listView', [componentsPath + '/listview/listview'], returnFirstDependency);
         define('indicators', [componentsPath + '/indicators/indicators'], returnFirstDependency);