search

percy / percy-protractor

Visual testing with Protractor and Percy
https://percy.io
MIT License
3 stars 4 forks source link

Woff fonts missing (corrupt on asset discovery capture) #222

Closed NouranMahmoud closed 2 years ago

NouranMahmoud commented 3 years ago

Hi,

I was trying to integrate Percy with our product but I faced two issues. so, to reproduce the issue I created this simple AngularApp with protractor, and integrated Percy on it with a simple test.

The two issues are

First: This cli error keeps showing up often (not always), it seems there is a race condition somewhere.

[percy] Waiting for 1 snapshot(s) to finish uploading
[percy] Encountered an error uploading snapshot: buttons
[percy] Error: write EPIPE
    Error: Finalizing build 10984130 failed: cannot finalize before all snapshot resources are 
    uploaded. This is likely a client error, please make sure that content for all SHAs in 
    'missing-resources' from the snapshot response are uploaded before calling finalize.
npm ERR! code ELIFECYCLE
npm ERR! errno 1

The script that I use to run percy is PERCY_PARALLEL_TOTAL=0 npm run percy:run "percy:run": "LOG_LEVEL=debug npx percy exec -t 1000 -- npm run e2e"

Second: local assets are not loaded As you can see in the AngApp, I have font and icon files locally, these files are ignored and don't get uploaded to Percy so the screenshot looks broken.

Screenshots of expected and what I get in the Percy build dashboard

Expected: Local environment app https://ibb.co/vB3KQ0S

Actual: Percy broken screenshot https://ibb.co/XJGDWdR

PercyClient: In this line the assets which is part of (resources) variable gets filtered and it seems only missing-resources array gets uploaded

Hopefully, this AngProject clarify the issue.

Robdel12 commented 3 years ago

Hey @NouranMahmoud! Thanks for the issue. LOG_LEVEL=debug works for @percy/agent but not @percy/cli. You can pass a --verbose flag or use PERCY_DEBUG=* to get full Percy debug logs now.

One of the resources in the build is failing to upload successfully, which is causing this issue. The verbose logs will help figure out which asset that is

NouranMahmoud commented 3 years ago

Hey @Robdel12 Thanks for this tip, I have added the verbose flag, but it still doesn't show the assets error message.

You can see the whole log here

Robdel12 commented 3 years ago

Any chance there's a proxy running (is HTTPS_PROXY or HTTP_PROXY set)? It looks like from the error stack trace the connection to the API is getting dropped/reset

NouranMahmoud commented 3 years ago

Hi @Robdel12, no I don't have a proxy I also tried it on a different machine to be sure.

Robdel12 commented 3 years ago

HM, I spent the morning digging in and debugging. I can't replicate the issues you're seeing with the snapshot upload failing. I'm not sure why the connection the API is getting reset for you 🤨 That's a tricky one.

I did take a look at the example app and see the icon fonts aren't rendering. This looks like it's related to webpack dev server not serving the fonts correctly (when we go to capture the font file, it's already Mojibaked for some reason). Deploying the app to a real server works, though (https://practical-lalande-7e2c44.netlify.app/). It's pretty similar to this issue: https://github.com/percy/percy-cypress/issues/312 We're going to have to take some time to really dig into webpack dev server and see what is going on (and how its serving these fonts)

github-actions[bot] commented 3 years ago

This issue is stale because it has been open for more than 14 days with no activity. Remove stale label or comment or this will be closed in 14 days.

NouranMahmoud commented 3 years ago

@Robdel12 do we have any updates here regarding the assets and icons issue? as you mentioned you will be working on that

Robdel12 commented 3 years ago

No progress -- this is a long standing issue that we've had and will likely continue to have. We're not sure why some development servers are serving corrupted fonts (and this doesn't happen on production/non-dev servers). Once we have a breakthrough we'll absolutely update this issue (and the other issues on our SDKs)

unlikelyzero commented 3 years ago

@Robdel12 any updates? We're hitting it on our webpack dev server with playwright

unlikelyzero commented 2 years ago

@Robdel12 @NouranMahmoud we've been able to fix it by modifying our webpack configuration https://github.com/nasa/openmct/pull/5012

Robdel12 commented 2 years ago

Upgrading the latest CLI (v1.1.4) will solve this! https://github.com/percy/cli/releases/tag/v1.1.4