Question 267223 in Html Question posted in
Some basic documentation can be found here.

Html – How can I remove an overlay

I receive a series of product names from an API, which I input into the "Main Search Bar" repeatedly.

Main Search Bar

While emulating the behavior of a first-time visitor to the page, I encounter a pop-up overlay which renders all elements unresponsive, with the exception of itself.

Elements

The pop-up

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    This fixed my problem:

    cy.get('body').then(($body) => {
                      if ($body.find('.overlay').is(":visible")) {
                          cy.get('.overlay').click()
                      }
                  })

  2. 0

    You can also modify the element to not appear, assuming that the data-dr-hide attribute is what determines if the overlay appears.

    cy.get('.popup').invoke('attr', 'data-dr-hide', 'true')
  .should('have.attr', 'data-dr-hide', 'true');
// the `true` may or may not need to be in quotes

    If you can identify the cookie or local storage or session storage value that determines if you are a first-time visitor, it can also be beneficial to just load the page with that value set to whatever says you are not a first-time visitor.

    // pseudo-code
describe('My Tests', () => {
  beforeEach(() => {
    cy.visit('/url')
      .then(() => {
        window.localStorage.setItem('firstTimeVisitor', false);
        window.sessionStorage.setItem('firstTimeVisitor', false);
    }).setCookie('firstTimeVisitor', false);
  });

  it('validates X', () => {
    // code here
  });
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search