"Your callback function returned a promise which never resolved" error with cy.queryByText()

[testing-library]

"Your callback function returned a promise which never resolved" error with cy.queryByText()

[NicholasBoll]

I'm a little late to the party. I introduced some changes to the way these Cypress Custom commands work. Is this still an issue in 5.2.1?

I know for sure the original error shouldn't happen, because the .then was removed in #108 (lines here: https://github.com/testing-library/cypress-testing-library/pull/108/files#diff-1fdf421c05c1140f6d71444ea2b27638L75-L77)

In fact, since moving to 5.0.0 I'm seeing these failures when I wasn't before. Unhelpfully, I now no longer which command actually failed.

Hopefully this is no longer an issue. That's what #108 sought to address - better debugging of failures.

My recommendation is to change all query* to find*. query* commands do not retry until success like find* queries do and like all other built-in Cypress commands. They will pass or fail almost instantly. They also can be a little flaky because technically in @testing-library/dom query* commands are synchronous and all Cypress commands are asynchronous. query* queries try to mimic synchronous behavior by executing asap and not retrying. If your application is a bit slower for whatever reason, query could fail.

The changes introduced in 5.2.1 could fail where previously they passed, but not because the previous logic was correct, but because query* never failed if it didn't find what you were looking for. If query* failed to find an element, it would return an empty object. So the following would never fail before but does now:

cy.queryByText('Does not exist').should('exist')

[sompylasar]

I remember this piece of code, I think I wrote it. At that time I never used "should not exist" and I wonder why does it not take care of the timeout inside Cypress. The timeout was originally meant to wait for the element to exist.

[sompylasar]

Nope, at the time of writing there was no timeout ef22f87#diff-1fdf421c05c1140f6d71444ea2b27638R20

The timeout appears later ec3b712#diff-1fdf421c05c1140f6d71444ea2b27638R43

CC @npeterkamps

[vfernandestoptal]

Removing the timeout option on the call to then() will cause an issue when specifying a timeout value larger than the default command timeout.

I think the original problem happens when waitForElement takes longer than 100ms to queue and execute the timeout code, but I can't figure out a way to avoid or recover from that.

Adding more than 100ms might make the issue less frequent, but it is not a sure way to avoid it :(

[alexkrolick]

Is this still an issue after the changes to retries in #78 ?

[jagregory]

Still an issue.

In fact, since moving to 5.0.0 I'm seeing these failures when I wasn't before. Unhelpfully, I now no longer which command actually failed.

CypressError: cy.then() timed out after waiting '4000ms'.

Your callback function returned a promise which never resolved.

The callback function was:

thenArgs => {
        const getValue = () => {
          const value = commandImpl(thenArgs.document);
          const result = Cypress.$(value); // Overriding the selector of the jquery object because it's displayed in the long message of .should('exist') failure message
          // Hopefully it makes it clearer, because I find the normal response of "Expected to find element '', but never found it" confusing

          result.selector = `${queryName}(${queryArgument(args)})`;

          if (result.length > 0) {
            consoleProps.yielded = result.toArray();
          }

          return result;
        };

        const resolveValue = () => {
          // retry calling "getValue" until following assertions pass or this command times out
          return Cypress.Promise.try(getValue).then(value => {
            return cy.verifyUpcomingAssertions(value, waitOptions, {
              onRetry: resolveValue
            });
          });
        };

        if (queryRegex.test(queryName)) {
          // For get* queries, do not retry
          return getValue();
        }

        return resolveValue().then(subject => {
          // Remove the error that occurred because it is irrelevant now
          if (consoleProps.error) {
            delete consoleProps.error;
          }

          return subject;
        });

[kentcdodds]

I think we're safe to close this now. If this is still a problem for anyone please open a new issue. Thanks!