Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: e2e snapshot tests #2338

Merged
merged 69 commits into from
Aug 23, 2024
Merged

feat: e2e snapshot tests #2338

merged 69 commits into from
Aug 23, 2024

Conversation

CDFN
Copy link
Collaborator

@CDFN CDFN commented Jul 9, 2024

Summary

This PR adds E2E tests based on view screenshots done via react-native-view-shot. It only works with devices that have their pixel ratio equal 3. If you want to use device with different pixel ratio, you need to adjust it in e2e/generateReferences.ts viewport and regenerate reference images (see below).

Steps to run tests:

  • Run Metro server for example app via yarn start in example app's directory
  • Run example app on platform of your choice (currently only Android & iOS are supported) via yarn android or yarn ios in example app's directory
  • Run yarn e2e in project's root directory to start Jest server
  • Select E2E tab in example app
  • Wait for tests to finish
  • You can see test results, as well as diffs (actual rendered svg vs reference image) in e2e/diffs directory

Steps to add new test cases:

  • Put SVG of your choice to e2e/cases directory
  • Run yarn generateE2eRefrences, this will open headless chrome browser via puppeteer and snapshot all rendered SVGs to .png files and later use them as reference in tests
  • You should see new .png files in e2e/references
  • When you run E2E tests again, it will use new test case(s) you've added

Test Plan

Screen.Recording.2024-07-09.at.12.11.47.mov
Screen.Recording.2024-07-09.at.12.18.28.mov

What's required for testing (prerequisites)?

See Summary

What are the steps to reproduce (after prerequisites)?

See Summary

Compatibility

OS Implemented
iOS
Android
Web

Checklist

  • I have tested this on a device and a simulator
  • I added documentation in README.md
  • I updated the typed files (typescript)
  • I added a test for the API in the __tests__ folder

@CDFN
Copy link
Collaborator Author

CDFN commented Jul 10, 2024

Added html reports 🎉
image

@bohdanprog bohdanprog requested a review from jakex7 August 8, 2024 07:54
example/patches/react-native-view-shot+4.0.0-alpha.2.patch Outdated Show resolved Hide resolved
run: npx react-native run-windows --logging --no-packager --no-deploy --no-autolink
Copy link
Member

Choose a reason for hiding this comment

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

Why we're disabling autolinking on windows CI?

Copy link
Member

Choose a reason for hiding this comment

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

Without that --no-autolink new libraries will be linking on the Windows platform.
We do not want to install react-native-view-shot on the Windows platform.

Copy link
Member

Choose a reason for hiding this comment

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

Doesn't it mean no autolinking at all? Shouldn't we link other libraries manually in that case?

Copy link
Member

Choose a reason for hiding this comment

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

Any of the new libraries aren't needed in the Windows build test.

@bohdanprog bohdanprog requested a review from jakex7 August 19, 2024 06:57
Copy link
Member

@jakex7 jakex7 left a comment

Choose a reason for hiding this comment

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

Good job! 🚀
LGTM for now.
I've disabled Android E2E tests on main because they aren't as reliable as we need them to be.

@bohdanprog
Copy link
Member

Updated Podfile.lock across all our example apps.
I believe that the PR is ready to be merged.

@bohdanprog bohdanprog merged commit a089cc2 into software-mansion:main Aug 23, 2024
11 checks passed
github-merge-queue bot referenced this pull request in valora-inc/wallet Sep 24, 2024
This PR contains the following updates:

| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
|
[react-native-svg](https://redirect.github.com/react-native-community/react-native-svg)
| [`^15.5.0` ->
`^15.7.1`](https://renovatebot.com/diffs/npm/react-native-svg/15.5.0/15.7.1)
|
[![age](https://developer.mend.io/api/mc/badges/age/npm/react-native-svg/15.7.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/react-native-svg/15.7.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/react-native-svg/15.5.0/15.7.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/react-native-svg/15.5.0/15.7.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|

---

### Release Notes

<details>
<summary>react-native-community/react-native-svg
(react-native-svg)</summary>

###
[`v15.7.1`](https://redirect.github.com/software-mansion/react-native-svg/releases/tag/v15.7.1)

[Compare
Source](https://redirect.github.com/react-native-community/react-native-svg/compare/v15.7.0...v15.7.1)

Hotfix for v15.7.0

#### What's Changed

- fix: exclude e2e from types in release by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
#[https://github.com/software-mansion/react-native-svg/pull/2454](https://redirect.github.com/software-mansion/react-native-svg/pull/2454)

**Full Changelog**:
software-mansion/react-native-svg@v15.7.0...v15.7.1

###
[`v15.7.0`](https://redirect.github.com/software-mansion/react-native-svg/releases/tag/v15.7.0)

[Compare
Source](https://redirect.github.com/react-native-community/react-native-svg/compare/v15.6.0...v15.7.0)

A minor release introducing the implementation of filter regions along
with some bug fixes 🔧

#### What's Changed

- fix: android svg scale 0 by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2424](https://redirect.github.com/software-mansion/react-native-svg/pull/2424)
- feat: e2e snapshot tests by
[@&#8203;CDFN](https://redirect.github.com/CDFN) in
[https://github.com/software-mansion/react-native-svg/pull/2338](https://redirect.github.com/software-mansion/react-native-svg/pull/2338)
- feat: add load method by
[@&#8203;WoLewicki](https://redirect.github.com/WoLewicki) in
[https://github.com/software-mansion/react-native-svg/pull/2427](https://redirect.github.com/software-mansion/react-native-svg/pull/2427)
- fix: reset paint settings before drawing final bitmap by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2439](https://redirect.github.com/software-mansion/react-native-svg/pull/2439)
- fix: add deprecated SvgViewManager to not break 0.72 by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2435](https://redirect.github.com/software-mansion/react-native-svg/pull/2435)
- docs: introduce about webpack by
[@&#8203;bohdanprog](https://redirect.github.com/bohdanprog) in
[https://github.com/software-mansion/react-native-svg/pull/2434](https://redirect.github.com/software-mansion/react-native-svg/pull/2434)
- docs: broken link in the readme file by
[@&#8203;JohnAdib](https://redirect.github.com/JohnAdib) in
[https://github.com/software-mansion/react-native-svg/pull/2443](https://redirect.github.com/software-mansion/react-native-svg/pull/2443)
- feat: implement filter region by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2441](https://redirect.github.com/software-mansion/react-native-svg/pull/2441)
- fix: Android group `opacity` prop by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2417](https://redirect.github.com/software-mansion/react-native-svg/pull/2417)
- fix: render G offscreen only when it's needed (opacity != 1) by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2450](https://redirect.github.com/software-mansion/react-native-svg/pull/2450)
- fix: transform scale on android by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2452](https://redirect.github.com/software-mansion/react-native-svg/pull/2452)

#### New Contributors

- [@&#8203;JohnAdib](https://redirect.github.com/JohnAdib) made their
first contribution in
[https://github.com/software-mansion/react-native-svg/pull/2443](https://redirect.github.com/software-mansion/react-native-svg/pull/2443)

**Full Changelog**:
software-mansion/react-native-svg@v15.6.0...v15.7.0

###
[`v15.6.0`](https://redirect.github.com/software-mansion/react-native-svg/releases/tag/v15.6.0)

[Compare
Source](https://redirect.github.com/react-native-community/react-native-svg/compare/v15.5.0...v15.6.0)

In this version, we've introduced support for React Native 0.75, Fabric
support on Windows, and a few minor enhancements and fixes. Thank you to
everyone who contributed! 🚀

#### What's Changed

- chore: bump reanimated in macos example on paper by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2398](https://redirect.github.com/software-mansion/react-native-svg/pull/2398)
- feat: add support int32 color by
[@&#8203;bohdanprog](https://redirect.github.com/bohdanprog) in
[https://github.com/software-mansion/react-native-svg/pull/2397](https://redirect.github.com/software-mansion/react-native-svg/pull/2397)
- fix: implementation toDataURL for iOS platform both architectures by
[@&#8203;bohdanprog](https://redirect.github.com/bohdanprog) in
[https://github.com/software-mansion/react-native-svg/pull/2405](https://redirect.github.com/software-mansion/react-native-svg/pull/2405)
- chore: cleanup example apps by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2408](https://redirect.github.com/software-mansion/react-native-svg/pull/2408)
- feat(windows): add fabric support by
[@&#8203;marlenecota](https://redirect.github.com/marlenecota) in
[https://github.com/software-mansion/react-native-svg/pull/2321](https://redirect.github.com/software-mansion/react-native-svg/pull/2321)
- feat: support dataUri for android platform by
[@&#8203;bohdanprog](https://redirect.github.com/bohdanprog) in
[https://github.com/software-mansion/react-native-svg/pull/2396](https://redirect.github.com/software-mansion/react-native-svg/pull/2396)
- feat: introduce hitSlop prop by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2407](https://redirect.github.com/software-mansion/react-native-svg/pull/2407)
- feat: rewrite `Svg` transform by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2403](https://redirect.github.com/software-mansion/react-native-svg/pull/2403)
- Support-rgb(R%,G%,B%)-percentage by
[@&#8203;hryhoriiK97](https://redirect.github.com/hryhoriiK97) in
[https://github.com/software-mansion/react-native-svg/pull/2363](https://redirect.github.com/software-mansion/react-native-svg/pull/2363)
- chore: bump apps to RN 0.75 by
[@&#8203;WoLewicki](https://redirect.github.com/WoLewicki) in
[https://github.com/software-mansion/react-native-svg/pull/2340](https://redirect.github.com/software-mansion/react-native-svg/pull/2340)
- chore(deps): bump rexml from 3.2.6 to 3.3.3 in /tests-example by
[@&#8203;dependabot](https://redirect.github.com/dependabot) in
[https://github.com/software-mansion/react-native-svg/pull/2410](https://redirect.github.com/software-mansion/react-native-svg/pull/2410)
- chore: fix prettier by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2416](https://redirect.github.com/software-mansion/react-native-svg/pull/2416)
- fix: do not resolve asset url for every object on web. by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2419](https://redirect.github.com/software-mansion/react-native-svg/pull/2419)
- fix: transforms on macOS old arch by
[@&#8203;jakex7](https://redirect.github.com/jakex7) in
[https://github.com/software-mansion/react-native-svg/pull/2420](https://redirect.github.com/software-mansion/react-native-svg/pull/2420)

#### New Contributors

- [@&#8203;hryhoriiK97](https://redirect.github.com/hryhoriiK97) made
their first contribution in
[https://github.com/software-mansion/react-native-svg/pull/2363](https://redirect.github.com/software-mansion/react-native-svg/pull/2363)

**Full Changelog**:
software-mansion/react-native-svg@v15.5.0...v15.6.0

</details>

---

### Configuration

📅 **Schedule**: Branch creation - "after 5pm,every weekend" in timezone
America/Los_Angeles, Automerge - "after 5pm,every weekend" in timezone
America/Los_Angeles.

🚦 **Automerge**: Enabled.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the
rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update
again.

---

- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check
this box

---

This PR was generated by [Mend Renovate](https://mend.io/renovate/).
View the [repository job
log](https://developer.mend.io/github/valora-inc/wallet).

<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzOC44MC4wIiwidXBkYXRlZEluVmVyIjoiMzguODAuMCIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOlsibnBtIiwicmVub3ZhdGUiXX0=-->

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: valora-bot <[email protected]>
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.

4 participants