Extend device plugin metadata to include supported devices

Summary: Plugin metadata format extended to include type of each plugin (client / device) and list of supported devices (android/ios/..., emulator/physical, etc). This will allow to detect plugins supported by device even if they are not installed and only available on Marketplace.

Reviewed By: mweststrate

Differential Revision: D26073531

fbshipit-source-id: e331f1be1af1046cd4220a286a1d52378c26cc53

desktop/app/src/chrome/plugin-manager/__tests__/PluginInstaller.node.tsx

@@ -33,6 +33,7 @@ const samplePluginDetails1: UpdatablePluginDetails = {
   entry: './test/index.js',
   version: '0.1.0',
   specVersion: 2,
+  pluginType: 'client',
   main: 'dist/bundle.js',
   dir: '/Users/mock/.flipper/thirdparty/flipper-plugin-sample1',
   source: 'src/index.js',
@@ -52,6 +53,7 @@ const samplePluginDetails2: UpdatablePluginDetails = {
   entry: './test/index.js',
   version: '0.2.0',
   specVersion: 2,
+  pluginType: 'client',
   main: 'dist/bundle.js',
   dir: '/Users/mock/.flipper/thirdparty/flipper-plugin-sample2',
   source: 'src/index.js',

desktop/app/src/devices/AndroidDevice.tsx

@@ -16,6 +16,7 @@ import type {LogLevel, DeviceType} from 'flipper-plugin';
 import which from 'which';
 import {spawn} from 'child_process';
 import {dirname} from 'path';
+import {DeviceSpec} from 'flipper-plugin-lib';
 
 const DEVICE_RECORDING_DIR = '/sdcard/flipper_recorder';
 
@@ -27,8 +28,9 @@ export default class AndroidDevice extends BaseDevice {
     adb: ADBClient,
     abiList: Array<string>,
     sdkVersion: string,
+    specs: DeviceSpec[] = [],
   ) {
-    super(serial, deviceType, title, 'Android');
+    super(serial, deviceType, title, 'Android', specs);
     this.adb = adb;
     this.icon = 'icons/android.svg';
     this.abiList = abiList;

desktop/app/src/devices/BaseDevice.tsx

@@ -17,6 +17,7 @@ import {
 } from 'flipper-plugin';
 import type {DevicePluginDefinition, DevicePluginMap} from '../plugin';
 import {getFlipperLibImplementation} from '../utils/flipperLibImplementation';
+import {DeviceSpec, OS as PluginOS} from 'flipper-plugin-lib';
 
 export type DeviceShell = {
   stdout: stream.Readable;
@@ -24,6 +25,8 @@ export type DeviceShell = {
   stdin: stream.Writable;
 };
 
+export type OS = PluginOS | 'Windows' | 'MacOS' | 'JSWebApp';
+
 export type DeviceExport = {
   os: OS;
   title: string;
@@ -32,14 +35,19 @@ export type DeviceExport = {
   logs: Array<DeviceLogEntry>;
 };
 
-export type OS = 'iOS' | 'Android' | 'Windows' | 'MacOS' | 'JSWebApp' | 'Metro';
-
 export default class BaseDevice {
-  constructor(serial: string, deviceType: DeviceType, title: string, os: OS) {
+  constructor(
+    serial: string,
+    deviceType: DeviceType,
+    title: string,
+    os: OS,
+    specs: DeviceSpec[] = [],
+  ) {
     this.serial = serial;
     this.title = title;
     this.deviceType = deviceType;
     this.os = os;
+    this.specs = specs;
   }
 
   // operating system of this device
@@ -54,6 +62,9 @@ export default class BaseDevice {
   // serial number for this device
   serial: string;
 
+  // additional device specs used for plugin compatibility checks
+  specs: DeviceSpec[];
+
   // possible src of icon to display next to the device title
   icon: string | null | undefined;
 

desktop/app/src/devices/KaiOSDevice.tsx

@@ -7,9 +7,22 @@
  * @format
  */
 
+import {DeviceType} from 'flipper-plugin-lib';
 import AndroidDevice from './AndroidDevice';
+import {Client as ADBClient} from 'adbkit';
 
 export default class KaiOSDevice extends AndroidDevice {
+  constructor(
+    serial: string,
+    deviceType: DeviceType,
+    title: string,
+    adb: ADBClient,
+    abiList: Array<string>,
+    sdkVersion: string,
+  ) {
+    super(serial, deviceType, title, adb, abiList, sdkVersion, ['KaiOS']);
+  }
+
   async screenCaptureAvailable() {
     // The default way of capturing screenshots through adb does not seem to work
     // There is a way of getting a screenshot through KaiOS dev tools though

desktop/app/src/dispatcher/__tests__/plugins.node.tsx

@@ -41,6 +41,7 @@ const sampleInstalledPluginDetails: InstalledPluginDetails = {
   name: 'other Name',
   version: '1.0.0',
   specVersion: 2,
+  pluginType: 'client',
   main: 'dist/bundle.js',
   source: 'src/index.js',
   id: 'Sample',

desktop/app/src/plugins/TableNativePlugin.tsx

@@ -261,6 +261,7 @@ export default function createTableNativePlugin(id: string, title: string) {
       title,
       icon: 'apps',
       name: id,
+      pluginType: 'client',
       // all hmm...
       specVersion: 1,
       version: 'auto',

desktop/app/src/reducers/__tests__/plugins.node.tsx

@@ -88,6 +88,7 @@ test('add gatekeeped plugin', () => {
       version: '1.0.0',
       dir: '/plugins/test',
       specVersion: 2,
+      pluginType: 'client',
       source: 'src/index.ts',
       isBundled: false,
       isActivatable: true,

desktop/app/src/utils/testUtils.tsx

@@ -48,6 +48,7 @@ export function createMockDownloadablePluginDetails(
     main: 'dist/bundle.js',
     source: 'src/index.tsx',
     specVersion: 2,
+    pluginType: 'client',
     title: title ?? id,
     version: version,
     downloadUrl: `http://localhost/${lowercasedID}/${version}`,

desktop/flipper-plugin/src/plugin/DevicePlugin.tsx

@@ -10,6 +10,7 @@
 import {SandyPluginDefinition} from './SandyPluginDefinition';
 import {BasePluginInstance, BasePluginClient} from './PluginBase';
 import {FlipperLib} from './FlipperLib';
+import {DeviceType as PluginDeviceType} from 'flipper-plugin-lib';
 
 export type DeviceLogListener = (entry: DeviceLogEntry) => void;
 
@@ -40,7 +41,7 @@ export interface Device {
   onLogEntry(cb: DeviceLogListener): () => void;
 }
 
-export type DeviceType = 'emulator' | 'physical';
+export type DeviceType = PluginDeviceType;
 
 export type DevicePluginPredicate = (device: Device) => boolean;
 

desktop/flipper-plugin/src/test-utils/test-utils.tsx

@@ -390,6 +390,7 @@ export function createMockPluginDetails(
     dir: '',
     name: 'TestPlugin',
     specVersion: 0,
+    pluginType: 'client',
     entry: '',
     isBundled: false,
     isActivatable: true,

desktop/pkg/schemas/plugin-package-v2.json

@@ -39,6 +39,43 @@
         "pattern": "flipper-plugin"
       },
       "errorMessage": "should contain keyword \"flipper-plugin\""
+    },
+    "pluginType": {
+      "description": "Type of the plugin - client or device. If omitted, \"client\" type is used by default.",
+      "type": "string",
+      "enum": ["client", "device"]
+    },
+    "supportedDevices": {
+      "description": "List of devices supported by the plugin. The list could contain multiple devices each defined as conjunction of several properties.",
+      "type": "array",
+      "items": {
+        "description": "Device definition. E.g. {\"os\": \"Android\", \"type\": \"physical\", \"archived\": false} means that plugin supports only Android physical unarchived devices.",
+        "type": "object",
+        "properties": {
+          "os": {
+            "description": "Device OS: iOS, Android or Metro. Lack of this property means that all OSes supported.",
+            "type": "string",
+            "enum": ["iOS", "Android", "Metro"]
+          },
+          "type": {
+            "description": "Device type: physical or emulator. Lack of this property means both physical and emulator devices supported.",
+            "type": "string",
+            "enum": ["physical", "emulator"]
+          },
+          "archived": {
+            "description": "Specifies support for archived devices. Lack of this property means that both live and archived devices supported. False means only live devices supported. True means only archived devices supported.",
+            "type": "boolean"
+          },
+          "specs": {
+            "description": "Additional specs required for plugin, e.g. \"KaiOS\" runtime.",
+            "type": "array",
+            "items": {
+              "type": "string",
+              "enum": ["KaiOS"]
+            }
+          }
+        }
+      }
     }
   },
   "required": [

desktop/plugin-lib/src/PluginDetails.ts

@@ -27,8 +27,25 @@ export interface PluginDetails {
     url?: string;
   };
   flipperSDKVersion?: string;
+  pluginType: PluginType;
+  supportedDevices?: SupportedDevice[];
 }
 
+export interface SupportedDevice {
+  readonly os?: OS;
+  readonly type?: DeviceType;
+  readonly archived?: boolean;
+  readonly specs?: DeviceSpec[];
+}
+
+export type OS = 'iOS' | 'Android' | 'Metro';
+
+export type DeviceType = 'emulator' | 'physical';
+
+export type PluginType = 'client' | 'device';
+
+export type DeviceSpec = 'KaiOS';
+
 export interface ConcretePluginDetails extends PluginDetails {
   // Determines whether the plugin is a part of the Flipper JS bundle.
   isBundled: boolean;

desktop/plugin-lib/src/__tests__/getPluginDetails.node.ts

@@ -49,8 +49,10 @@ test('getPluginDetailsV1', async () => {
       "isBundled": false,
       "main": "dist/bundle.js",
       "name": "flipper-plugin-test",
+      "pluginType": "client",
       "source": "src/index.tsx",
       "specVersion": 1,
+      "supportedDevices": undefined,
       "title": "Test Plugin",
       "version": "2.0.0",
     }
@@ -88,8 +90,10 @@ test('getPluginDetailsV2', async () => {
       "isBundled": false,
       "main": "dist/bundle.js",
       "name": "flipper-plugin-test",
+      "pluginType": "client",
       "source": "src/index.tsx",
       "specVersion": 2,
+      "supportedDevices": undefined,
       "title": "Test",
       "version": "3.0.1",
     }
@@ -127,8 +131,10 @@ test('id used as title if the latter omited', async () => {
       "isBundled": false,
       "main": "dist/bundle.js",
       "name": "flipper-plugin-test",
+      "pluginType": "client",
       "source": "src/index.tsx",
       "specVersion": 2,
+      "supportedDevices": undefined,
       "title": "test",
       "version": "3.0.1",
     }
@@ -165,8 +171,10 @@ test('name without "flipper-plugin-" prefix is used as title if the latter omite
       "isBundled": false,
       "main": "dist/bundle.js",
       "name": "flipper-plugin-test",
+      "pluginType": "client",
       "source": "src/index.tsx",
       "specVersion": 2,
+      "supportedDevices": undefined,
       "title": "test",
       "version": "3.0.1",
     }
@@ -206,10 +214,75 @@ test('flipper-plugin-version is parsed', async () => {
       "isBundled": false,
       "main": "dist/bundle.js",
       "name": "flipper-plugin-test",
+      "pluginType": "client",
       "source": "src/index.tsx",
       "specVersion": 2,
+      "supportedDevices": undefined,
       "title": "test",
       "version": "3.0.1",
     }
   `);
 });
+
+test('plugin type and supported devices parsed', async () => {
+  const pluginV2 = {
+    $schema: 'https://fbflipper.com/schemas/plugin-package/v2.json',
+    name: 'flipper-plugin-test',
+    title: 'Test',
+    version: '3.0.1',
+    pluginType: 'device',
+    supportedDevices: [
+      {os: 'Android', archived: false},
+      {os: 'Android', type: 'physical', specs: ['KaiOS']},
+      {os: 'iOS', type: 'emulator'},
+    ],
+    main: 'dist/bundle.js',
+    flipperBundlerEntry: 'src/index.tsx',
+    description: 'Description of Test Plugin',
+    gatekeeper: 'GK_flipper_plugin_test',
+  };
+  jest.mock('fs-extra', () => jest.fn());
+  fs.readJson = jest.fn().mockImplementation(() => pluginV2);
+  const details = await getInstalledPluginDetails(pluginPath);
+  details.dir = normalizePath(details.dir);
+  details.entry = normalizePath(details.entry);
+  expect(details).toMatchInlineSnapshot(`
+    Object {
+      "bugs": undefined,
+      "category": undefined,
+      "description": "Description of Test Plugin",
+      "dir": "/Users/mock/.flipper/thirdparty/flipper-plugin-test",
+      "entry": "/Users/mock/.flipper/thirdparty/flipper-plugin-test/dist/bundle.js",
+      "flipperSDKVersion": undefined,
+      "gatekeeper": "GK_flipper_plugin_test",
+      "icon": undefined,
+      "id": "flipper-plugin-test",
+      "isActivatable": true,
+      "isBundled": false,
+      "main": "dist/bundle.js",
+      "name": "flipper-plugin-test",
+      "pluginType": "device",
+      "source": "src/index.tsx",
+      "specVersion": 2,
+      "supportedDevices": Array [
+        Object {
+          "archived": false,
+          "os": "Android",
+        },
+        Object {
+          "os": "Android",
+          "specs": Array [
+            "KaiOS",
+          ],
+          "type": "physical",
+        },
+        Object {
+          "os": "iOS",
+          "type": "emulator",
+        },
+      ],
+      "title": "Test",
+      "version": "3.0.1",
+    }
+  `);
+});

desktop/plugin-lib/src/__tests__/getUpdatablePlugins.node.ts

@@ -60,6 +60,7 @@ const installedPlugins: InstalledPluginDetails[] = [
     entry: './test/index.js',
     version: '0.1.0',
     specVersion: 2,
+    pluginType: 'client',
     main: 'dist/bundle.js',
     dir: '/Users/mock/.flipper/thirdparty/flipper-plugin-sample1',
     source: 'src/index.js',
@@ -74,6 +75,7 @@ const installedPlugins: InstalledPluginDetails[] = [
     entry: './test/index.js',
     version: '0.2.0',
     specVersion: 2,
+    pluginType: 'client',
     main: 'dist/bundle.js',
     dir: '/Users/mock/.flipper/thirdparty/flipper-plugin-sample2',
     source: 'src/index.js',

desktop/plugin-lib/src/getPluginDetails.ts

@@ -87,6 +87,8 @@ function getPluginDetailsV1(packageJson: any): PluginDetails {
     category: packageJson.category,
     bugs: packageJson.bugs,
     flipperSDKVersion: packageJson?.peerDependencies?.['flipper-plugin'],
+    pluginType: packageJson?.pluginType || 'client',
+    supportedDevices: packageJson?.supportedDevices,
   };
 }
 
@@ -107,6 +109,8 @@ function getPluginDetailsV2(packageJson: any): PluginDetails {
     category: packageJson.category,
     bugs: packageJson.bugs,
     flipperSDKVersion: packageJson?.peerDependencies?.['flipper-plugin'],
+    pluginType: packageJson?.pluginType || 'client',
+    supportedDevices: packageJson?.supportedDevices,
   };
 }
 

desktop/plugins/cpu/package.json

@@ -2,6 +2,10 @@
   "$schema": "https://fbflipper.com/schemas/plugin-package/v2.json",
   "name": "flipper-plugin-device-cpu",
   "id": "DeviceCPU",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Android", "type": "physical"}
+  ],
   "version": "0.0.0",
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",

desktop/plugins/crash_reporter/package.json

@@ -2,6 +2,11 @@
   "$schema": "https://fbflipper.com/schemas/plugin-package/v2.json",
   "name": "flipper-plugin-crash-reporter",
   "id": "CrashReporter",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Android"},
+    {"os": "iOS", "type": "emulator"}
+  ],
   "version": "0.0.0",
   "description": "A plugin which will display a crash",
   "main": "dist/bundle.js",

desktop/plugins/hermesdebuggerrn/package.json

@@ -2,6 +2,10 @@
   "$schema": "https://fbflipper.com/schemas/plugin-package/v2.json",
   "name": "flipper-plugin-hermesdebuggerrn",
   "id": "Hermesdebuggerrn",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Metro", "archived": false}
+  ],
   "version": "0.0.0",
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",

desktop/plugins/kaios-allocations/package.json

@@ -3,6 +3,10 @@
   "name": "flipper-plugin-kaios-big-allocations",
   "id": "kaios-big-allocations",
   "version": "0.0.0",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Android", "specs": ["KaiOS"]}
+  ],
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",
   "license": "MIT",

desktop/plugins/kaios-ram/package.json

@@ -3,6 +3,10 @@
   "name": "flipper-plugin-kaios-graphs",
   "id": "kaios-graphs",
   "version": "0.0.0",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Android", "specs": ["KaiOS"]}
+  ],
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",
   "license": "MIT",

desktop/plugins/logs/package.json

@@ -2,6 +2,12 @@
   "$schema": "https://fbflipper.com/schemas/plugin-package/v2.json",
   "name": "flipper-plugin-device-logs",
   "id": "DeviceLogs",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Android"},
+    {"os": "iOS", "type": "emulator"},
+    {"os": "Metro"}
+  ],
   "version": "0.0.0",
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",

desktop/plugins/reactdevtools/package.json

@@ -3,6 +3,10 @@
   "name": "flipper-plugin-react-devtools",
   "id": "React",
   "version": "0.0.0",
+  "pluginType": "device",
+  "supportedDevices": [
+    {"os": "Metro", "archived": false}
+  ],
   "main": "dist/bundle.js",
   "flipperBundlerEntry": "index.tsx",
   "license": "MIT",