'Uncaught object' error when previously clicked element is removed from the DOM and it is an <a> or <area> element

egorshantur commented 4 weeks ago

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.

github-actions[bot] commented 3 weeks ago

We appreciate you taking the time to share information about this issue. We reproduced the bug and added this ticket to our internal task queue. We'll update this thread once we have news.

Vitalii4as commented 2 weeks ago

Seems like I have the same issue

"{"callsite":{"filename":"../commonScripts.js","lineNum":373,"callsiteFrameIdx":5,"stackFrames":[{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}],"isV8Frames":true}}"

DevExpress / testcafe