# Summary
`run-ios` script has been removed from `react-native@latest` so we
shouldn't use that (and probably should migrate to
@react-native-community/cli in the future)
# Summary
Due to the large number of example apps in the repository, I decided to
change the structure and move all applications into an "apps" folder to
maintain a clear structure.
# Summary
While upgrading `./example` app to `react-native@0.76.0` I've
encountered conflicts on `@react-native/gradle-plugin` caused by
`react-native-windows@0.74.9` depending on
`@react-native/gradle-plugin@0.74.83`
This PR extracts Windows example to separate `./paper-windows-example`
so it won't conflict with RN updates in the future
<!-- Thanks for submitting a pull request! We appreciate you spending
the time to work on these changes. Please follow the template so that
the reviewers can easily understand what the code changes affect -->
# 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](https://reactnative.dev/docs/pixelratio) 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
https://github.com/software-mansion/react-native-svg/assets/41289688/24ee5447-ce9a-43b6-9dde-76229d25a30ahttps://github.com/software-mansion/react-native-svg/assets/41289688/71d1873f-8155-4494-80bd-e4c1fa72a065
### 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
<!-- Check completed item, when applicable, via: [X] -->
- [X] I have tested this on a device and a simulator
- [x] I added documentation in `README.md`
- [X] I updated the typed files (typescript)
- [X] I added a test for the API in the `__tests__` folder
---------
Co-authored-by: bohdanprog <bohdan.artiukhov@swmansion.com>
Co-authored-by: Jakub Grzywacz <jakub.grzywacz@swmansion.com>
# Summary
This PR adds Fabric support and a FabricExample app for Windows.
Windows support for Fabric is experimental and as such APIs are subject
to change/break.
## Test Plan
https://github.com/software-mansion/react-native-svg/assets/1422161/2a7db119-44a8-4ee1-a837-41ca8320d8fa
## Compatibility
| OS | Implemented |
| ------- | :---------: |
| iOS | ❌ |
| Android | ❌ |
| Windows | ✅ |
## Checklist
- [x] 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
# Summary
We want to avoid problems with GitHub workflows.
Create a new Macos example for new and old architecture.
## Test Plan
Run GitHub workflows
## Compatibility
| OS | Implemented |
| ------- | :---------: |
| macOS | ✅ |
---------
Co-authored-by: Jakub Grzywacz <jakub.grzywacz@swmansion.com>
Changes moved from:
https://github.com/software-mansion/react-native-screens/pull/2224
## Description
When changing native props on Fabric, codegen generates corresponding
interfaces and delegates. To make sure both implementations are
consistent, we implement those interfaces on Paper too. Currently, after
generating interfaces using codegen, developer needs to copy
corresponding files for paper manually. This task adds Gradle task, that
automates this.
## Changes
Current assumption:
Two scripts: `check-archs-consistency` and `sync-archs`. The first one
generates codegen interfaces and compares them with what we have for
paper, the second generates and copies for paper to sync the archs.
- sync is run when staged on changes to `src/paper`
- check is run on CI when `src/paper` or
`android/src/paper/java/com/facebook/react/viewmanagers` changes
## Test code and steps to reproduce
Open `src/fabric/LineNativeComponent.ts` or/and
`src/fabric/NativeSvgRenderableModule.ts` and remove any proper form
interface. Now:
- when building paper, interface should be updated
- when committing, interface should be updated
- if committed and pushed, Test consistency between Paper & Fabric
should fail :)
Brining back the prop and repeating up should cause the interface back
and CI green.
Posting changes in other places should cause CI task to run.
You can also run those commands yourself using `yarn
check-archs-consistency` and `yarn sync-archs`
# Summary
Add GH action to close issues that were without response to the
question.
## Test Plan
Check if that GH action closes the issue if no one response to the
question.
PR bumping the library code to compile on new arch on RN 0.73.x and restoring the proper configuration of Image component on new arch on Android.
Also bumping the FabricExample to check if the code works correctly.
PR restoring macos CI job and restoring usage of UIGraphicsBeginImageContextWithOptions on macos since there is no implementation for UIGraphicsImageRendererFormat there yet.
PR adding proper handling of pointerEvents in the library. Based on the comment by @RSNara :
> For all Android components, static ViewConfigs are generated from the components types + BaseVIewConfig.android.js. The BaseViewConfig for all android components is facebook/react-native@c5217f1/Libraries/NativeComponent/BaseViewConfig.android.js#L288-L297, which doesn't contain the pointerEvents validAttribute. So, React Native SVG components must re-declare the pointerEvents validAttribute. Otherwise, the pointerEvents validAttribute won't be in the static ViewConfig, which means React won't pass that prop to native with Static ViewConfigs.
We needed a way to trick codegen since we added our own pointerEvents with string type, and such prop is already present in ViewProps from react-native, but as a union of strings, so their types did not match. As codegen parses string literals, we include changed ViewProps type, without pointerEvents prop, so we satisfy both codegen and TS.
As for how pointerEvents are handled now:
iOS:
Paper: prop is passed in RCTViewManager but it looks like it does not matter what you pass there, since even if you set none, resulting in view.userInteractionEnabled = NO; (facebook/react-native@065db68/React/Views/RCTViewManager.m#L256), custom implementation of hitTest will not take it into account anyhow.
Fabric: we don’t use pointerEvents prop but it is not a problem since it is not used in the implementation of neither SvgView and RCTViewComponentView (it is used in hitTest method there, but we override it)
Android:
Paper: the prop was passed through ReactViewManager and was set on the view directly. But the setter for pointerEvents is not visible outside of ReactViewGroup . After adding Fabric integration for both platforms: BaseViewManager does not implement setter for pointerEvents so we have to add the prop by ourselves. Still, we cannot call the setter from ReactViewGroup since it is not visible, so all the logic for pointerEvents should be migrated to SvgView unfortunately or we should use reflection to get that method.
Despite that, it seems that behavior differs on Android and iOS since setting pointerEvents to none on Android makes the view not clickable, whereas on iOS it does not change anything.
This PR should hopefully fix CI jobs for Example and FabricExample apps being cancelled by using matrix.working_directory variable in concurrency.group identifier.
PR bumping library to RN 0.70-rc3, which might make it not compatible with earlier versions of RN on Fabric. It should come with the same change in other libraries.
In this PR, I had to remove macos code from Example since it breaks @react-native-community/cli resolution. Hopefully we can bring it back soon.
Most of Android changes for Fabric and bump of FabricExample to RN 0.69.2. iOS and JS changes are available in #1821.
The most notable change on Android is adding methods to components that accept String values of each NumberProp instead of Dynamic. Another change is changed structure of RenderableViewManager.java since we needed to abstract methods that belong only to components inheriting from VirtualView in order to be able to properly override them in their children.
Version of #1754 without usage of ComponentViews. It seems like a more proper way, but introduces the necessity of clearing whole state of each component on recycling for it not to be used when view is recycled.
Still known problems:
We stringify props of type NumberProp since codegen only accepts props of a single type. It is the fastest way of dealing with it, but maybe there could be a better way to handle it.
Image resolving should be probably handled the same as in RN core
SvgView needs to set opaque = NO so it is does not have black background (it comes from the fact that RCTViewComponentView overrides backgroundColor setter which in turn somehow messes with the view being opaque). All other svg components do it already so maybe it is not such an issue.
transform prop won't work when set natively since it is not parsed in Fabric