From ccbb8adb866fbe7e4b667496bb5cb9b302e846ed Mon Sep 17 00:00:00 2001
From: Adam Bradley <adamdbradley@users.noreply.github.com>
Date: Wed, 20 Oct 2021 21:53:04 -0500
Subject: [PATCH] feat: window props

---
 src/lib/web-worker/worker-environment.ts |  3 +-
 tests/platform/window/index.html         | 38 ++++++++++++++++++++++--
 tests/platform/window/window.spec.ts     |  6 ++++
 3 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/src/lib/web-worker/worker-environment.ts b/src/lib/web-worker/worker-environment.ts
index d093fb6a..32bce3de 100644
--- a/src/lib/web-worker/worker-environment.ts
+++ b/src/lib/web-worker/worker-environment.ts
@@ -130,7 +130,8 @@ export const createEnvironment = ({
     const windowFunctionWhiteList =
       'addEventListener,removeEventListener,dispatchEvent,postMessage'.split(',');
 
-    const windowPropertyWhiteList = 'onmessage,onload,onerror'.split(',');
+    const windowPropertyWhiteList =
+      'devicePixelRatio,innerHeight,innerWidth,onmessage,onload,onerror'.split(',');
 
     const initWindowInstance = (win: any) => {
       win[WinIdKey] = $winId$;
diff --git a/tests/platform/window/index.html b/tests/platform/window/index.html
index 0fb6e1dd..833063e3 100644
--- a/tests/platform/window/index.html
+++ b/tests/platform/window/index.html
@@ -149,8 +149,10 @@ <h1>Window</h1>
           (function () {
             const b = document.getElementById('testBtoa');
             const a = document.getElementById('testAtob');
-            b.textContent = window.btoa('88');
-            a.textContent = atob(b.textContent);
+            const v1 = window.btoa('88');
+            const v2 = atob(v1);
+            b.textContent = v1;
+            a.textContent = v2;
           })();
         </script>
       </li>
@@ -375,6 +377,38 @@ <h1>Window</h1>
         </script>
       </li>
 
+      <li>
+        <strong>innerWidth/Height</strong>
+        <code>
+          <span id="testInnerWidthHeight"></span>
+        </code>
+        <script type="text/partytown">
+          (function () {
+            const elm = document.getElementById('testInnerWidthHeight');
+            if (typeof window.innerWidth === 'number' && typeof window.innerWidth === 'number') {
+              elm.textContent = window.innerWidth + 'x' + window.innerHeight;
+            }
+            elm.className = 'testInnerWidthHeight';
+          })();
+        </script>
+      </li>
+
+      <li>
+        <strong>devicePixelRatio</strong>
+        <code>
+          <span id="testDevicePixelRatio"></span>
+        </code>
+        <script type="text/partytown">
+          (function () {
+            const elm = document.getElementById('testDevicePixelRatio');
+            if (typeof window.devicePixelRatio === 'number') {
+              elm.textContent = window.devicePixelRatio;
+            }
+            elm.className = 'testDevicePixelRatio';
+          })();
+        </script>
+      </li>
+
       <script type="text/partytown">
         (function () {
           document.body.classList.add('completed');
diff --git a/tests/platform/window/window.spec.ts b/tests/platform/window/window.spec.ts
index d12e821d..21258227 100644
--- a/tests/platform/window/window.spec.ts
+++ b/tests/platform/window/window.spec.ts
@@ -79,4 +79,10 @@ test('window', async ({ page }) => {
 
   const testFrameElement = page.locator('#testFrameElement');
   await expect(testFrameElement).toHaveText('null');
+
+  const testInnerWidthHeight = page.locator('#testInnerWidthHeight');
+  await expect(testInnerWidthHeight).not.toHaveText('');
+
+  const testDevicePixelRatio = page.locator('#testDevicePixelRatio');
+  await expect(testDevicePixelRatio).not.toHaveText('');
 });