<p dir="auto">Hello, I was performing some simple tests and stumbled upon something that did not seem to behave as expected....<br>
I wanted to set the window screen size different (bigger) than the viewport but when I evaluated screen.height I always got the viewport's height.<br>
I tried setting ScreenSize in the context but also in a new page (check Snippet below), but both behaved the same way...<br>
I always set the ScreenSize along with ViewportSize, as documentation suggests, so that did not seem to be the case.<br>
Then it came to my mind to check the behavior of the other browsers as well. I tested Chromium &amp; WebKit and they both work as expected!</p>
<p dir="auto">So, I guess it's a firefox issue and it's probably a bug rather than feature... although, I cannot tell if it occurs also on the Playwright or it was introduced in the dotnet port.</p>
<p dir="auto">Snippet to reproduce:</p>
<div class="highlight highlight-source-cs notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var width = 1920;
var height = 1200;

using var playwright = await Playwright.CreateAsync();
await using var browser = await playwright.Firefox.LaunchAsync(new() { Headless = false});

await using var context = await browser.NewContextAsync(new()
{
      ScreenSize = new ScreenSize  { Width = width, Height = height },
      ViewportSize = new ViewportSize { Width = width, Height = 1080}  //let's set something different in Viewport height
}) ;

var page = await context.NewPageAsync();
var altpage = await browser.NewPageAsync(new()
            {
                ScreenSize = new ScreenSize { Width = width, Height = height }, 
                ViewportSize = new ViewportSize { Width = width, Height = 1080 } //let's set something different in Viewport height
            }) ;

var screenheight = await page.EvaluateAsync&lt;string&gt;(&quot;screen.height&quot;); // for firefox this value will be 1080 (ViewportSize Height )
var altscreenheight = await altpage.EvaluateAsync&lt;string&gt;(&quot;screen.height&quot;); // for firefox this value will be 1080 (ViewportSize Height )"><pre class="notranslate"><span class="pl-smi">var</span> <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-c1">1920</span><span class="pl-kos">;</span>
<span class="pl-smi">var</span> <span class="pl-s1">height</span> <span class="pl-c1">=</span> <span class="pl-c1">1200</span><span class="pl-kos">;</span>

<span class="pl-k">using</span> <span class="pl-smi">var</span> <span class="pl-s1">playwright</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> Playwright<span class="pl-kos">.</span><span class="pl-en">CreateAsync</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-k">await</span> <span class="pl-k">using</span> <span class="pl-smi">var</span> <span class="pl-s1">browser</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> playwright<span class="pl-kos">.</span>Firefox<span class="pl-kos">.</span><span class="pl-en">LaunchAsync</span><span class="pl-kos">(</span><span class="pl-k">new</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-s1">Headless</span> <span class="pl-c1">=</span> <span class="pl-c1">false</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-k">await</span> <span class="pl-k">using</span> <span class="pl-smi">var</span> <span class="pl-s1">context</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> browser<span class="pl-kos">.</span><span class="pl-en">NewContextAsync</span><span class="pl-kos">(</span><span class="pl-k">new</span><span class="pl-kos">(</span><span class="pl-kos">)</span>
<span class="pl-kos">{</span>
      <span class="pl-s1">ScreenSize</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> ScreenSize  <span class="pl-kos">{</span> <span class="pl-s1">Width</span> <span class="pl-c1">=</span> <span class="pl-s1">width</span><span class="pl-kos">,</span> <span class="pl-s1">Height</span> <span class="pl-c1">=</span> <span class="pl-s1">height</span> <span class="pl-kos">}</span><span class="pl-kos">,</span>
      <span class="pl-s1">ViewportSize</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> ViewportSize <span class="pl-kos">{</span> <span class="pl-s1">Width</span> <span class="pl-c1">=</span> <span class="pl-s1">width</span><span class="pl-kos">,</span> <span class="pl-s1">Height</span> <span class="pl-c1">=</span> <span class="pl-c1">1080</span><span class="pl-kos">}</span>  <span class="pl-c">//let's set something different in Viewport height</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">;</span>

<span class="pl-smi">var</span> <span class="pl-s1">page</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> context<span class="pl-kos">.</span><span class="pl-en">NewPageAsync</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-smi">var</span> <span class="pl-s1">altpage</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> browser<span class="pl-kos">.</span><span class="pl-en">NewPageAsync</span><span class="pl-kos">(</span><span class="pl-k">new</span><span class="pl-kos">(</span><span class="pl-kos">)</span>
            <span class="pl-kos">{</span>
                <span class="pl-s1">ScreenSize</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> ScreenSize <span class="pl-kos">{</span> <span class="pl-s1">Width</span> <span class="pl-c1">=</span> <span class="pl-s1">width</span><span class="pl-kos">,</span> <span class="pl-s1">Height</span> <span class="pl-c1">=</span> <span class="pl-s1">height</span> <span class="pl-kos">}</span><span class="pl-kos">,</span> 
                <span class="pl-s1">ViewportSize</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> ViewportSize <span class="pl-kos">{</span> <span class="pl-s1">Width</span> <span class="pl-c1">=</span> <span class="pl-s1">width</span><span class="pl-kos">,</span> <span class="pl-s1">Height</span> <span class="pl-c1">=</span> <span class="pl-c1">1080</span> <span class="pl-kos">}</span> <span class="pl-c">//let's set something different in Viewport height</span>
            <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">;</span>

<span class="pl-smi">var</span> <span class="pl-s1">screenheight</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> page<span class="pl-kos">.</span><span class="pl-smi">EvaluateAsync</span><span class="pl-c1">&lt;</span><span class="pl-smi">string</span><span class="pl-c1">&gt;</span><span class="pl-kos">(</span><span class="pl-s"><span class="pl-s">"</span>screen.height<span class="pl-s">"</span></span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// for firefox this value will be 1080 (ViewportSize Height )</span>
<span class="pl-smi">var</span> <span class="pl-s1">altscreenheight</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> altpage<span class="pl-kos">.</span><span class="pl-smi">EvaluateAsync</span><span class="pl-c1">&lt;</span><span class="pl-smi">string</span><span class="pl-c1">&gt;</span><span class="pl-kos">(</span><span class="pl-s"><span class="pl-s">"</span>screen.height<span class="pl-s">"</span></span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// for firefox this value will be 1080 (ViewportSize Height )</span></pre></div>
<h3 dir="auto">Playwright version</h3>
<p dir="auto">1.15.2-1633455481000</p>
<h3 dir="auto">Operating system</h3>
<p dir="auto">Windows</p>
<h3 dir="auto">What browsers are you seeing the problem on?</h3>
<p dir="auto">Firefox</p>
<h3 dir="auto">Other information</h3>
<p dir="auto">Python 3.1.0</p>
<h3 dir="auto">What happened? / Describe the bug</h3>
<p dir="auto">Passing <code class="notranslate">screen={'width': any_int, 'height': any_int}</code> to context, is not properly reflected, as <code class="notranslate">window.innerHeight</code> and <code class="notranslate">window.innerWidth</code> will still equal to <code class="notranslate">screen.height</code> and <code class="notranslate">screen.width</code> even if the values passed to viewport are different.</p>
<h3 dir="auto">Code snippet to reproduce your bug</h3>
<div class="highlight highlight-source-python notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.firefox.launch(headless=False)

    context = browser.new_context(
        screen={'width': 1280, 'height': 720},
        viewport={'width': 1280, 'height': 636}
    )
    page = context.new_page()"><pre class="notranslate"><span class="pl-k">from</span> <span class="pl-s1">playwright</span>.<span class="pl-s1">sync_api</span> <span class="pl-k">import</span> <span class="pl-s1">sync_playwright</span>

<span class="pl-k">with</span> <span class="pl-en">sync_playwright</span>() <span class="pl-k">as</span> <span class="pl-s1">p</span>:
    <span class="pl-s1">browser</span> <span class="pl-c1">=</span> <span class="pl-s1">p</span>.<span class="pl-s1">firefox</span>.<span class="pl-en">launch</span>(<span class="pl-s1">headless</span><span class="pl-c1">=</span><span class="pl-c1">False</span>)

    <span class="pl-s1">context</span> <span class="pl-c1">=</span> <span class="pl-s1">browser</span>.<span class="pl-en">new_context</span>(
        <span class="pl-s1">screen</span><span class="pl-c1">=</span>{<span class="pl-s">'width'</span>: <span class="pl-c1">1280</span>, <span class="pl-s">'height'</span>: <span class="pl-c1">720</span>},
        <span class="pl-s1">viewport</span><span class="pl-c1">=</span>{<span class="pl-s">'width'</span>: <span class="pl-c1">1280</span>, <span class="pl-s">'height'</span>: <span class="pl-c1">636</span>}
    )
    <span class="pl-s1">page</span> <span class="pl-c1">=</span> <span class="pl-s1">context</span>.<span class="pl-en">new_page</span>()</pre></div>
<h3 dir="auto">Relevant log output</h3>
<p dir="auto">Both <code class="notranslate">screen.height</code> and <code class="notranslate">window.innerHeight</code> will be 636 in this case, while <code class="notranslate">screen.height</code> should be 720.</p>