Add the ability to screenshot individual elements on the page

Author: osbre

src/Dom/Node.php

@@ -4,6 +4,7 @@
 
 namespace HeadlessChromium\Dom;
 
+use HeadlessChromium\Clip;
 use HeadlessChromium\Communication\Message;
 use HeadlessChromium\Communication\Response;
 use HeadlessChromium\Exception\DomException;
@@ -214,4 +215,20 @@ public function assertNotError(Response $response): void
             throw new DOMException($response->getErrorMessage());
         }
     }
+
+    public function getClip(): ?Clip
+    {
+        $position = $this->getPosition();
+
+        if (!$position) {
+            return null;
+        }
+
+        return new Clip(
+            $position->getX(),
+            $position->getY(),
+            $position->getWidth(),
+            $position->getHeight(),
+        );
+    }
 }

src/Dom/NodePosition.php

@@ -44,14 +44,14 @@ public function __construct(array $points)
         $this->width = $rightBottomX - $leftBottomX;
     }
 
-    public function getX(): int
+    public function getX(): float
     {
-        return (int) $this->x;
+        return (float) $this->x;
     }
 
-    public function getY(): int
+    public function getY(): float
     {
-        return (int) $this->y;
+        return (float) $this->y;
     }
 
     public function getWidth(): int

src/Page.php

@@ -17,6 +17,7 @@
 use HeadlessChromium\Cookies\Cookie;
 use HeadlessChromium\Cookies\CookiesCollection;
 use HeadlessChromium\Dom\Dom;
+use HeadlessChromium\Dom\Node;
 use HeadlessChromium\Dom\Selector\CssSelector;
 use HeadlessChromium\Dom\Selector\Selector;
 use HeadlessChromium\Exception\CommunicationException;
@@ -673,6 +674,13 @@ public function screenshot(array $options = []): PageScreenshot
         return new PageScreenshot($responseReader);
     }
 
+    public function screenshotElement(Node $node): PageScreenshot
+    {
+        return $this->screenshot([
+            'clip' => $node->getClip(),
+        ]);
+    }
+
     /**
      * Generate a PDF
      * Usage:.

tests/PageTest.php

@@ -507,4 +507,20 @@ public function testSetScriptExecution(): void
             $page->evaluate('document.body.innerText')->getReturnValue()
         );
     }
+
+    public function testElementScreenshot(): void
+    {
+        $factory = new BrowserFactory();
+
+        $browser = $factory->createBrowser();
+        $page = $browser->createPage();
+
+        $page->navigate($this->sitePath('domForm.html'))->waitForNavigation();
+
+        $element = $page->dom()->querySelector('#myform');
+        $screenshot = $page->screenshotElement($element);
+
+        self::assertNotEmpty($screenshot->getBase64());
+        self::assertGreaterThan(4000, \strlen($screenshot->getBase64()));
+    }
 }