[headless] Add screencast view port tests

This CL adds view port conformance tests for Page.startScreencast
CDP method running with both old and new headless.

Change-Id: I3a6d0c66ab7af3cc9db032a7ec592267b316cff9
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5031512
Commit-Queue: Peter Kvitek <kvitekp@chromium.org>
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1225283}

chrome/browser/headless/headless_mode_protocol_browsertest.cc

@@ -255,14 +255,12 @@ HEADLESS_MODE_PROTOCOL_TEST_F(HeadlessModeInputSelectFileDialogTest,
                               MAYBE_InputSelectFileDialog,
                               "input/input-select-file-dialog.js")
 
-// https://crbug.com/1411976
-#if BUILDFLAG(IS_WIN)
-#define MAYBE_ScreencastBasics DISABLED_ScreencastBasics
-#else
-#define MAYBE_ScreencastBasics ScreencastBasics
-#endif
-HEADLESS_MODE_PROTOCOL_TEST(MAYBE_ScreencastBasics,
-                            "sanity/screencast-basics.js")
+// These currently fail on Windows,see https://crbug.com/1411976 and
+// https://crbug.com/1502651
+#if !BUILDFLAG(IS_WIN)
+HEADLESS_MODE_PROTOCOL_TEST(ScreencastBasics, "sanity/screencast-basics.js")
+HEADLESS_MODE_PROTOCOL_TEST(ScreencastViewport, "sanity/screencast-viewport.js")
+#endif  // #if !BUILDFLAG(IS_WIN)
 
 HEADLESS_MODE_PROTOCOL_TEST(LargeBrowserWindowSize,
                             "sanity/large-browser-window-size.js")

chrome/browser/headless/test/data/protocol/sanity/screencast-viewport-expected.txt

@@ -0,0 +1,2 @@
+Tests screencast viewport size.
+Image size: 640 x 480

chrome/browser/headless/test/data/protocol/sanity/screencast-viewport.js

@@ -0,0 +1,77 @@
+// Copyright 2023 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+(async function(testRunner) {
+  const {session, dp} =
+      await testRunner.startBlank('Tests screencast viewport size.');
+
+  let lastImageWidth = 0;
+  let lastImageHeight = 0;
+  let colorChangeCount = 0;
+
+  function setBkgrColor(bkgrColor) {
+    session.evaluate(`document.body.style.backgroundColor = "${bkgrColor}"`);
+  }
+
+  function changeBkgrColor(image) {
+    const canvas = document.createElement('canvas');
+    canvas.width = image.naturalWidth;
+    canvas.height = image.naturalHeight;
+    const ctx = canvas.getContext('2d');
+    ctx.drawImage(image, 0, 0);
+    const rgba = ctx.getImageData(0, 0, 1, 1).data;
+
+    if (rgba[0] === 0 && rgba[3] === 255) {
+      if (rgba[1] === 255 && rgba[2] === 0) {
+        ++colorChangeCount;
+        setBkgrColor('#0000ff');
+      } else if (rgba[1] === 0 && rgba[2] === 255) {
+        ++colorChangeCount;
+        setBkgrColor('#00ff00');
+      }
+    } else {
+      setBkgrColor('#00ff00');
+    }
+  }
+
+  function saveImageSize(image) {
+    if (lastImageWidth != image.naturalWidth ||
+        lastImageHeight != image.naturalHeight) {
+      lastImageWidth = image.naturalWidth;
+      lastImageHeight = image.naturalHeight;
+    }
+  }
+
+  async function loadPngAndChangeColor(pngBase64) {
+    const image = new Image();
+
+    await new Promise(resolve => {
+      image.onload = resolve;
+      image.src = `data:image/png;base64,${pngBase64}`;
+    });
+
+    saveImageSize(image);
+    changeBkgrColor(image);
+  }
+
+  await dp.Page.enable();
+
+  dp.Page.onScreencastFrame(async (data) => {
+    const pngBase64 = data.params.data;
+    await loadPngAndChangeColor(pngBase64);
+
+    const sessionId = data.params.sessionId;
+    await dp.Page.screencastFrameAck({sessionId});
+
+    if (colorChangeCount > 4) {
+      await dp.Page.stopScreencast();
+      testRunner.log(`Image size: ${lastImageWidth} x ${lastImageHeight}`);
+      testRunner.completeTest();
+    }
+  });
+
+  dp.Page.bringToFront();
+  dp.Emulation.setVisibleSize({width: 640, height: 480});
+  dp.Page.startScreencast({format: 'png'});
+})

headless/test/data/protocol/sanity/screencast-viewport-expected.txt

@@ -0,0 +1,2 @@
+Tests screencast viewport size.
+Image size: 640 x 480

headless/test/data/protocol/sanity/screencast-viewport.js

@@ -0,0 +1,77 @@
+// Copyright 2023 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+(async function(testRunner) {
+  const {session, dp} =
+      await testRunner.startBlank('Tests screencast viewport size.');
+
+  let lastImageWidth = 0;
+  let lastImageHeight = 0;
+  let colorChangeCount = 0;
+
+  function setBkgrColor(bkgrColor) {
+    session.evaluate(`document.body.style.backgroundColor = "${bkgrColor}"`);
+  }
+
+  function changeBkgrColor(image) {
+    const canvas = document.createElement('canvas');
+    canvas.width = image.naturalWidth;
+    canvas.height = image.naturalHeight;
+    const ctx = canvas.getContext('2d');
+    ctx.drawImage(image, 0, 0);
+    const rgba = ctx.getImageData(0, 0, 1, 1).data;
+
+    if (rgba[0] === 0 && rgba[3] === 255) {
+      if (rgba[1] === 255 && rgba[2] === 0) {
+        ++colorChangeCount;
+        setBkgrColor('#0000ff');
+      } else if (rgba[1] === 0 && rgba[2] === 255) {
+        ++colorChangeCount;
+        setBkgrColor('#00ff00');
+      }
+    } else {
+      setBkgrColor('#00ff00');
+    }
+  }
+
+  function saveImageSize(image) {
+    if (lastImageWidth != image.naturalWidth ||
+        lastImageHeight != image.naturalHeight) {
+      lastImageWidth = image.naturalWidth;
+      lastImageHeight = image.naturalHeight;
+    }
+  }
+
+  async function loadPngAndChangeColor(pngBase64) {
+    const image = new Image();
+
+    await new Promise(resolve => {
+      image.onload = resolve;
+      image.src = `data:image/png;base64,${pngBase64}`;
+    });
+
+    saveImageSize(image);
+    changeBkgrColor(image);
+  }
+
+  await dp.Page.enable();
+
+  dp.Page.onScreencastFrame(async (data) => {
+    const pngBase64 = data.params.data;
+    await loadPngAndChangeColor(pngBase64);
+
+    const sessionId = data.params.sessionId;
+    await dp.Page.screencastFrameAck({sessionId});
+
+    if (colorChangeCount > 4) {
+      await dp.Page.stopScreencast();
+      testRunner.log(`Image size: ${lastImageWidth} x ${lastImageHeight}`);
+      testRunner.completeTest();
+    }
+  });
+
+  dp.Page.bringToFront();
+  dp.Emulation.setVisibleSize({width: 640, height: 480});
+  dp.Page.startScreencast({format: 'png'});
+})

headless/test/headless_protocol_browsertest.cc

@@ -366,6 +366,7 @@ HEADLESS_PROTOCOL_TEST(LargeBrowserWindowSize,
                        "sanity/large-browser-window-size.js")
 
 HEADLESS_PROTOCOL_TEST(ScreencastBasics, "sanity/screencast-basics.js")
+HEADLESS_PROTOCOL_TEST(ScreencastViewport, "sanity/screencast-viewport.js")
 
 class HeadlessProtocolBrowserTestWithProxy
     : public HeadlessProtocolBrowserTest {