Facebook has opened its extensible mobile application debugging platform Sonar on GitHub.

Sonar is a platform for debugging mobile apps on iOS and Android. Visualize, inspect, and control your application through the desktop interface, which also provides a range of useful tools, including log viewer, interactive layout inspector, and network inspector.

You can use Sonar directly or extend it with plug-in apis to visualize and debug data in mobile applications, with Sonar taking care of sending data back and forth, calling functions and listening for events on mobile applications.

Sonar consists of two parts:

  • Desktop applications for macOS

  • Native mobile SDK for Android and iOS

To use Sonar you will need to add a mobile SDK to your applications.

Sonar doesn’t need any specific Settings on desktop applications, just download the latest version of the application and start it up. Desktop applications are available for macOS and require Android and iOS development tools installed on the system.

Once you’ve launched Sonar and launched the simulator or connected to the device, you’ll be able to view the device’s logs in Sonar, and to view application-specific data you’ll need to integrate the native SDK with your app.

Sonar is released via JCenter to add dependencies to your build.gradle file.

Dependencies repositories {jcenter ()} {debugCompile 'com. Facebook. Sonar, sonar: 0.0.1'}Copy the code

Sonar onCreate you can now initialize Sonar onCreate in your application by:

public class MyApplication extends Application { @Override public void onCreate() { super.onCreate(); SoLoader.init(this, 0); if (BuildConfig.DEBUG && SonarUtils.shouldEnableSonar(this)) { final SonarClient client = AndroidSonarClient.getInstance(this); client.addPlugin(new MySonarPlugin()); client.start(); }}}Copy the code

To integrate with iOS apps, you can use CocoaPods to add the mobile Sonar SDK and its dependencies to your Podfile:

Platform :ios, '8.0' swift_version = '4.1' target 'MyApp' do pod 'RSocket', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/RSocket.podspec?token=ADr9NE_I05Vu8g7o q_g6g_9FLx784NFmks5bJ5LvwA%3D%3D' pod 'DoubleConversion', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/DoubleConversion.podspec?token=ADr9NOx tIEmr5ODP9PWq6-sht-Ye6UYGks5bJ5MjwA%3D%3D' pod 'glog', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/glog.podspec?token=ADr9NBHbrlbkFR3DQTP zj0CnZdria4jvks5bJ5M3wA%3D%3D' pod 'Folly', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/Folly.podspec?token=ADr9NNTjwJ8xqLFwc3 Qz3xB3GsCk-Esmks5bJ5NGwA%3D%3D' pod 'PeerTalk', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/PeerTalk.podspec?token=ADr9NB8frQTrUWy TsMXtdv_P8km7jV_Mks5bJ5NbwA %3D%3D' pod ','~>1.8.1', : Modular_headers => true pod 'Sonar', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/xplat/Sonar/Sonar.podspec?token=ADr9NFO7byH9uAuhGAIEYuoJeBNyBxf 6ks5bJ5N8wA%3D%3D' pod 'SonarKit', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/SonarKit.podspec?token=ADr9NBuYoodM_NeysQg899hkxXw0WZ7Xks5bJ5OV wA%3D%3D' pod 'SonarKit/SonarKitLayoutComponentKitSupport', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/SonarKit.podspec?token=ADr9NBuYoodM_NeysQg899hkxXw0WZ7Xks5bJ5OV wA%3D%3D' pod 'SonarKit/SKIOSNetworkPlugin', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/SonarKit.podspec?token=ADr9NBuYoodM_NeysQg899hkxXw0WZ7Xks5bJ5OV wA%3D%3D' pod 'ComponentKit', :podspec => 'https://raw.githubusercontent.com/facebook/Sonar/master/iOS/third-party-podspecs/ComponentKit.podspec?token=ADr9NNV9gqk pFTUKaHpCiYOZIG3Ev-Hyks5bJ5O-wA%3D%3D' post_install do |installer| installer.pods_project.targets.each do |target| if ['YogaKit'].include? target.name target.build_configurations.each do |config| config.build_settings['SWIFT_VERSION'] = swift_version end end end end endCopy the code

By running Pod Install to install the dependencies, you can import and initialize Sonar in the AppDelegate when you open your app’s Xcode workspace file.

#import <SonarKit/SonarClient.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
#if DEBUG
  SonarClient *client = [SonarClient sharedClient];
  [client addPlugin:[MySonarPlugin new]];
  [client start];
#endif
  ...
}
@endCopy the code

Finally, you’ll need to add the plugins to your Sonar client, with the following link:

  • Network plug-in:

https://fbsonar.com/docs/network-plugin.html

  • Layout Inspector plugin:

https://fbsonar.com/docs/layout-plugin.html

Making:

https://github.com/facebook/sonar

Introduction:

https://fbsonar.com/docs/getting-started.html

Top of the Front is InfoQ’s vertical community focused on big front end technologies. Keep up with the trend of The Times, share first-line technology, welcome to pay attention to.

InfoQ Large front-end technology community

Activity recommended

GMTC Global Big Front-end Technology Conference joins hands with top co-creators: APICloud enterprise Internet ecological platform, which took half a year to prepare, sorted out the latest trends in the current big front-end field for everyone, and invited front-line front-end experts from Google, Twitter, Instagram and other foreign countries to share their cutting-edge technologies and best practices. Mattt, head of iOS GraphQL, Apollo, etc.

At present, the countdown tickets are selling well, group purchase is more preferential, ticket consultation: 18514549229 (with wechat) Stamps read the original text or identify the two-dimensional code below, learn more details of dry goods!