Ryan113
Ryan113

Reputation: 686

TestCafe visibilityCheck does not wait for element to appear

I am trying to get TestCafe to wait for an element to appear in the dom. Currently I am using { visibilityCheck: true } but it does not seem to do anything and the test will time out and be considered a failure.

Goals:

  1. Go to page
  2. Wait for searchIconElement to load

Code:

fixture`Library /all`.page(page.libraryScreen).beforeEach(async t => {
  await t.useRole(page.adminUser);
});

test('Search Bar', async t => {
  const searchIcon = Selector('div').withAttribute('class', 'CampaignsPage-fab1');
  const searchIconElement = searchIcon.with({ visibilityCheck: true })();
  const microAppNameInput = Selector('input').withAttribute('placeholder', 'Search');
  const microAppTitle = Selector('div').withAttribute('class', 'SetCard-title ').innerText;
  
  await t
    .click(searchIconElement)
    .typeText(microAppNameInput, testMicroAppTitle)
    .expect(microAppTitle)
    .eql(testMicroAppTitle);
});

Upvotes: 1

Views: 1429

Answers (2)

VysakhMohan
VysakhMohan

Reputation: 567

try adding timeout

const searchIconElement = searchIcon.with({ visibilityCheck: true }).with({ timeout: 10000 });

Upvotes: 2

Dmitry Ostashev
Dmitry Ostashev

Reputation: 2348

When a selector is passed to a test action as the target element's identifier, the target element should be visible regardless of the visibilityCheck option. If the target element becomes visible too late, you can try to increase the selector timeout.

Upvotes: 1

Related Questions