'Uncaught object' error when previously clicked element is removed from the DOM and it is an <a> or <area> element #8264
Description
What is your Scenario?
TestCafe (proxy mode) fails with 'Uncaught object' error on leaveElement when the prevElement is removed from the DOM, and it (or its parent, which is also removed) is an <a> or <area> element. The issue happens because subsequent getParent hammerhead's code returns "host", which is a string representing the host in case of <a> and <area> elements, not an element. This causes a failure when attempting to get its parent again using nativeMethods.nodeParentNodeGetter.call(el).
From the user's perspective, it appears that TestCafe attempts to move the mouse very slowly to the next element and then fails with an Uncaught object error.
Issue is not reproducible in native automation mode.
What is the Current behavior?
Test execution fails with error:
1) Uncaught object
"{"callsite":{"filename":"C:\\work\\git\\testcafe-callsite-issue\\test.js","lineNum":6,"callsiteFrameIdx":5,"stackFrames":[{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}],"isV8Frames":true}}"
was thrown. Throw Error instead.
What is the Expected behavior?
Testcafe should execute test commands without error
What is the public URL of the test page? (attach your complete example)
Test page to reproduce the issue
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Link Removal Example</title>
</head>
<body>
<a href="https://www.google.com" id="link">Click me to remove</a>
<button id="btn">Button</button>
<script>
document.getElementById('link').addEventListener('click', function(event) {
event.preventDefault(); // Prevent the default link behavior
this.remove(); // Remove the link element from the page
});
</script>
</body>
</html>
What is your TestCafe test code?
fixture('TestCafe Callsite Issue')
.page('./page.html');
test('Test link removal', async t => {
await t
.click('#link')
.click('#btn');
});
Your complete configuration file
No response
Your complete test report
No response
Screenshots
No response
Steps to Reproduce
- Clone/download the repository: https://github.com/egorshantur/testcafe-callsite-issue
- Run the following command:
npm install - Run the test:
npm run test
TestCafe version
^3.4.0
Node.js version
No response
Command-line arguments
testcafe chrome test.js --disable-native-automation
Browser name(s) and version(s)
No response
Platform(s) and version(s)
No response
Other
Tests running in proxy mode began failing after upgrading to version 3.4.0 or higher. The last version without this issue was 3.3.0.
I found that the issue is reproducible after the following change: DevExpress/testcafe#7995
If add removed code back, then test does not fail
const prevElementInDocument = prevElement && domUtils.isElementInDocument(prevElement);
const prevElementInRemovedIframe = prevElement && domUtils.isElementInIframe(prevElement) &&
!domUtils.getIframeByElement(prevElement);
if (!prevElementInDocument || prevElementInRemovedIframe)
prevElement = null;
Based on the description "removed IE leftovers from src\client\automation," it should not affect my tests as I run them in Chrome. However, it did affect them, so I reviewed the code that was originally executed for all browsers but was removed in that commit, and identified the issue.