Skip to content

Commit

Permalink
Add the ability to screenshot individual elements on the page
Browse files Browse the repository at this point in the history
  • Loading branch information
osbre committed Oct 8, 2023
1 parent d45e130 commit aea7f4d
Show file tree
Hide file tree
Showing 4 changed files with 45 additions and 4 deletions.
17 changes: 17 additions & 0 deletions src/Dom/Node.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@

namespace HeadlessChromium\Dom;

use HeadlessChromium\Clip;
use HeadlessChromium\Communication\Message;
use HeadlessChromium\Communication\Response;
use HeadlessChromium\Exception\DomException;
Expand Down Expand Up @@ -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(),
);
}
}
8 changes: 4 additions & 4 deletions src/Dom/NodePosition.php
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
8 changes: 8 additions & 0 deletions src/Page.php
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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:.
Expand Down
16 changes: 16 additions & 0 deletions tests/PageTest.php
Original file line number Diff line number Diff line change
Expand Up @@ -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()));
}
}

0 comments on commit aea7f4d

Please sign in to comment.