I have the following code:
it('7.1.8 - In Platform admin could review all ongoing and published notifications', async () => {
const allNotificationList = await page.waitForXPath(
'//header[contains(@class,"ant-layout-header")]//ul[contains(@class,"Notifications_banner-notifications")]',
);
expect(allNotificationList.length).not.toBe(0);
});
allNotificationList gets the ul tag and I want to check how many li tag are under the selected ul tag.
Does anyone knows how to achieve this using Puppetter?
You can use page.$x (or someElement.$x) to return an ElementHandle[] (page.waitForXPath returns a single ElementHandle):
const allNotificationList = await page.$x(
'//header[contains(@class,"ant-layout-header")]//ul[contains(@class,"Notifications_banner-notifications")]',
);
expect(allNotificationList.length).not.toBe(0);
I don't think it actually waits for the elements though, so you might want to add the following line first:
await page.waitForXPath(
'//header[contains(@class,"ant-layout-header")]//ul[contains(@class,"Notifications_banner-notifications")]',
);
I have no solution for this with Xpath, but if you are open to shape the Xpath to CSS selector, then the following will do what you need. Using childElementCount.
const selector = 'header.ant-layout-header * ul.Notifications_banner-notifications'
const childCount = await page.$eval(selector, el => el.childElementCount)
expect(childCount).toBeGreaterThan(0)
(await page.$$('.Notifications_banner-notifications li')).length