[Release] Stage to Main 09/27 (#419)

[MWPW-159151] Rearrange content in mobile view for marquee used with interactive metadata #417
MWPW-159309 | Unit test fix #420
Creative cloud:

Before: https://main--cc--adobecom.hlx.live/?martech=off
After: https://stage--cc--adobecom.hlx.live/?martech=off

creativecloud/blocks/interactive-metadata/interactive-metadata.css

@@ -265,6 +265,18 @@
 }
 
 @media screen and (max-width: 600px) {
+  .marquee.large.interactive-enabled.content-top-mobile .text .body-xl {
+    order: unset;
+  }
+
+  .marquee.large.interactive-enabled.content-top-mobile .text p.supplemental-text {
+    order: 3;
+  }
+
+  .marquee.large.interactive-enabled.content-top-mobile .text {
+    order: 1;
+  }
+
   .aside.interactive-enabled .foreground.container .image {
     display: block;
     width: 100%;
@@ -383,6 +395,20 @@
   }
 }
 
+@media screen and (min-width: 600px) and (max-width: 1199px) {
+  .marquee.large.interactive-enabled.content-top-tablet .text .body-xl {
+    order: unset;
+  }
+
+  .marquee.large.interactive-enabled.content-top-tablet .text p.supplemental-text {
+    order: 3;
+  }
+
+  .marquee.large.interactive-enabled.content-top-tablet .text {
+    order: 1;
+  }
+}
+
 @media screen and (max-width: 1200px) {
   .aside.interactive-enabled .foreground.container .image {
     order: 1;

test/scripts/mocks/head.html

@@ -0,0 +1,2 @@
+<meta name="viewport" content="width=device-width, initial-scale=1"/>
+<link rel="icon" href="data:,">

test/scripts/scripts.test.js

@@ -6,6 +6,7 @@ function delay(ms) {
 }
 
 document.body.innerHTML = await readFile({ path: './mocks/body.html' });
+document.head.innerHTML = await readFile({ path: './mocks/head.html' });
 describe('Scripts', () => {
   before(async () => {
     await import('../../creativecloud/scripts/scripts.js');