Skip to content

Commit

Permalink
test: update multiselect method (#1835)
Browse files Browse the repository at this point in the history 
- Fix #1840 
  - Change the height of where the cursor clicks
  - Add a small timeout
  • Loading branch information
@wusteven815
wusteven815 authored Feb 27, 2024
1 parent fe518ff commit e7c6b84
Showing 1 changed file with 51 additions and 42 deletions.
93 changes: 51 additions & 42 deletions tests/table-multiselect.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { expectContextMenus, gotoPage, openTable } from './utils';

const rowHeight = 19;
const columnHeight = 30;
const filterHeight = 30;
const filterHeight = 35;

async function waitForLoadingDone(
page: Page,
Expand All @@ -30,38 +30,43 @@ async function filterAndScreenshot(
filterType: string,
screenshotName: string
) {
// select the first 3 rows
await page.mouse.move(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight
);
await page.mouse.down();
await page.mouse.move(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight + rowHeight * 2
);
await page.mouse.up();
await page.mouse.click(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight + rowHeight * 2,
{ button: 'right' }
);
await expectContextMenus(page, 1);

// apply filter
await page.getByRole('button', { name: 'Filter by Values' }).hover();
await expectContextMenus(page, 2);
await page.getByRole('button', { name: filterType, exact: true }).click();
await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
await expect(page.locator('.iris-grid-column')).toHaveScreenshot(
screenshotName
);
await test.step('Select first 3 rows', async () => {
await page.mouse.move(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight
);
await page.mouse.down();
await page.mouse.move(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight + rowHeight * 2
);
await page.mouse.up();
await page.waitForTimeout(500);
await page.mouse.click(
gridLocation.x + 1,
gridLocation.y + 1 + columnHeight + filterHeight + rowHeight * 2,
{ button: 'right' }
);
await page.waitForTimeout(500);
await expectContextMenus(page, 1);
});

// reset
await page.keyboard.down('Control');
await page.keyboard.press('E');
await page.keyboard.up('Control');
await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
await test.step('Apply filter', async () => {
await page.getByRole('button', { name: 'Filter by Values' }).hover();
await expectContextMenus(page, 2);
await page.getByRole('button', { name: filterType, exact: true }).click();
await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
await expect(page.locator('.iris-grid-column')).toHaveScreenshot(

Check failure on line 59 in tests/table-multiselect.spec.ts

View workflow job for this annotation

GitHub Actions / build

[firefox] › table-multiselect.spec.ts:104:7 › multiselect number filters 

  3) [firefox] › table-multiselect.spec.ts:104:7 › multiselect number filters › Filter equal › Apply filter 
    Error: Screenshot comparison failed:

      782 pixels (ratio 0.01 of all image pixels) are different.

    Call log:
      - expect.toHaveScreenshot(number-1-equal.png) with timeout 15000ms
      -   verifying given screenshot expectation
      - waiting for locator('.iris-grid-column')
      -   locator resolved to <div class="iris-grid-column">…</div>
      - taking element screenshot
      -   disabled all CSS animations
      -   waiting for element to be visible and stable
      -   element is visible and stable
      - 782 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.iris-grid-column')
      -   locator resolved to <div class="iris-grid-column">…</div>
      - taking element screenshot
      -   disabled all CSS animations
      -   waiting for element to be visible and stable
      -   element is visible and stable
      - captured a stable screenshot
      - 782 pixels (ratio 0.01 of all image pixels) are different.

    Expected: /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts-snapshots/number-1-equal-firefox-linux.png
    Received: /home/runner/work/web-client-ui/web-client-ui/test-results/table-multiselect-multiselect-number-filters-firefox/number-1-equal-actual.png
        Diff: /home/runner/work/web-client-ui/web-client-ui/test-results/table-multiselect-multiselect-number-filters-firefox/number-1-equal-diff.png

      57 |     await page.getByRole('button', { name: filterType, exact: true }).click();
      58 |     await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
    > 59 |     await expect(page.locator('.iris-grid-column')).toHaveScreenshot(
         |                                                     ^
      60 |       screenshotName
      61 |     );
      62 |   });

        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:59:53
        at filterAndScreenshot (/home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:54:3)
        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:121:9
        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:120:7

Check failure on line 59 in tests/table-multiselect.spec.ts

View workflow job for this annotation

GitHub Actions / build

[firefox] › table-multiselect.spec.ts:104:7 › multiselect datetime filters 

  4) [firefox] › table-multiselect.spec.ts:104:7 › multiselect datetime filters › Filter is › Apply filter 
    Error: Screenshot comparison failed:

      1636 pixels (ratio 0.01 of all image pixels) are different.

    Call log:
      - expect.toHaveScreenshot(datetime-1-is.png) with timeout 15000ms
      -   verifying given screenshot expectation
      - waiting for locator('.iris-grid-column')
      -   locator resolved to <div class="iris-grid-column">…</div>
      - taking element screenshot
      -   disabled all CSS animations
      -   waiting for element to be visible and stable
      -   element is visible and stable
      - 1636 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.iris-grid-column')
      -   locator resolved to <div class="iris-grid-column">…</div>
      - taking element screenshot
      -   disabled all CSS animations
      -   waiting for element to be visible and stable
      -   element is visible and stable
      - captured a stable screenshot
      - 1636 pixels (ratio 0.01 of all image pixels) are different.

    Expected: /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts-snapshots/datetime-1-is-firefox-linux.png
    Received: /home/runner/work/web-client-ui/web-client-ui/test-results/table-multiselect-multiselect-datetime-filters-firefox/datetime-1-is-actual.png
        Diff: /home/runner/work/web-client-ui/web-client-ui/test-results/table-multiselect-multiselect-datetime-filters-firefox/datetime-1-is-diff.png

      57 |     await page.getByRole('button', { name: filterType, exact: true }).click();
      58 |     await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
    > 59 |     await expect(page.locator('.iris-grid-column')).toHaveScreenshot(
         |                                                     ^
      60 |       screenshotName
      61 |     );
      62 |   });

        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:59:53
        at filterAndScreenshot (/home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:54:3)
        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:121:9
        at /home/runner/work/web-client-ui/web-client-ui/tests/table-multiselect.spec.ts:120:7
screenshotName
);
});

await test.step('Reset filter', async () => {
await page.keyboard.down('Control');
await page.keyboard.press('E');
await page.keyboard.up('Control');
await waitForLoadingDone(page, '.iris-grid-loading-status-bar');
});
}

// these are select filters that do not do multiselect
Expand Down Expand Up @@ -103,19 +108,23 @@ function runMultiSelectFilter(
if (gridLocation === null) return;

// activate the quick filter to get that text as well
await page.mouse.click(gridLocation.x + 805, gridLocation.y + 1);
await page.keyboard.down('Control');
await page.keyboard.press('F');
await page.keyboard.up('Control');
await test.step('Show quick filter step', async () => {
await page.mouse.click(gridLocation.x + 805, gridLocation.y + 1);
await page.keyboard.down('Control');
await page.keyboard.press('F');
await page.keyboard.up('Control');
});

/* eslint-disable no-await-in-loop */
for (let i = 0; i < filters.length; i += 1) {
await filterAndScreenshot(
page,
gridLocation,
filters[i].filter,
`${columnType}-${i + 1}-${filters[i].name}.png`
);
await test.step(`Filter ${filters[i].name}`, async () => {
await filterAndScreenshot(
page,
gridLocation,
filters[i].filter,
`${columnType}-${i + 1}-${filters[i].name}.png`
);
});
}
/* eslint-enable no-await-in-loop */
});
Expand Down

0 comments on commit e7c6b84

Please sign in to comment.