search

percy / cli

The Percy CLI is used to interact with, and upload snapshots to, percy.io via the command line.
https://docs.percy.io/docs/cli-overview
71 stars 45 forks source link

Font not consistently rendered on recent versions of the CLI #561

Closed agrobbin closed 3 years ago

agrobbin commented 3 years ago

The problem

In the last couple of weeks, we've noticed a significant increase in the # of intermittent diffs due to a missing font (in our case, Font Awesome).

Sometimes the font icons show up: Screen Shot 2021-09-24 at 9 25 56 AM

And sometimes they show as rectangles: Screen Shot 2021-09-24 at 9 25 51 AM

Environment

Details

The source diff does not include anything related to the font CSS or the related HTML. Due to the way the fonts are loaded (as part of a package that also includes all of our other page CSS, which is shown correctly) makes me think it's not an asset discovery/downloading issue, but something else.

Debug logs

The specific snapshot debug log output:

[percy:core] Handling snapshot: (0ms)
[percy:core] -> name: Admin2 / Deals / Show / Deal Process / Approvals / Not Started / Trigger Approval (0ms)
[percy:core] -> url: http://admin.vendr.localhost:40193/deals/a23a5ca6-dc41-4209-afb8-1f1753ca6e0d#process (0ms)
[percy:core] -> widths: 1200px (0ms)
[percy:core] -> minHeight: 1024px (0ms)
[percy:core] -> clientInfo: percy-capybara/5.0.0 (0ms)
[percy:core] -> environmentInfo: capybara/3.33.0 ruby/3.0.2 (0ms)
[percy:core:page] Page created (7ms)
[percy:core:page] Resize page to 1200x1024 (33ms)
[percy:core:page] Navigate to: http://admin.vendr.localhost:40193/deals/a23a5ca6-dc41-4209-afb8-1f1753ca6e0d#process (5ms)
[percy:core:discovery] Handling request: http://admin.vendr.localhost:40193/deals/a23a5ca6-dc41-4209-afb8-1f1753ca6e0d (3ms)
[percy:core:discovery] -> Serving root resource (0ms)
[percy:core:discovery] Handling request: http://admin.vendr.localhost:40193/packs-test/css/admin2-d9ae6189.css (24ms)
[percy:core:discovery] -> Resource cache hit (0ms)
[percy:core:discovery] Handling request: http://admin.vendr.localhost:40193/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxoTldZeFpEVXdNeTA1TVROakxUUTNOamd0T1RoaU1pMW1NV0V4TURBeE5XSm1NalFHT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--604a4fec9f188de28f8205ea74cad8fde425fa32/avatar.png (5ms)
[percy:core:discovery] -> Resource cache hit (1ms)
[percy:core:discovery] Handling request: http://admin.vendr.localhost:40193/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWt3WldKa01qTXdZaTAxWlRVM0xUUTFOR1l0T0RNek55MWhObU01TXpJMll6Y3lNVE1HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--275f756a9e8f90a794e1f680a7e1941180df5c86/avatar.png (1ms)
[percy:core:discovery] -> Resource cache hit (0ms)
[percy:core:discovery] Handling request: http://admin.vendr.localhost:40193/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaEpJaWxtWmpjMU1EWTRNaTFqWWpsa0xUUTNNRFV0WVRsalpTMDVZelkxWXpabE5UWXdZek1HT2daRlZBPT0iLCJleHAiOm51bGwsInB1ciI6ImJsb2JfaWQifX0=--83b23733611ca2f99b6f0f27164db8e564669b16/avatar.png (0ms)
[percy:core:discovery] -> Resource cache hit (0ms)
[percy:core:page] Page navigated (38ms)
[percy:core:network] Wait for 100ms idle (1ms)
Robdel12 commented 3 years ago

👋🏼 Hey @agrobbin! The fonts aren't requested in this snapshot. It looks like your network idle timeout is set to the default 100ms ([percy:core:network] Wait for 100ms idle (1ms)). Let's up that to 250ms-300 so asset discovery waits long enough for the captured DOM to request the font https://docs.percy.io/docs/cli-configuration#discovery