Skip to content

Commit

Permalink
Hide scroll to bottom button in pinned message e2e test (#28255)
Browse files Browse the repository at this point in the history 
* Hide scroll to bottom button in pinned message e2e test

* Remove redundant mask

* Update playwright/e2e/pinned-messages/pinned-messages.spec.ts

Co-authored-by: Michael Telatynski <[email protected]>

---------

Co-authored-by: Michael Telatynski <[email protected]>
  • Loading branch information
@florianduros @t3chguy
florianduros and t3chguy authored Oct 22, 2024
1 parent 1ec2f92 commit 539025c
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 0 deletions.
6 changes: 6 additions & 0 deletions playwright/e2e/pinned-messages/pinned-messages.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,12 @@ test.describe("Pinned messages", () => {
const tile = util.getEventTile("Msg1");
await expect(tile).toMatchScreenshot("pinned-message-Msg1.png", {

Check failure on line 32 in playwright/e2e/pinned-messages/pinned-messages.spec.ts

View workflow job for this annotation

GitHub Actions / Run Tests 2/6

pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

  1) pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 
    Error: Screenshot comparison failed:

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

    Expected: /home/runner/work/element-web/element-web/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png
    Received: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline/pinned-message-Msg1-actual.png
        Diff: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline/pinned-message-Msg1-diff.png

    Call log:
      - expect.toHaveScreenshot(pinned-message-Msg1.png) with timeout 5000ms
      -   verifying given screenshot expectation
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" data-event-id="$8ShQEOtXL8_srR9-WoRdyz5kxR4A-r1ElzYhKhjEBOQ" class="mx_EventTile mx_EventTile_last mx_EventTile_lastInSection" data-scroll-tokens="$8ShQEOtXL8_srR9-WoRdyz5kxR4A-r1ElzYhKhjEBOQ">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      -   element is not stable
      - retrying scroll into view action, attempt #1
      -   waiting for element to be stable
      - 41 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" class="mx_EventTile mx_EventTile_lastInSection" data-event-id="$8ShQEOtXL8_srR9-WoRdyz5kxR4A-r1ElzYhKhjEBOQ" data-scroll-tokens="$8ShQEOtXL8_srR9-WoRdyz5kxR4A-r1ElzYhKhjEBOQ">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      - captured a stable screenshot
      - 41 pixels (ratio 0.01 of all image pixels) are different.


      30 |
      31 |         const tile = util.getEventTile("Msg1");
    > 32 |         await expect(tile).toMatchScreenshot("pinned-message-Msg1.png", {
         |                            ^
      33 |             mask: [tile.locator(".mx_MessageTimestamp")],
      34 |             css: `
      35 |                 // Hide the jump to bottom button in the timeline to avoid flakiness

        at /home/runner/work/element-web/element-web/playwright/e2e/pinned-messages/pinned-messages.spec.ts:32:28

Check failure on line 32 in playwright/e2e/pinned-messages/pinned-messages.spec.ts

View workflow job for this annotation

GitHub Actions / Run Tests 2/6

pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

  1) pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 
    Error: Screenshot comparison failed:

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

    Expected: /home/runner/work/element-web/element-web/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png
    Received: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline/pinned-message-Msg1-actual.png
        Diff: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline/pinned-message-Msg1-diff.png

    Call log:
      - expect.toHaveScreenshot(pinned-message-Msg1.png) with timeout 5000ms
      -   verifying given screenshot expectation
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" data-event-id="$WZJ5Vk-oKW013CpKQC15MTROKvRuzz2Mb4lyND7fiKk" class="mx_EventTile mx_EventTile_last mx_EventTile_lastInSection" data-scroll-tokens="$WZJ5Vk-oKW013CpKQC15MTROKvRuzz2Mb4lyND7fiKk">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      -   element is not stable
      - retrying scroll into view action, attempt #1
      -   waiting for element to be stable
      - 41 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" class="mx_EventTile mx_EventTile_lastInSection" data-event-id="$WZJ5Vk-oKW013CpKQC15MTROKvRuzz2Mb4lyND7fiKk" data-scroll-tokens="$WZJ5Vk-oKW013CpKQC15MTROKvRuzz2Mb4lyND7fiKk">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      - captured a stable screenshot
      - 41 pixels (ratio 0.01 of all image pixels) are different.


      30 |
      31 |         const tile = util.getEventTile("Msg1");
    > 32 |         await expect(tile).toMatchScreenshot("pinned-message-Msg1.png", {
         |                            ^
      33 |             mask: [tile.locator(".mx_MessageTimestamp")],
      34 |             css: `
      35 |                 // Hide the jump to bottom button in the timeline to avoid flakiness

        at /home/runner/work/element-web/element-web/playwright/e2e/pinned-messages/pinned-messages.spec.ts:32:28

Check failure on line 32 in playwright/e2e/pinned-messages/pinned-messages.spec.ts

View workflow job for this annotation

GitHub Actions / Run Tests 2/6

pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

  1) pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

    Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
    Error: Screenshot comparison failed:

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

    Expected: /home/runner/work/element-web/element-web/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png
    Received: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline-retry1/pinned-message-Msg1-actual.png
        Diff: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline-retry1/pinned-message-Msg1-diff.png

    Call log:
      - expect.toHaveScreenshot(pinned-message-Msg1.png) with timeout 5000ms
      -   verifying given screenshot expectation
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" class="mx_EventTile mx_EventTile_lastInSection" data-event-id="$jW_Pk8jkkWytcY3kj-yuA-_Gm_h8m9ZtKQj8qoluPVo" data-scroll-tokens="$jW_Pk8jkkWytcY3kj-yuA-_Gm_h8m9ZtKQj8qoluPVo">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      - 41 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" class="mx_EventTile mx_EventTile_lastInSection" data-event-id="$jW_Pk8jkkWytcY3kj-yuA-_Gm_h8m9ZtKQj8qoluPVo" data-scroll-tokens="$jW_Pk8jkkWytcY3kj-yuA-_Gm_h8m9ZtKQj8qoluPVo">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      - captured a stable screenshot
      - 41 pixels (ratio 0.01 of all image pixels) are different.


      30 |
      31 |         const tile = util.getEventTile("Msg1");
    > 32 |         await expect(tile).toMatchScreenshot("pinned-message-Msg1.png", {
         |                            ^
      33 |             mask: [tile.locator(".mx_MessageTimestamp")],
      34 |             css: `
      35 |                 // Hide the jump to bottom button in the timeline to avoid flakiness

        at /home/runner/work/element-web/element-web/playwright/e2e/pinned-messages/pinned-messages.spec.ts:32:28

Check failure on line 32 in playwright/e2e/pinned-messages/pinned-messages.spec.ts

View workflow job for this annotation

GitHub Actions / Run Tests 2/6

pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

  1) pinned-messages/pinned-messages.spec.ts:21:9 › Pinned messages › should pin one message and to have the pinned message badge in the timeline 

    Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
    Error: Screenshot comparison failed:

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

    Expected: /home/runner/work/element-web/element-web/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png
    Received: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline-retry2/pinned-message-Msg1-actual.png
        Diff: /home/runner/work/element-web/element-web/playwright/test-results/pinned-messages-pinned-mes-131a1-ssage-badge-in-the-timeline-retry2/pinned-message-Msg1-diff.png

    Call log:
      - expect.toHaveScreenshot(pinned-message-Msg1.png) with timeout 5000ms
      -   verifying given screenshot expectation
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" data-event-id="$Yn-L1jCLE6lDcxeyvD4ye4R3NEPPDtONoZlpyI_ntMo" class="mx_EventTile mx_EventTile_last mx_EventTile_lastInSection" data-scroll-tokens="$Yn-L1jCLE6lDcxeyvD4ye4R3NEPPDtONoZlpyI_ntMo">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      -   element is not stable
      - retrying scroll into view action, attempt #1
      -   waiting for element to be stable
      - 41 pixels (ratio 0.01 of all image pixels) are different.
      - waiting 100ms before taking screenshot
      - waiting for locator('.mx_EventTile').filter({ hasText: 'Msg1' })
      -   locator resolved to <li tabindex="-1" aria-live="off" data-self="false" aria-atomic="true" data-layout="group" data-has-reply="false" class="mx_EventTile mx_EventTile_lastInSection" data-event-id="$Yn-L1jCLE6lDcxeyvD4ye4R3NEPPDtONoZlpyI_ntMo" data-scroll-tokens="$Yn-L1jCLE6lDcxeyvD4ye4R3NEPPDtONoZlpyI_ntMo">…</li>
      - taking element screenshot
      -   disabled all CSS animations
      - waiting for fonts to load...
      - fonts loaded
      - attempting scroll into view action
      -   waiting for element to be stable
      - captured a stable screenshot
      - 41 pixels (ratio 0.01 of all image pixels) are different.


      30 |
      31 |         const tile = util.getEventTile("Msg1");
    > 32 |         await expect(tile).toMatchScreenshot("pinned-message-Msg1.png", {
         |                            ^
      33 |             mask: [tile.locator(".mx_MessageTimestamp")],
      34 |             css: `
      35 |                 // Hide the jump to bottom button in the timeline to avoid flakiness

        at /home/runner/work/element-web/element-web/playwright/e2e/pinned-messages/pinned-messages.spec.ts:32:28
mask: [tile.locator(".mx_MessageTimestamp")],
css: `
// Hide the jump to bottom button in the timeline to avoid flakiness
.mx_JumpToBottomButton {
display: none !important;
}
`,
});
});

Expand Down
Binary file modified ...snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 539025c

Please sign in to comment.