Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

resizeWindow fails to resize the window on chrome:headless without reporting an error

See original GitHub issue

What is your Scenario?

I want to run some tests for different window sizes, so some tests will start with .resizeWindow(x, y);.

What is the Current behavior?

The test fails, because the expected UI for the specified window size doesn’t exist, because the command .resizeWindow didn’t actually resize the window.

What is the Expected behavior?

The window should resize correctly, and the test should pass.

What is your public website URL? (or attach your complete example)

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    div.small {
      display: none;
    }
    @media only screen and (max-width: 600px) {
      div.small {
        display: block;
      }
      div.large {
        display: none;
      }
    }
  </style>
  <title>.resizeWindow</title>
</head>
<body>
  <div class="large">
    <h1>Large screen</h1>
  </div>
  <div class="small">
    <h1>Small screen</h1>
  </div>
</body>
</html>

What is your TestCafe test code?

import { Selector } from 'testcafe';

const url = 'http://127.0.0.1:3000/index.html';

fixture`resizeWindow issue test`
  .page`${url}`
  .beforeEach(async t => {
    await t.resizeWindow(1280, 800)
    return t;
  });

test('test for large screen', async t => {
  await t
    .expect(Selector('.large').visible).ok()
    .expect(Selector('.small').visible).notOk();
});
test('test for small screen', async t => {
  await t
    .resizeWindow(480, 800)
    .expect(Selector('.small').visible).ok()
    .expect(Selector('.large').visible).notOk();
});

Your complete configuration file

no configuration file

Your complete test report

yarn run v1.22.17
$ testcafe chrome:headless test
 Running tests in:
 - Chrome 98.0.4758.80 / Linux 0.0

 resizeWindow issue test
 ✓ test for large screen
 ✖ test for small screen

   1) AssertionError: expected false to be truthy

      Browser: Chrome 98.0.4758.80 / Linux 0.0

         15 |    .expect(Selector('.small').visible).notOk();
         16 |});
         17 |test('test for large screen', async t => {
         18 |  await t
         19 |    .resizeWindow(480, 800)
       > 20 |    .expect(Selector('.small').visible).ok()
         21 |    .expect(Selector('.large').visible).notOk();
         22 |});
         23 |

         at <anonymous> (/home/ccheraa/Test/resize-window-issue/test/resize.spec.ts:20:41)
         at <anonymous> (/home/ccheraa/Test/resize-window-issue/test/resize.spec.ts:8:71)
         at __awaiter (/home/ccheraa/Test/resize-window-issue/test/resize.spec.ts:4:12)
         at <anonymous> (/home/ccheraa/Test/resize-window-issue/test/resize.spec.ts:17:41)



 1/2 failed (7s)
error Command failed with exit code 1.

Screenshots

No response

Steps to Reproduce

run a local server serving the html file
run the test

TestCafe version

1.18.3

Node.js version

14.17

Command-line arguments

chrome:headless test/resize.spec.ts

Browser name(s) and version(s)

Chrome 98.0.4758.102

Platform(s) and version(s)

Ubuntu 21.10

Other

No response

Issue Analytics

State:
Created 2 years ago
Reactions:4
Comments:5

Top GitHub Comments

1reaction

marmourecommented, Oct 4, 2022

@mcmeeking check out the work around provided here

0reactions

Aleksey28commented, Sep 26, 2022

Hi @Klaster1,

Thank you for the workaround.

Top Results From Across the Web

Unable to resize window running TestCafe on Chrome headless

I'm having an error when trying to ...

Chrome headless mode doesn't support resizing - Archive

Hello team, Chrome headless mode doesn't seem to support resizing so WebUI. ... not supporting resizing: Headless mode, cannot resize window ...

Unable to set window size in Headless Chrome (Selenium)

Hi all, I'm trying to run Headless Chrome so that I can run our Robot Selenium tests in Docker. But the default window...

WebDriver - Codeception - Documentation

To enable headless mode (launch tests without showing a window) for Chrome browser using ... docker run --net=host --shm-size 2g selenium/standalone-chrome.

Browsers | Concepts | Guides | Docs - TestCafe

testcafe "chrome:headless" tests/sample-fixture.js ... Note that Take screenshot and Resize window are fully supported in headless mode.