Update screenshot options (#2285)

* Update screenshot options

* fix conditions

* FromSurface null by default

* Skip fromSurface on windows

* it's an or

Author: kblok

lib/PuppeteerSharp.Tests/ScreenshotTests/ElementHandleScreenshotTests.cs

@@ -181,5 +181,20 @@ public async Task ShouldWorkForAnElementWithAnOffset()
             var screenshot = await elementHandle.ScreenshotDataAsync();
             Assert.True(ScreenshotHelper.PixelMatch("screenshot-element-fractional-offset.png", screenshot));
         }
+
+        [PuppeteerTest("screenshot.spec.ts", "ElementHandle.screenshot", "should work with a null viewport")]
+        [Skip(SkipAttribute.Targets.Firefox)]
+        public async Task ShouldWorkWithANullViewport()
+        {
+            var options = TestConstants.DefaultBrowserOptions();
+            options.DefaultViewport = null;
+            await using var browser = await Puppeteer.LaunchAsync(options);
+            var page = await browser.NewPageAsync();
+            await page.GoToAsync(TestConstants.ServerUrl + "/grid.html");
+            await page.EvaluateExpressionAsync("window.scrollBy(50, 100)");
+            var elementHandle = await page.QuerySelectorAsync(".box:nth-of-type(3)");
+            var screenshot = await elementHandle.ScreenshotDataAsync();
+            Assert.Greater(screenshot.Length, 0);
+        }
     }
 }

lib/PuppeteerSharp.Tests/ScreenshotTests/PageScreenshotTests.cs

@@ -113,6 +113,33 @@ await page.SetViewportAsync(new ViewPortOptions
             }
         }
 
+        [PuppeteerTest("screenshot.spec.ts", "Page.screenshot", "should use scale for clip")]
+        [Skip(SkipAttribute.Targets.Firefox)]
+        public async Task ShouldUseScaleForClip()
+        {
+            await using (var page = await Context.NewPageAsync())
+            {
+                await page.SetViewportAsync(new ViewPortOptions
+                {
+                    Width = 500,
+                    Height = 500
+                });
+                await page.GoToAsync(TestConstants.ServerUrl + "/grid.html");
+                var screenshot = await page.ScreenshotDataAsync(new ScreenshotOptions
+                {
+                    Clip = new Clip
+                    {
+                        X = 50,
+                        Y = 100,
+                        Width = 150,
+                        Height = 100,
+                        Scale = 2,
+                    }
+                });
+                Assert.True(ScreenshotHelper.PixelMatch("screenshot-clip-rect-scale2.png", screenshot));
+            }
+        }
+
         [PuppeteerTimeout]
         public async Task ShouldClipScale()
         {
@@ -139,6 +166,7 @@ await page.SetViewportAsync(new ViewPortOptions
             }
         }
 
+        [PuppeteerTest("screenshot.spec.ts", "Page.screenshot", "should get screenshot bigger than the viewport")]
         [Skip(SkipAttribute.Targets.Firefox)]
         public async Task ShouldClipElementsToTheViewport()
         {
@@ -302,6 +330,22 @@ public async Task ShouldRenderWhiteBackgroundOnJpegFile()
             }
         }
 
+        [PuppeteerTest("screenshot.spec.ts", "Page.screenshot", "should work with webp")]
+        [Skip(SkipAttribute.Targets.Firefox)]
+        public async Task ShouldWorkWithWebp()
+        {
+            await using (var page = await Context.NewPageAsync())
+            {
+                await page.SetViewportAsync(new ViewPortOptions { Width = 100, Height = 100 });
+                await page.GoToAsync(TestConstants.EmptyPage);
+                var screenshot = await page.ScreenshotDataAsync(new ScreenshotOptions
+                {
+                    Type = ScreenshotType.Webp
+                });
+                Assert.Greater(screenshot.Length, 0);
+            }
+        }
+
         [PuppeteerTest("screenshot.spec.ts", "Page.screenshot", "should work with odd clip size on Retina displays")]
         [PuppeteerTimeout]
         public async Task ShouldWorkWithOddClipSizeOnRetinaDisplays()
@@ -341,6 +385,27 @@ await page.SetViewportAsync(new ViewPortOptions
             }
         }
 
+        [PuppeteerTest("screenshot.spec.ts", "Page.screenshot", "should work in \"fromSurface: false\" mode")]
+        [Skip(SkipAttribute.Targets.Firefox, SkipAttribute.Targets.Windows)]
+        public async Task ShouldWorkInFromSurfacedFalseMode()
+        {
+            await using (var page = await Context.NewPageAsync())
+            {
+                await page.SetViewportAsync(new ViewPortOptions
+                {
+                    Width = 500,
+                    Height = 500
+                });
+                await page.GoToAsync(TestConstants.ServerUrl + "/grid.html");
+                var screenshot = await page.ScreenshotBase64Async(new ScreenshotOptions
+                {
+                    FromSurface = false,
+                });
+
+                Assert.Greater(screenshot.Length, 0);
+            }
+        }
+        
         [PuppeteerTimeout]
         public void ShouldInferScreenshotTypeFromName()
         {

lib/PuppeteerSharp.Tests/Screenshots/golden-chromium/screenshot-clip-rect-scale2.png

@@ -9,5 +9,9 @@ internal class PageCaptureScreenshotRequest
         public int Quality { get; set; }
 
         public Clip Clip { get; set; }
+
+        public bool CaptureBeyondViewport { get; set; }
+
+        public bool? FromSurface { get; set; }
     }
 }

lib/PuppeteerSharp/Messaging/PageCaptureScreenshotRequest.cs

@@ -1268,58 +1268,54 @@ private async Task<string> PerformScreenshot(ScreenshotType type, ScreenshotOpti
             }
 
             var clip = options.Clip != null ? ProcessClip(options.Clip) : null;
+            var captureBeyondViewport = options.CaptureBeyondViewport;
 
             if (!_screenshotBurstModeOn)
             {
-                if (options != null && options.FullPage)
+                if (options?.FullPage == true)
                 {
-                    var metrics = _screenshotBurstModeOn
-                        ? _burstModeMetrics :
-                        await Client.SendAsync<PageGetLayoutMetricsResponse>("Page.getLayoutMetrics").ConfigureAwait(false);
+                    // Overwrite clip for full page at all times.
+                    clip = null;
 
-                    if (options.BurstMode)
+                    if (!captureBeyondViewport)
                     {
-                        _burstModeMetrics = metrics;
-                    }
-
-                    var contentSize = metrics.CssContentSize ?? metrics.ContentSize;
+                        var metrics = _screenshotBurstModeOn
+                            ? _burstModeMetrics :
+                            await Client.SendAsync<PageGetLayoutMetricsResponse>("Page.getLayoutMetrics").ConfigureAwait(false);
 
-                    var width = Convert.ToInt32(Math.Ceiling(contentSize.Width));
-                    var height = Convert.ToInt32(Math.Ceiling(contentSize.Height));
-
-                    // Overwrite clip for full page at all times.
-                    clip = new Clip
-                    {
-                        X = 0,
-                        Y = 0,
-                        Width = width,
-                        Height = height,
-                        Scale = 1,
-                    };
-
-                    var isMobile = Viewport?.IsMobile ?? false;
-                    var deviceScaleFactor = Viewport?.DeviceScaleFactor ?? 1;
-                    var isLandscape = Viewport?.IsLandscape ?? false;
-                    var screenOrientation = isLandscape
-                        ? new ScreenOrientation
+                        if (options.BurstMode)
                         {
-                            Angle = 90,
-                            Type = ScreenOrientationType.LandscapePrimary,
+                            _burstModeMetrics = metrics;
                         }
-                        : new ScreenOrientation
-                        {
-                            Angle = 0,
-                            Type = ScreenOrientationType.PortraitPrimary,
-                        };
 
-                    await Client.SendAsync("Emulation.setDeviceMetricsOverride", new EmulationSetDeviceMetricsOverrideRequest
-                    {
-                        Mobile = isMobile,
-                        Width = width,
-                        Height = height,
-                        DeviceScaleFactor = deviceScaleFactor,
-                        ScreenOrientation = screenOrientation,
-                    }).ConfigureAwait(false);
+                        var contentSize = metrics.CssContentSize ?? metrics.ContentSize;
+
+                        var width = Convert.ToInt32(Math.Ceiling(contentSize.Width));
+                        var height = Convert.ToInt32(Math.Ceiling(contentSize.Height));
+                        var isMobile = Viewport?.IsMobile ?? false;
+                        var deviceScaleFactor = Viewport?.DeviceScaleFactor ?? 1;
+                        var isLandscape = Viewport?.IsLandscape ?? false;
+                        var screenOrientation = isLandscape
+                            ? new ScreenOrientation
+                            {
+                                Angle = 90,
+                                Type = ScreenOrientationType.LandscapePrimary,
+                            }
+                            : new ScreenOrientation
+                            {
+                                Angle = 0,
+                                Type = ScreenOrientationType.PortraitPrimary,
+                            };
+
+                        await Client.SendAsync("Emulation.setDeviceMetricsOverride", new EmulationSetDeviceMetricsOverrideRequest
+                        {
+                            Mobile = isMobile,
+                            Width = width,
+                            Height = height,
+                            DeviceScaleFactor = deviceScaleFactor,
+                            ScreenOrientation = screenOrientation,
+                        }).ConfigureAwait(false);
+                    }
                 }
 
                 if (options?.OmitBackground == true && type == ScreenshotType.Png)
@@ -1328,9 +1324,16 @@ private async Task<string> PerformScreenshot(ScreenshotType type, ScreenshotOpti
                 }
             }
 
+            if (options?.FullPage == false && clip == null)
+            {
+                captureBeyondViewport = false;
+            }
+
             var screenMessage = new PageCaptureScreenshotRequest
             {
                 Format = type.ToString().ToLower(CultureInfo.CurrentCulture),
+                CaptureBeyondViewport = captureBeyondViewport,
+                FromSurface = options.FromSurface,
             };
 
             if (options.Quality.HasValue)

lib/PuppeteerSharp/Page.cs

@@ -38,7 +38,7 @@ public class ScreenshotOptions
         public bool OmitBackground { get; set; }
 
         /// <summary>
-        /// Specify screenshot type, can be either jpeg or png. Defaults to 'png'.
+        /// Specify screenshot type, can be either jpeg, png or webp. Defaults to 'png'.
         /// </summary>
         /// <value>The type.</value>
         public ScreenshotType? Type { get; set; }
@@ -70,6 +70,16 @@ public class ScreenshotOptions
         [JsonIgnore]
         public bool BurstMode { get; set; } = false;
 
+        /// <summary>
+        /// Capture the screenshot beyond the viewport.
+        /// </summary>
+        public bool CaptureBeyondViewport { get; set; } = true;
+
+        /// <summary>
+        /// Capture the screenshot from the surface, rather than the view. Defaults to <c>true</c>.
+        /// </summary>
+        public bool? FromSurface { get; set; }
+
         internal static ScreenshotType? GetScreenshotTypeFromFile(string file)
         {
             var extension = new FileInfo(file).Extension.Replace(".", string.Empty);

lib/PuppeteerSharp/ScreenshotOptions.cs

@@ -15,5 +15,10 @@ public enum ScreenshotType
         /// PNG type.
         /// </summary>
         Png,
+
+        /// <summary>
+        /// Webp type.
+        /// </summary>
+        Webp,
     }
 }