fc68765314
Summary: X-link: https://github.com/facebook/litho/pull/940 Pull Request resolved: https://github.com/facebook/yoga/pull/1252 X-link: https://github.com/facebook/react-native/pull/36993 Fabric relies on the private C++ internals of Yoga. This creates a conundrum in the open source build due to how header creation in Cocoapods works. 1. The default mechanism of specifying public headers needs to include the private headers for them to be made usable by fabric (by default) 2. Cocoapods will roll up all of the public headers when importing a module https://github.com/facebook/react-native/pull/33381 fixed the Fabric Cocoapods build which ran into this. React Native relies on FlipperKit which relies on YogaKit, which in turn finally imports the Yoga podspec. Because YogaKit may use Swift, we can only expose the public Yoga C ABI. The first solution in that PR was to allow RN to access Yoga private headers, but this was changed to instead make all Yoga headers public, and to add ifdefs to all of them to no-op when included outside of a C++ environment. Talking to Kudo, we should be able to change back to the earlier approach in the PR, to instead expose the private headers to only RN. This lets us avoid exposing headers that we ideally wouldn't be, and lets us avoid the messy ifdefs in every Yoga header. Changelog: [Internal] Reviewed By: rshest Differential Revision: D45139075 fbshipit-source-id: 99152986a578f7aac8324dffe0e18c42a38cc6a5
Yoga 
Yoga is an embeddable and performant flexbox layout engine with bindings for multiple languages.
Building
Yoga's main implementation targets C++ 14 with accompanying build logic in CMake. A wrapper is provided to build the main library and run unit tests.
./unit_tests <Debug|Release>
While not required, this script will use ninja if it is installed for faster builds.
Yoga is additionally part of the vcpkg collection of ports maintained by Microsoft and community contributors. If the version is out of date, please create an issue or pull request on the vcpkg repository.
Adding Tests
Many of Yoga's tests are automatically generated, using HTML fixtures describing node structure. These are rendered in Chrome to generate an expected layout result for the tree. New fixtures can be added to gentest/fixtures.
<div id="my_test" style="width: 100px; height: 100px; align-items: center;">
<div style="width: 50px; height: 50px;"></div>
</div>
To generate new tests from added fixtures:
- Run
bundle installin thegentestdirectory to install dependencies of the test generator. - Run
ruby gentest.rbin thegentestdirectory.
Debugging
Yoga provides a VSCode "launch.json" configuration which allows debugging unit tests. Simply add your breakpoints, and run "Debug C++ Unit tests (lldb)" (or "Debug C++ Unit tests (vsdbg)" on Windows).