Skip to content

Latest commit

 

History

History
67 lines (46 loc) · 2.87 KB

macos.md

File metadata and controls

67 lines (46 loc) · 2.87 KB

Running the FluentUI Tester on macOS

FluentUI Tester is the test app that we use to test our FluentUI components during development. It uses the react-native-test app under the covers, and loads the FluentUI bundle.

Launch FluentUI Tester app on macOS

Prereq: FluentUI Tester on macOS can only run on a Mac.

  1. Make sure you have followed the Getting Started instructions to install packages and build the entire FluentUI React Native repository. I.e. from the root of the repo:
yarn
yarn build
  1. Then go into apps/fluent-tester/macos folder and run pod install to pull in the project-level Cocoapod dependencies defined in the podfile, and to generate a valid xcworkspace:
cd apps/fluent-tester/macos
pod install

Note: if you get the error: "CocoaPods could not find compatible versions for pod "MicrosoftFluentUI"," you may need to run pod install --repo-update.

  1. Return to the macos directory and first run yarn start. Then run yarn macos to launch the FluentUI Tester app:
cd ..
yarn macos

Debugging

You can debug native code in Xcode. To debug javascript code, you can either use standard web debugging, or you can use React Native Tools to debug directly in VS Code. The steps are as follows:

  1. Launch your test app + packager as you normally would
  2. Go the debug menu in VS Code and run the "Attach to Packager (macOS)" configuration
  3. Open the developer menu in your test app, and click debug
  4. You now should be able to set breakpoints and step through your code directly in VS Code.

Dependencies

Dependencies are managed by @rnx-kit/align-deps. If you're looking to upgrade react-native, use the interactive upgrade command:

yarn rnx-align-deps --set-version

This command will ensure that all relevant packages are bumped correctly.

You can read more about this tool here: @rnx-kit/align-deps design document

Troubleshooting

  • If you get the error: "Unable to resolve module... None of these files exist:...", close the packager and restart it by running yarn start. Note: you need to restart the packager when you switch to a different platform (e.g. from iOS to macOS), but once it restarts you can reload the tester apps on all running platforms at once.
  • If you want to do direct debugging via xcode, after the pod install, you can launch src/FluentTester.xcworkspace and build/run the scheme "ReactTestApp"
  • If you want to have a clean rebuild of the generated macOS project, you can do the following:
cd apps/fluent-tester/macos
rm FluentTester.xcworkspace
rm -r Pods/
pod install