Problems testing a site with Quantcast Consent Modal

[symn]

Hi,
maybe someone can help me:

We test our site that contains a Quantcast consent modal and receive an error that window.__tcfapi is undefined.

This comment sums up the problem (#22948 (comment)):

it looks like window .__ tcfapi is part of an API in the service of GDPR: https://github.com/InteractiveAdvertisingBureau/GDPR-Transparency-and-Consent-Framework/blob/master/TCFv2/IAB%20Tech%20Lab%20-%20CMP%20API%20v2.md#how-does-the-cmp-provide-the-api

Within Cypress, your site will be loaded within an iframe, which may impact how you or third-parties execute code. Can you track down what logic should be defining window .__ tcfapi and whether or not it executes as expected when loaded in an iframe?

Before the update to [email protected] on [email protected], we were able to copy necessary functions into the window object that Cypress has access to via a workaround, like so:

Cypress.Commands.add('agreeQuantcastConsentModal', () => {
  const webUrl = getUiUrl('web');
  // Quantcast Consent v2.0 modal asynchronously creates functions on the `top`
  // window object that are not accessible from inside the Cypress test iframe. This
  // rewrites the functions from `top` window to the one Cypress tests can access.
  cy.on('window:before:load', win => {
    let __tcfapi;
    Object.defineProperty(win, '__tcfapi', {
      get: () => {
        if (!__tcfapi) {
          __tcfapi = win.top.__tcfapi;
        }
        return __tcfapi;
      },
      set: value => {
        __tcfapi = value;
      }
    });

    let __uspapi = undefined;
    Object.defineProperty(win, '__uspapi', {
      get: () => __uspapi,
      set: value => {
        __uspapi = value;
      }
    });
  });

  cy.visit(webUrl);
  cy.waitForDOMElement('qc-cmp2-ui');
  cy.contains('Agree', {matchCase: false}).click();
});

We'd run a

  beforeEach(() => {
    cy.agreeQuantcastConsentModal();
  });

However, this fails now. There is no problem in modifying the window object though. However, it seems like that Cypress internally now runs tests differently. window.top is no reliable frame anymore i guess. I noticed that the Cypress testing window does not refresh anymore for new tests but adds new (project) iframes. This might be a problem with my simple copy / paste mechanism. Any ideas how to combat this problem?

[tracy-ash]

I'm dealing with a similar problem.

We're using Retool, and use modals/popups to confirm user actions before those actions are executed.

In earlier versions of Cypress, I was able to reliably do this, where the div is in the modal/popup:

cy.get("#confirmdiv").find("h2").should.("contain", "OK")

Now, it may find the div occasionally, but mostly it cannot. And, because it's Retool, I don't have the means to set any id or attributes on the DOM elements.

What's the best way to access these modals/popups?