Improve app responsiveness on mobile screen #3587
Annotations
12 errors, 5 warnings, and 1 notice
[chromium] › course-language-versions.spec.ts:10:5 › Creating a new language version works:
system-tests/src/tests/course-language-versions.spec.ts#L62
1) [chromium] › course-language-versions.spec.ts:10:5 › Creating a new language version works › Expect screenshots to match snapshots "wrong-course-banner"
Error: expect(page).toHaveScreenshot(expected)
183087 pixels (ratio 0.42 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/course-language-versions.spec.ts/wrong-course-banner-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-language-versions-C-f1cf2--new-language-version-works-chromium/wrong-course-banner-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-language-versions-C-f1cf2--new-language-version-works-chromium/wrong-course-banner-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(wrong-course-banner-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 183087 pixels (ratio 0.42 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 183087 pixels (ratio 0.42 of all image pixels) are different.
60 | )
61 |
> 62 | await expectScreenshotsToMatchSnapshots({
| ^
63 | screenshotTarget: page,
64 | headless,
65 | testInfo,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/course-language-versions.spec.ts:62:42
|
[chromium] › course-material/content-components-render.spec.ts:8:5 › blocks render correctly:
system-tests/src/tests/course-material/content-components-render.spec.ts#L29
2) [chromium] › course-material/content-components-render.spec.ts:8:5 › blocks render correctly › Expect screenshots to match snapshots "content-components-renderer-view"
Error: expect(page).toHaveScreenshot(expected)
202950 pixels (ratio 0.01 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/course-material/content-components-render.spec.ts/content-components-renderer-view-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-material-content-co-a4b7d-der-blocks-render-correctly-chromium/content-components-renderer-view-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-material-content-co-a4b7d-der-blocks-render-correctly-chromium/content-components-renderer-view-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(content-components-renderer-view-mobile-tall.png) with timeout 10000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 202950 pixels (ratio 0.01 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 202950 pixels (ratio 0.01 of all image pixels) are different.
27 | await expect(page.getByText("crashed")).toBeHidden()
28 |
> 29 | await expectScreenshotsToMatchSnapshots({
| ^
30 | // TODO: these should be removed
31 | axeSkip: ["color-contrast", "empty-table-header"],
32 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/course-material/content-components-render.spec.ts:29:42
|
[chromium] › course-material/custom-iframe.spec.ts:10:5 › Custom iframe blocks work:
system-tests/src/tests/course-material/custom-iframe.spec.ts#L54
3) [chromium] › course-material/custom-iframe.spec.ts:10:5 › Custom iframe blocks work › Expect screenshots to match snapshots "custom-iframe"
Error: expect(page).toHaveScreenshot(expected)
38013 pixels (ratio 0.09 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/course-material/custom-iframe.spec.ts/custom-iframe-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-material-custom-iframe-Custom-iframe-blocks-work-chromium/custom-iframe-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/course-material-custom-iframe-Custom-iframe-blocks-work-chromium/custom-iframe-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(custom-iframe-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 38013 pixels (ratio 0.09 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 38013 pixels (ratio 0.09 of all image pixels) are different.
52 | .frameLocator('iframe[title="iframe"]')
53 | .getByRole("heading", { name: "Example Domain" })
> 54 | await expectScreenshotsToMatchSnapshots({
| ^
55 | headless,
56 | testInfo,
57 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/course-material/custom-iframe.spec.ts:54:42
|
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them:
system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts#L44
4) [chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret › Expect screenshots to match snapshots "new-block-inserter-should-not-obscure-typing-caret"
Error: expect(page).toHaveScreenshot(expected)
32878 pixels (ratio 0.08 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/gutenberg/spacer-not-breaking-editing.spec.ts/new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 32878 pixels (ratio 0.08 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 32878 pixels (ratio 0.08 of all image pixels) are different.
42 | await page.getByText("This text should remain editable").press("Control+A")
43 | // In this screenshot the plus sign for inserting a new block should not be on top of the typing caret.
> 44 | await expectScreenshotsToMatchSnapshots({
| ^
45 | headless,
46 | testInfo,
47 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts:44:44
|
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them:
system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts#L44
4) [chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret › Expect screenshots to match snapshots "new-block-inserter-should-not-obscure-typing-caret"
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
32878 pixels (ratio 0.08 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/gutenberg/spacer-not-breaking-editing.spec.ts/new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry1/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry1/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 32878 pixels (ratio 0.08 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 32878 pixels (ratio 0.08 of all image pixels) are different.
42 | await page.getByText("This text should remain editable").press("Control+A")
43 | // In this screenshot the plus sign for inserting a new block should not be on top of the typing caret.
> 44 | await expectScreenshotsToMatchSnapshots({
| ^
45 | headless,
46 | testInfo,
47 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts:44:44
|
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them:
system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts#L44
4) [chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret › Expect screenshots to match snapshots "new-block-inserter-should-not-obscure-typing-caret"
Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
32878 pixels (ratio 0.08 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/gutenberg/spacer-not-breaking-editing.spec.ts/new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry2/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry2/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 32878 pixels (ratio 0.08 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 32878 pixels (ratio 0.08 of all image pixels) are different.
42 | await page.getByText("This text should remain editable").press("Control+A")
43 | // In this screenshot the plus sign for inserting a new block should not be on top of the typing caret.
> 44 | await expectScreenshotsToMatchSnapshots({
| ^
45 | headless,
46 | testInfo,
47 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts:44:44
|
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them:
system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts#L44
4) [chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret › Expect screenshots to match snapshots "new-block-inserter-should-not-obscure-typing-caret"
Retry #3 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
32878 pixels (ratio 0.08 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/gutenberg/spacer-not-breaking-editing.spec.ts/new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry3/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry3/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 32878 pixels (ratio 0.08 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 32878 pixels (ratio 0.08 of all image pixels) are different.
42 | await page.getByText("This text should remain editable").press("Control+A")
43 | // In this screenshot the plus sign for inserting a new block should not be on top of the typing caret.
> 44 | await expectScreenshotsToMatchSnapshots({
| ^
45 | headless,
46 | testInfo,
47 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts:44:44
|
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them:
system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts#L44
4) [chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret › Expect screenshots to match snapshots "new-block-inserter-should-not-obscure-typing-caret"
Retry #4 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
32878 pixels (ratio 0.08 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/gutenberg/spacer-not-breaking-editing.spec.ts/new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry4/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/gutenberg-spacer-not-break-12fdd--on-top-of-the-typing-caret-chromium-retry4/new-block-inserter-should--9688d-yping-caret-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(new-block-inserter-should-not-obscure-typing-caret-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 32878 pixels (ratio 0.08 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 32878 pixels (ratio 0.08 of all image pixels) are different.
42 | await page.getByText("This text should remain editable").press("Control+A")
43 | // In this screenshot the plus sign for inserting a new block should not be on top of the typing caret.
> 44 | await expectScreenshotsToMatchSnapshots({
| ^
45 | headless,
46 | testInfo,
47 | screenshotTarget: page,
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/gutenberg/spacer-not-breaking-editing.spec.ts:44:44
|
[chromium] › headings-navigation.spec.ts:10:5 › headings navigation works:
system-tests/src/tests/headings-navigation.spec.ts#L30
5) [chromium] › headings-navigation.spec.ts:10:5 › headings navigation works › Expect screenshots to match snapshots "headings-navigation-open"
Error: expect(page).toHaveScreenshot(expected)
105895 pixels (ratio 0.24 of all image pixels) are different.
Expected: /home/runner/work/secret-project-331/secret-project-331/system-tests/src/__screenshots__/headings-navigation.spec.ts/headings-navigation-open-mobile-tall.png
Received: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/headings-navigation-headings-navigation-works-chromium/headings-navigation-open-mobile-tall-1-actual.png
Diff: /home/runner/work/secret-project-331/secret-project-331/system-tests/test-results/headings-navigation-headings-navigation-works-chromium/headings-navigation-open-mobile-tall-1-diff.png
Call log:
- expect.toHaveScreenshot(headings-navigation-open-mobile-tall.png) with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 105895 pixels (ratio 0.24 of all image pixels) are different.
- waiting 100ms before taking screenshot
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- captured a stable screenshot
- 105895 pixels (ratio 0.24 of all image pixels) are different.
28 | await page.locator('[aria-label="Open heading navigation"]').click()
29 |
> 30 | await expectScreenshotsToMatchSnapshots({
| ^
31 | headless,
32 | testInfo,
33 | snapshotName: "headings-navigation-open",
at /home/runner/work/secret-project-331/secret-project-331/system-tests/src/tests/headings-navigation.spec.ts:30:42
|
system-tests (1)
Process completed with exit code 1.
|
system-tests (2)
The job was canceled because "_1" failed.
|
system-tests (2)
The operation was canceled.
|
Slow Test:
system-tests/[chromium] › history/history.spec.ts#L1
system-tests/[chromium] › history/history.spec.ts took 41.1s
|
Slow Test:
system-tests/[chromium] › course-modules/course-modules.spec.ts#L1
system-tests/[chromium] › course-modules/course-modules.spec.ts took 38.7s
|
Slow Test:
system-tests/[chromium] › glossary.spec.ts#L1
system-tests/[chromium] › glossary.spec.ts took 34.7s
|
Slow Test:
system-tests/[chromium] › course-instance-management/course-instance-management.spec.ts#L1
system-tests/[chromium] › course-instance-management/course-instance-management.spec.ts took 34.2s
|
Slow Test:
system-tests/[chromium] › course-material/content-components-render.spec.ts#L1
system-tests/[chromium] › course-material/content-components-render.spec.ts took 32.4s
|
🎭 Playwright Run Summary
5 failed
[chromium] › course-language-versions.spec.ts:10:5 › Creating a new language version works ─────
[chromium] › course-material/content-components-render.spec.ts:8:5 › blocks render correctly ───
[chromium] › course-material/custom-iframe.spec.ts:10:5 › Custom iframe blocks work ────────────
[chromium] › gutenberg/spacer-not-breaking-editing.spec.ts:14:7 › Spacers should not break text editing under them, block inserter should not go on top of the typing caret
[chromium] › headings-navigation.spec.ts:10:5 › headings navigation works ──────────────────────
53 passed (6.6m)
|
Artifacts
Produced during runtime
Name | Size | |
---|---|---|
playwright-html-report-1
|
500 KB |
|
skaffold-build-output
|
937 Bytes |
|
skaffold-images
Expired
|
449 MB |
|
test-results-1
|
27.9 MB |
|