Unable to take screenshot warning on Safari 15.1 macOS 12.0.1

[matejlukac]

What is your Scenario?

We have a set of tests which are passing on Big Sur 11.6 Safari 15.0, taking screenshots during run.
When running tests on macOS 12.0.1 Monterey, we encounter warning, which prevents tests from further execution.

What is the Current behavior?

When taking screenshot during a test on macOS 12.0.1 Monterey Safari 15.1, warning is logged and the test won't continue.

Warning:
Was unable to take a screenshot due to an error.

Error: Unable to locate the page area in the browser window screenshot at
../draft-client/artifacts/screenshots/Popover closes and
opens on button click/1.png, because the page area mark with ID 2348873566
is not found in the screenshot.

What is the Expected behavior?

1. When taking screenshot during test on macOS 12.0.1 Monterey Safari 15.1, no warning is logged when taking screenshots.
2. Logging warning should not prevent the rest of the test from execution

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

www.github.com

What is your TestCafe test code?

fixture('Screenshots')
.page('http://github.com');

test.only('make abusive amount of screenshots', async (t) => {
await t
.takeScreenshot()
.navigateTo('http://google.com')
.takeScreenshot()
.navigateTo('http://github.com')
.takeScreenshot();
});

Your complete configuration file

module.exports = {
screenshots: {
path: 'artifacts/screenshots',
pathPattern: '${TEST}/${FILE_INDEX}.png',
},
browsers: (process.platform === 'darwin') ? 'safari' : 'chrome',
src: '**/*.uitest.ts',
port1: 4445,
port2: 4446,
clientScripts: [
{
module: '@testing-library/dom/dist/@testing-library/dom.umd.js',
},
],
compilerOptions: {
typescript: {
configPath: './test/testcafe/tsconfig.testcafe.json',
customCompilerModulePath: '../../node_modules/typescript',
options: {
esModuleInterop: true,
lib: [
'../../../client/@types/global.d.ts',
],
},
},
},
};

Your complete test report

cross-env TEST_BASE_URL=http://localhost:3000 testcafe --config-file test/testcafe/testcafe.config.js

Running tests in:

• Safari 15.1 / macOS 10.15.7

Popover
✓ Popover closes and opens on button click

1 passed (3s)

Warnings (1):

Was unable to take a screenshot due to an error.

Error: Unable to locate the page area in the browser window screenshot at
../draft-client/artifacts/screenshots/Popover closes and
opens on button click/1.png, because the page area mark with ID 2348873566
is not found in the screenshot.
at calculateClipInfo
(../draft-client/node_modules/testcafe/src/screenshots/crop.js:119:19)
at Object.cropScreenshot
(../draft-client/node_modules/testcafe/src/screenshots/crop.js:136:18)
at
../draft-client/node_modules/testcafe/src/screenshots/capturer.js:152:40
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at Capturer._capture
(../draft-client/node_modules/testcafe/src/screenshots/capturer.js:133:9)
at Capturer.captureAction
(../draft-client/node_modules/testcafe/src/screenshots/capturer.js:186:16)
at BrowserManipulationQueue._takeScreenshot
(../draft-client/node_modules/testcafe/src/test-run/browser-manipulation-queue.js:55:20)
at BrowserManipulationQueue._executeCommand
(../draft-client/node_modules/testcafe/src/test-run/browser-manipulation-queue.js:72:24)
at BrowserManipulationQueue.executePendingManipulation
(../draft-client/node_modules/testcafe/src/test-run/browser-manipulation-queue.js:112:24)
at TestRun.ready-for-browser-manipulation
(../draft-client/node_modules/testcafe/src/test-run/index.ts:1500:22)

Screenshots

No response

Steps to Reproduce

1. Run test from example test code on macOS Monterey, Safari 15.1
2. The test logs warning and create only 1 screenshot

TestCafe version

1.17.1

Node.js version

16.13.0

Command-line arguments

cross-env TEST_BASE_URL=http://localhost:3000 testcafe --config-file test/testcafe/testcafe.config.js

Browser name(s) and version(s)

Safari 15.1

Platform(s) and version(s)

macOS 12.0.1 Monterey

Other

In the complete test log there is a line
Running tests in: - Safari 15.1 / macOS 10.15.7

I am not sure why testcafe thinks the os is macOS 10.15.7. The actual os is macOS 12.0.1

A similar issue has been created and is now closed. However, the problem is still active and makes tests with screenshots not possible on mac 12.

[AlexanderMoiseev]

Hello,

Unfortunately, we could not reproduce this behavior even with your configuration.
I see the warnings, but for me they do not prevent tests from execution as you described. Are you sure you don't have any errors during test execution, only warnings?
Please send us an example project and a video to show how you reproduce the issue. Make sure that the callstack with the problem and a folder with screenshots are visible.

[github-actions]

This issue has been automatically marked as stale because it has not had any activity for a long period. It will be closed and archived if no further activity occurs. However, we may return to this issue in the future. If it still affects you or you have any additional information regarding it, please leave a comment and we will keep it open.

[github-actions]

We're closing this issue after a prolonged period of inactivity. If it still affects you, please add a comment to this issue with up-to-date information. Thank you.