Fix e2e tests

chanzuckerberg · May 6, 2022 · 02103d1 · 02103d1
1 parent 47213d5
commit 02103d1
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 6 deletions.
diff --git a/frontend/tests/pages/home/filter.test.ts b/frontend/tests/pages/home/filter.test.ts
@@ -71,11 +71,13 @@ async function getOptions(labels: string[]) {
 
 async function getChips(filterKey: FilterKey, labels: string[]) {
   const labelSet = new Set(labels);
-  const chipNodes = await page.$$(`[data-filter=${filterKey}] .MuiChip-root`);
+  const chipNodes = await page.$$(
+    `[data-filter=${filterKey}] .MuiChip-root:visible`,
+  );
   const result: string[] = [];
 
   for (const node of chipNodes) {
-    const labelNode = await node.$('.MuiChip-label');
+    const labelNode = await node.$('.MuiChip-label:visible');
     const label = await labelNode?.textContent();
     if (label && labelSet.has(label)) {
       result.push(label);
@@ -149,6 +151,7 @@ async function testPluginFilter({
   async function testClearAll() {
     await page.goto(getSearchUrl(...params));
     await openAccordion();
+    await page.waitForTimeout(500);
     let chipLabels = await getChips(filterKey, options);
     expect(chipLabels).toEqual(options);
 

diff --git a/frontend/tests/pages/home/pagination.test.ts b/frontend/tests/pages/home/pagination.test.ts
@@ -12,6 +12,7 @@ function hasPageQueryParameter(pageValue: number) {
 async function getResultNames() {
   const nameNodes = await getSearchResultNames();
   const names = await Promise.all(nameNodes.map((node) => node.textContent()));
+
   return names;
 }
 
@@ -160,6 +161,7 @@ describe('Plugin Pagination', () => {
     await page.waitForNavigation();
     await page.goBack();
     await page.waitForNavigation();
+    await page.waitForTimeout(500);
     await testResults({
       page: 2,
       totalPages: 3,

diff --git a/frontend/tests/pages/home/search.test.ts b/frontend/tests/pages/home/search.test.ts
@@ -46,7 +46,7 @@ describe('Plugin Search', () => {
 
   it('should clear query when clicking on app bar home link', async () => {
     await page.goto(getSearchUrl([SearchQueryParams.Search, 'video']));
-    await page.click('[data-testid=appBarHome]');
+    await page.click('[data-testid=appBarHome]:visible');
     await expect(await getFirstSearchResultName()).not.toHaveText(
       'napari_video',
     );
@@ -62,7 +62,8 @@ describe('Plugin Search', () => {
       [SearchQueryParams.Sort, SearchSortType.Relevance],
     );
     expect(page.url()).toEqual(expectedUrl);
-    await expect(await getFirstSearchResultName()).toHaveText('napari_video');
+    await page.waitForTimeout(500);
+    await expect(await getFirstSearchResultName()).toMatchText('napari_video');
   });
 
   it('should maintain search query when navigating back', async () => {
@@ -74,6 +75,7 @@ describe('Plugin Search', () => {
 
     await page.goBack();
     await page.waitForNavigation();
+    await page.waitForTimeout(500);
 
     expect(getQueryParameterValues(SearchQueryParams.Search)).toContain(query);
     await expect(await getFirstSearchResultName()).toHaveText('napari_video');

diff --git a/frontend/tests/pages/home/utils.ts b/frontend/tests/pages/home/utils.ts
@@ -5,11 +5,11 @@ import { breakpoints } from '@/theme';
  * @returns The first search result name.
  */
 export function getFirstSearchResultName() {
-  return page.$('[data-testid=searchResultName]');
+  return page.$('[data-testid=searchResultName]:visible');
 }
 
 export function getSearchResultNames() {
-  return page.$$('[data-testid=searchResultName]');
+  return page.$$('[data-testid=searchResultName]:visible');
 }
 
 /**