Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flake in all visual tests which conditionally render components with svg icons #2377

Closed
zackkrida opened this issue Jun 9, 2023 · 1 comment · Fixed by #2378
Closed

Flake in all visual tests which conditionally render components with svg icons #2377

zackkrida opened this issue Jun 9, 2023 · 1 comment · Fixed by #2378
Labels
🤖 aspect: dx Concerns developers' experience with the codebase 🛠 goal: fix Bug fix 🟥 priority: critical Must be addressed ASAP 🧱 stack: frontend Related to the Nuxt frontend

Comments

@zackkrida
Copy link
Member

zackkrida commented Jun 9, 2023

Description

Any test which renders a new piece of UI mid-test which contains SVG icons can be subjected to flake in which the icons do not appear visually. Annoyingly, the Playwright trace viewer shows the SVG is "rendered" in the dom, but the link in the "use" blocks of these sprite-based SVGs do not appear to be loaded.

This is very likely likely related to #2135 from @obulat but feels very difficult to fix. I've spent hours investigating today and haven't been successful.

Reproduction

Some examples of runs with this issue:

Screenshots

Environment

  • Device:
  • OS:
  • Browser:
  • Version:
  • Other info:

Additional context

@zackkrida zackkrida added 🟥 priority: critical Must be addressed ASAP 🛠 goal: fix Bug fix 🤖 aspect: dx Concerns developers' experience with the codebase 🧱 stack: frontend Related to the Nuxt frontend labels Jun 9, 2023
@obulat
Copy link
Contributor

obulat commented Jun 10, 2023

This is likely related to #2135 from @obulat but feels very difficult to fix. I've spent hours investigating today and haven't been successful.

Since we can't see the SVG icons, that change is the first that comes to mind. Yet, if #2135 caused this issue, flakiness would show up more in the PRs right after it, and there are several frontend PRs that were merged after it without any SVG flakiness. And also, #2135 had changed the non-icon SVGs (the logo, brand, etc.), the icons were converted in an earlier PR.

I have no idea about how, but maybe the Playwright fixture addition changed something? Because that's the most recent Playwright-related change that is closer to the start of SVG-related flakiness. I'm going to try reverting it, and the test skip PR to see if there are any failures. I'm not sure how to check if flakiness is gone, though: if the CI passes - does it mean that the problem is fixed, or that we didn't get the problematic result this time? If the tests pass, I'll just re-run them to try to get them to fail again.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🤖 aspect: dx Concerns developers' experience with the codebase 🛠 goal: fix Bug fix 🟥 priority: critical Must be addressed ASAP 🧱 stack: frontend Related to the Nuxt frontend
Projects
Archived in project
Development

Successfully merging a pull request may close this issue.

2 participants