Skip to content

Easteregg fix#1625

Merged
janriokrause merged 3 commits into
mainfrom
easteregg-fix
Jul 22, 2026
Merged

Easteregg fix#1625
janriokrause merged 3 commits into
mainfrom
easteregg-fix

Conversation

@slightlyoffbeat

Copy link
Copy Markdown
Contributor

Fix easter egg logo on light-theme pages

The easter egg logo WebM is the white wordmark, so it only shows up on a dark nav. On light-theme pages (e.g. /features/protection) it rendered white-on-white and disappeared.

Changes

  • Only run on a dark nav. Activate the video only when the theme is showing the white wordmark, so it never lands on a white background.
  • React to live theme changes. Swap the logo in/out when the OS color scheme flips at runtime (devtools, macOS auto dark-at-sunset) instead of needing a refresh.
  • Skip custom/brand logos. Custom navigation snippets reuse the fl-logo-fx class; leave those alone so the Firefox flame never replaces a partner logo.
  • Clean up play() error handling. Reset state instead of rethrowing, avoiding an uncatchable unhandled rejection and a stuck-state bug.

Testing

  • Verify the easter egg still plays on hover on dark-nav pages (e.g. homepage).
  • Confirm it no longer appears on light-theme pages.
  • Toggle light/dark in devtools and confirm the logo updates without a refresh.
  • Confirm custom-logo pages are unaffected.

easter egg only works on dark background. This refactor:
- ensures only shows on dark background
- slight refactor so that toggling between light/dark mode in dev tools (or potentially a user facing toggle in the future) will also switch logo when easter egg is on.
- Custom/brand logo hijack, bail on .fl-logo-fx-custom.
- Uncatchable rejection + stuck isPlaying (review #3) — .catch now resets state instead of rethrowing.

@janriokrause janriokrause left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Really nice fix. The --fl-logo-url signal is a clever way to detect the dark nav, and the play() cleanup is a great catch for preventing expected AbortErrors from spamming Sentry. 🎉

One tiny thing (non-blocking): in activate() we remove the <img> from the default flare header, but teardown() only restores the CSS background and sizing. So after a dark→light flip the wordmark looks identical, but the original DOM node is never restored. This is fine with the current CSS, though it could become noticeable if the logo asset or background-based rendering changes later. Re-inserting the same <img> during teardown would make it a more complete inverse of activate(), but it's still totally fine to ship as-is. 😊

Comment thread media/js/cms/easter-egg-logo.es6.js Outdated
Instead of removing the static wordmark <img> in activate() and never
restoring it, leave it in place and hide it with
.fl-logo-fx:has(.fl-video-ready) img. Removing the video on teardown
now reverses cleanly with no manual restore.
@codecov

codecov Bot commented Jul 22, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 87.63%. Comparing base (4435233) to head (f619d31).
⚠️ Report is 8 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #1625      +/-   ##
==========================================
+ Coverage   87.55%   87.63%   +0.08%     
==========================================
  Files         154      158       +4     
  Lines       10732    10843     +111     
==========================================
+ Hits         9396     9502     +106     
- Misses       1336     1341       +5     

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@knowler knowler left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

r+ 🍳

@janriokrause
janriokrause merged commit 5b7ba6b into main Jul 22, 2026
7 checks passed
@janriokrause
janriokrause deleted the easteregg-fix branch July 22, 2026 15:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants