Screenshots not higher then 963px when running in docker on node 20.5.0

[Aringil]

Current behavior

When using Cypress with the latest node version (20.5), the screenshots made in the docker-image when the test fails aren't higher than 963px.

I'll define in the cypress config a viewportHeight of 1080px (to reproduce fullHD screensize), but screenshots never get bigger than 963px. Using the older node version (18.15) gives screenshots of 1080px height.

Desired behavior

Screenshots should be the correct height of the viewport.

Test code to reproduce

Testable by using the docker-images cypress-13.0.0-node-18.15.0-chrome-106.0.5249.61-1-ff-99.0.1-edge-114.0.1823.51-1 vs cypress-13.0.0-node-20.5.0-chrome-114.0.5735.133-1-ff-114.0.2-edge-114.0.1823.51-1

I hope it works to upload both repo's, but otherwise here are the files in the repo's:

Cypress test repo

cypress.config.ts:

import { defineConfig } from "cypress";

module.exports = defineConfig({
  viewportWidth: 1920,
  viewportHeight: 1080,
  e2e: {
    baseUrl: "https://www.google.com",
    setupNodeEvents(on, config) {
      on(
        "before:browser:launch",
        (
          browser = {
            name: "chrome",
            family: "chromium",
            channel: "",
            displayName: "",
            version: "",
            majorVersion: "",
            path: "",
            isHeaded: false,
            isHeadless: false,
          },
          launchOptions
        ) => {
          if (browser.name === "chrome" && browser.isHeadless) {
            launchOptions.args.push("--window-size=1920,1080");
            return launchOptions;
          }
          if (browser.name === "firefox" && browser.isHeadless) {
            launchOptions.args.push("--width=1920");
            launchOptions.args.push("--height=1080");
            return launchOptions;
          }
        }
      );
    },
  },
});

package.json:

{
  "name": "test-cypress",
  "version": "0.1.0",
  "description": "test Cypress",
  "license": "MIT",
  "private": true,
  "scripts": {
    "test": "docker compose -f cypress.yml run cypress"
  },
  "dependencies": {
    "cypress": "13.0.0",
    "jest": "26.6.3",
    "typescript": "5.1.6"
  },
  "devDependencies": {
    "@types/jest": "29.0.3"
  }
}

test.cy.ts:

//this test always fail
describe("Google-homepage", () => {
  it(`texarea should not be visible`, () => {
    cy.visit("/");
    cy.get("textarea").should("not.be.visible");
  });
});

cypress.yml

services:
  cypress:
    image: <url to image location>/cypress/release/13.0.0:latest
    working_dir: /e2e
    entrypoint: /bin/bash
    command: -c "cypress run --browser chrome --config specPattern='cypress/e2e/'"
    volumes:
      - ./cypress:/e2e/cypress
      - ./tsconfig.json:/e2e/tsconfig.json
      - ./cypress.config.ts:/e2e/cypress.config.ts

Cypress Image builder repo

package.json

{
  "name": "cypress-image",
  "version": "0.1.0",
  "description": "test Cypress image",
  "license": "MIT",
  "private": true,
  "dependencies": {
    "typescript": "^5.1.6"
  },
  "packageManager": "[email protected]"
}

Dockerfile

FROM cypress/included:cypress-13.0.0-node-20.5.0-chrome-114.0.5735.133-1-ff-114.0.2-edge-114.0.1823.51-1
## FROM cypress/included:cypress-13.0.0-node-18.15.0-chrome-106.0.5249.61-1-ff-99.0.1-edge-114.0.1823.51-1
COPY . .
RUN yarn install

Cypress test repo.zip

Cypress Version

13.0.0, 13.1.0, 13.2.0

Node version

20.5.0

Operating System

Windows 10

Debug Logs

No response

Other

No response

[Aringil]

@nagash77 Sorry to disturb, but is there any progress in fixing this issue?

[Aringil]

I've also tested using the node-20.6.1 image (https://hub.docker.com/layers/cypress/included/cypress-13.2.0-node-20.6.1-chrome-116.0.5845.187-1-ff-117.0-edge-116.0.1938.76-1/images/sha256-8275e12eb5301ec33188420be055a06a8f5e447120119f990822238f2caca2fc?context=explore) but this didn't fix the issue.

[cypress-app-bot]

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

[Aringil]

I still have the same issue with Cypress 13.4.0 and Node 20.11.

[cypress-app-bot]

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

[Aringil]

Unfortunatly this issue still exists on Cypress 13.15.0 with Node 20.17.0 (although the images are now 941 pixels in height).