fix(partytown): add style to image class (#239)

Co-authored-by: Aleksander Kuźma <aleksander.a.kuzma@gmail.com>
BuilderIO · Aug 29, 2022 · aff8eef · aff8eef · vercel · Aug 29, 2022
1 parent aa561c0
commit aff8eef
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 0 deletions.
diff --git a/src/lib/web-worker/worker-image.ts b/src/lib/web-worker/worker-image.ts
@@ -9,11 +9,13 @@ export const createImageConstructor = (env: WebWorkerEnvironment) =>
     s: string;
     l: EventHandler[];
     e: EventHandler[];
+    style: Record<string, string>;
 
     constructor() {
       this.s = '';
       this.l = [];
       this.e = [];
+      this.style = {};
     }
 
     get src() {

diff --git a/tests/platform/image/image.spec.ts b/tests/platform/image/image.spec.ts
@@ -35,6 +35,10 @@ test('image', async ({ page }) => {
   const testImgListenerError = page.locator('#testImgListenerError');
   await expect(testImgListenerError).toHaveText('error');
 
+  await page.waitForSelector('.testImgStyle');
+  const testImgStyle = page.locator('#testImgStyle');
+  await expect(testImgStyle).toHaveText('red');
+
   await page.waitForSelector('.testImgSrc');
   const testImgSrc = page.locator('#testImgSrc');
   await expect(testImgSrc).toHaveText('dot.gif?imageSrcTest');

diff --git a/tests/platform/image/index.html b/tests/platform/image/index.html
@@ -184,6 +184,23 @@ <h1>Image</h1>
         </script>
       </li>
 
+      <li>
+        <strong>&lt;img&gt; style</strong>
+        <code id="testImgStyle"></code>
+        <script type="text/partytown">
+          (function () {
+            const image = new Image();
+            image.style.color = 'red'
+            image.addEventListener('error', function (ev) {
+              const elm = document.getElementById('testImgStyle');
+              elm.textContent = image.style.color;
+              elm.className = 'testImgStyle';
+            });
+            image.src = '404.gif?testImgStyle';
+          })();
+        </script>
+      </li>
+
       <li>
         <strong>&lt;img&gt; src</strong>
         <code id="testImgSrc"></code>