AAO-React-Native
AAO-React-Native copied to clipboard
StoDevX
App Screenshots in CI
This is another tracking issue and should definitely not be prioritized for 2.5 or 2.6.
Previously we had react-native-view-shot as a dependency, (added by #843, removed by #1859) which sounds capable of running this. The biggest con was that Android screenshots required an emulator, and I don't think this ever got used. We also found Loki which runs headless in a Chrome instance, and supports iOS and Android. Might be an interesting thought experiment.
Danger could feasibly add screenshot diffs (in table form) for us if we store the screenshots as build artifacts on Circle and link to them directly. People who have access to the repo should be able to view them, and if they go away or are missing we'd just not have them available. No high dependency on them.
Ideally, we'd only present the diff if the image data itself changed, but I don't think I want to do computer vision in CI to determine that.
Loki also requires an emulator, fwiw.
My current plans include running Loki with storybooks on CI, which means we'll need simulators and emulators.
I'm leaning towards storybook because it + Loki handle the navigation between areas and screenshot saving to an accessible location for us.
Sent with GitHawk
You wouldn't necessarily need CV to tell if they changed. We can explore using ImageMagick's compare tool, or find a way to grab the pixel data in two images and see if they are identical?
This is true about ImageMagick's compare thing, I think I've seen projects that use that rather than opencv. If we could figure out how to overlay and use red tint to denote HEAD and green to denote proposed changes, and then keep common colors the same as they are, that'd be interesting to see.
I know that GitHub can do image diffs nicely, but we aren't uploading screenshots back to the repo
I'd rather just post both screenshots side-by-side, I think.
Maybe along with the automated detection of which code paths need to be screenshotted, we can use compare to only post screenshots that changed?
That would be ideal. We might even consider mapping that out explicitly in some kind of manifest form.
We could also use Fastlane's "snap" tool + UIKit's app automation to take the screenshots on iOS (there's an equivalent combo on android).
That would have the added advantage of telling us where our app isn't as accessible as it should be, since assistive tech and automation tech both rely on buttons being buttons and whatnot.
Downsides: speed? Flakiness? Maybe they've gotten better.
Taking a look at storybook again. Although it brings in a million dependencies (webpack) — the react native situation has changed for the better. I am seeing full RN support now as of v6.5 as of a month ago.