percy / in-percy

@percy-io/in-percy NPM package
MIT License
2 stars 4 forks source link

Is `inPercy` still working? #7

Open tzimmermann opened 2 years ago

tzimmermann commented 2 years ago

There hasn't been a lot of updates on this project recently, but my assumption was that the two-line-helper function still works to detect the percy environment, as there are still ~ 20 000 weekly downloads on NPM. But it seems like hostname is localhost for me nowadays, when the percy screenshots are taken (and not proxyme.percy.io or similar), meaning inPercy() returns false always. So if this project is defunct, I would suggest to put a message on the README.md to make it obvious. In general, is there any other way to detect if running in percy via JS right now?

Robdel12 commented 2 years ago

Hey @tzimmermann this does still work, you'll need to enable JavaScript. If you're seeing localhost for the hostname then that's likely due to JS being disabled (and DOM is being serialized & captured) or you're trying to use this outside of the Storybook SDK.

I double checked by adding this package in the storybook example and running a build:

2022-04-12 10 33 12

({inPercy() ? <p>This is true {window.location.hostname}</p> : <p>This is false {window.location.hostname}</p>})

tzimmermann commented 2 years ago

Hi @Robdel12 thank you for looking into this so quickly! In the meantime, I actually also noticed that I hadn't enabled JavaScript, shame on me for not reading the README properly 🤦. But even after enabling JavaScript, I do see localhost being logged as the hostname, and inPercy returning false. I am not using storybook in any way (I am using "@percy/cypress": "3.1.1" and "@percy/cli": "1.0.5") is storybook required for this function to work?

Robdel12 commented 2 years ago

No worries! We should probably archive this project and just provide this as a helper in the Storybook SDK. Storybook is basically required for this to work, unless the JS in your app can properly rerun & reattach to a fully formed & serialized DOM. The reason storybook works is because when JS is enabled we don't capture any DOM, we just render the story root and let the JS build the story from scratch in our rendering infra.

tzimmermann commented 2 years ago

You are right, my app does not work at all as expected once I turn on JavaScript. I think I had a misconception of what this option actually does. I've found another way of making sure my app detects percy mode instead by checking a webpack compile-time variable. But thanks again for your explanation! I agree that this package's functionality should rather live inside the storybook integration, it's not really mentioned anywhere that this is a precondition.