From 5fa92bc69e976abfe725301d64748f2302983bd1 Mon Sep 17 00:00:00 2001
From: Dennis Li <34138453+Dli3@users.noreply.github.com>
Date: Tue, 11 Jun 2024 12:32:16 -0500
Subject: [PATCH] Revert "MWPW-147299" (#374)

Revert "MWPW-147299 (#368)"

This reverts commit 9d927801687ad1a8a60d1af15828bbb1ba816f9b.
---
 selectors/milo/howto.block.page.js | 22 +++++++++++-----------
 tests/milo/howto.block.test.js     |  9 ++++-----
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/selectors/milo/howto.block.page.js b/selectors/milo/howto.block.page.js
index af06eafe..310bd2a9 100644
--- a/selectors/milo/howto.block.page.js
+++ b/selectors/milo/howto.block.page.js
@@ -7,18 +7,18 @@ export default class HowTo {
     this.howToLarge = this.page.locator('.how-to.large-image').nth(nth);
     this.howToSeo = this.page.locator('.how-to.seo').nth(nth);
     this.heading = this.howTo.locator('.how-to-heading');
-    this.image = this.howTo.locator('.how-to-media');
+    this.image = this.howTo.locator('.how-to-image');
     this.list = this.howTo.locator('li');
-    this.largeImage = page.locator('.how-to-media img');
+    this.largeImage = page.locator('.how-to-image img');
 
     // howto contents css
     this.cssProperties = {
       '.how-to .foreground': {
-        padding: '80px 0px',
+        'padding': '80px 0px',
         'max-width': /%$/,
-        display: 'grid',
+        'display': 'grid',
       },
-      'how-to-media': {
+      'how-to-image': {
         'align-self': 'center',
         'justify-self': 'center',
         'min-height': '100%',
@@ -28,15 +28,15 @@ export default class HowTo {
         'line-height': '27px',
       },
       'how-to-large': {
-        padding: '80px 24px',
+        'padding': '80px 24px',
         'max-width': '700px',
       },
       'how-to-large-image': {
-        display: 'block',
+        'display': 'block',
         'grid-template-areas': 'none',
       },
       'how-to-seo': {
-        display: 'block',
+        'display': 'block',
         'grid-template-areas': 'none',
       },
     };
@@ -44,9 +44,9 @@ export default class HowTo {
     // howto contents attributes
     this.attProperties = {
       'how-to-large-image': {
-        width: '600',
-        height: '300',
+        'width': '600',
+        'height': '300',
       },
     };
   }
-}
+};
diff --git a/tests/milo/howto.block.test.js b/tests/milo/howto.block.test.js
index 4c8d7755..a4597141 100644
--- a/tests/milo/howto.block.test.js
+++ b/tests/milo/howto.block.test.js
@@ -14,7 +14,7 @@ test.describe('Milo HowTo block test suite', () => {
     howTo = new HowToBlock(page);
   });
 
-  // Test 0 : HowTo default block
+// Test 0 : HowTo default block  
   test(`${features[0].name},${features[0].tags}`, async ({ page, baseURL }) => {
     console.info(`[Test Page]: ${baseURL}${features[0].path}${miloLibs}`);
 
@@ -30,11 +30,11 @@ test.describe('Milo HowTo block test suite', () => {
 
       expect(await webUtil.verifyCSS_(howTo.foreground, howTo.cssProperties['.how-to .foreground'])).toBeTruthy();
       expect(await webUtil.verifyCSS_(howTo.heading, howTo.cssProperties['body-m'])).toBeTruthy();
-      expect(await webUtil.verifyCSS_(howTo.image, howTo.cssProperties['how-to-media'])).toBeTruthy();
+      expect(await webUtil.verifyCSS_(howTo.image, howTo.cssProperties['how-to-image'])).toBeTruthy();
     });
   });
 
-  // Test 1 : how-to (large) block
+// Test 1 : how-to (large) block    
   test(`${features[1].name},${features[1].tags}`, async ({ page, baseURL }) => {
     console.info(`[Test Page]: ${baseURL}${features[1].path}${miloLibs}`);
 
@@ -50,12 +50,11 @@ test.describe('Milo HowTo block test suite', () => {
 
       expect(await webUtil.verifyCSS_(howTo.heading, howTo.cssProperties['body-m'])).toBeTruthy();
       expect(await webUtil.verifyCSS_(howTo.howToLarge, howTo.cssProperties['how-to-large-image'])).toBeTruthy();
-      // eslint-disable-next-line max-len
       expect(await webUtil.verifyAttributes_(await howTo.largeImage, howTo.attProperties['how-to-large-image'])).toBeTruthy();
     });
   });
 
-  // Test 2 : how-to (seo) block
+// Test 2 : how-to (seo) block   
   test(`${features[2].name},${features[2].tags}`, async ({ page, baseURL }) => {
     console.info(`[Test Page]: ${baseURL}${features[2].path}${miloLibs}`);