Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Proposing a get endpoint for Take Screenshot that with fullpage option #1536

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Proposing a get endpoint for Take Screenshot that with fullpage option #1536

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f37036b
Proposing a post endpoint for Take Screenshot that with fullpage option
k7z45 Jul 16, 2020
e134c44
Use GET with /screenshot/full instead
k7z45 Jul 17, 2020
16a640d
Simplify wording and width/height calculation
k7z45 Sep 22, 2020
1a802aa
Moved Take Full Screenshot right after Take Screenshot
k7z45 Nov 30, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
97 changes: 97 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1010,6 +1010,12 @@ <h3>Endpoints</h3>
<td><a>Take Screenshot</a></td>
</tr>

<tr>
<td>GET</td>
<td>/session/{<var>session id</var>}/screenshot/full</td>
<td><a>Take Full Screenshot</a></td>
</tr>

<tr>
<td>GET</td>
<td>/session/{<var>session id</var>}/element/{<var>element id</var>}/screenshot</td>
Expand Down Expand Up @@ -9032,6 +9038,8 @@ <h2>Screen capture</h2>

<p>WebDriver provides the <a>Take Screenshot</a> <a>command</a>
to capture the <a>top-level browsing context</a>’s <a>initial viewport</a>,
and the <a>Take Full Screenshot</a> <a>command</a>
to capture the scrollable region of the <a>top-level browsing context</a>’s <a>scrolling element</a>,
and a <a>command</a> <a>Take Element Screenshot</a>
for doing the same with the visible region of an <a>element</a>’s
<a>bounding rectangle</a> after it has been <a>scrolled into view</a>.
Expand Down Expand Up @@ -9082,6 +9090,45 @@ <h2>Screen capture</h2>
<li><p>Return <a>success</a> with <var>canvas</var>.
</ol>

<p>In order to <dfn>draw a scrollable region from the framebuffer</dfn>,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What exactly is that part about? Is it for the document element, or a child node? For child nodes we have Take Element Screenshot. Otherwise check you do below we already have at the top of the former list.

I feel we don't have to repeat all the steps again.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is for describing taking the screenshot for the full page instead of only the visible viewport.
It's for document.scrollingElement.
I did not use "draw a bounding box from the framebuffer" because I think step 2 and step 3
do not satisfy the requirement for full page screenshot.

"2. Let paint width be the initial viewport’s width – min(rectangle x coordinate, rectangle x coordinate + rectangle width dimension).
3. Let paint height be the initial viewport’s height – min(rectangle y coordinate, rectangle y coordinate + rectangle height dimension)."

Notice the - denotes the minus sign, so I think for Take Screenshot and Take Element Screenshot, the width and height will not be greater than the visible viewport's width and height but the full page screenshot takes the document.scrollingElement.scrollWidth and scrollHeight which can be greater. So I removed step 2 and 3 and uses the scrollWidth and Height directly for paint width and height.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@whimboo Could you take a look, please?

given a <a>scrolling element</a>:

<ol>
<li><p>If either the <a>initial viewport</a>’s width or height
is 0 <a>CSS pixels</a>,
return <a>error</a> with <a>error code</a> <a>unable to capture screen</a>.

<li><p>Let <var>canvas</var> be a new <a><code>canvas</code> element</a>,
and set its <a data-lt="canvas width attribute">width</a>
and <a data-lt="canvas height attribute">height</a>
to <a>scrolling element</a> <a>scrollWidth</a> and <a>scrollHeight</a>, respectively.

<li><p>Let <var>context</var>, a <a>canvas context mode</a>,
be the result of invoking the <a>2D context creation algorithm</a>
given <var>canvas</var> as the target.

<li><p>Complete implementation specific steps equivalent to
drawing the region of the framebuffer
specified by the following coordinates onto <var>context</var>:

<dl>
<dt>X coordinate
<dd>0

<dt>Y coordinate
<dd>0

<dt>Width
<dd><a>scrolling element</a> <a>scrollWidth</a>

<dt>Height
<dd><a>scrolling element</a> <a>scrollHeight</a>
</dl>

<li><p>Return <a>success</a> with <var>canvas</var>.
</ol>


<p>To <dfn data-lt="encoding a canvas as base64">encode a canvas as
Base64 a <code>canvas</code> <a>element</a></dfn>:

Expand Down Expand Up @@ -9152,6 +9199,47 @@ <h3><dfn>Take Screenshot</dfn></h3>
</ol>
</section> <!-- /Take Screenshot -->

<section>
<h3><dfn>Take Full Screenshot</dfn></h3>

<table class="simple jsoncommand">
<tr>
<th>HTTP Method</th>
<th>URI Template</th>
</tr>
<tr>
<td>GET</td>
<td>/session/{<var>session id</var>}/screenshot/full</td>
</tr>
</table>

<p>The <a>remote end steps</a> are:

<ol>
<li><p>If the <a>current top-level browsing context</a> is <a>no longer open</a>,
return <a>error</a> with <a>error code</a> <a>no such window</a>.

<li><p>When the user agent is next to <a>run the animation frame callbacks</a>:
<ol>

<li><p>Let <var>screenshot result</var> be the result of <a>trying</a> to call
<a>draw a scrollable region from the framebuffer</a>,
given <a>scrolling element</a> as an argument.

<li><p>Let <var>canvas</var> be a <a><code>canvas</code> element</a>
of <var>screenshot result</var>’s data.

<li><p>Let <var>encoding result</var> be the result of <a>trying</a>
<a>encoding a canvas as Base64</a> <var>canvas</var>.

<li><p>Let <var>encoded string</var> be <var>encoding result</var>’s data.
</ol>

<li><p>Return <a>success</a> with data <var>encoded string</var>.
</ol>

</section> <!-- /Take Full Screenshot -->

<section>
<h3><dfn>Take Element Screenshot</dfn></h3>

Expand Down Expand Up @@ -10111,6 +10199,15 @@ <h2>Index</h2>
sometimes here referred to as the <i>viewport</i>.
</ul>

<dd>The following terms are defined in
the CSSOM View Module: [[CSSOM-VIEW]]
<ul>
<!-- scrolling element --><li><dfn><a href=https://www.w3.org/TR/cssom-view-1/#dom-document-scrollingelement>Scrolling element</a></dfn>

<!-- scrollWidth --> <li><dfn><a href=https://www.w3.org/TR/cssom-view-1/#dom-element-scrollwidth>scrollWidth</a></dfn>
<!-- scrollHeight --> <li><dfn><a href=https://www.w3.org/TR/cssom-view-1/#dom-element-scrollheight>scrollHeight</a></dfn>
</ul>

<dd>The following properties are defined in
the CSS Display Module Level 3 specification: [[CSS3-DISPLAY]]
<ul>
Expand Down