Add Windows C++ implementation (#239)

Add module implementation using C++ WinRT. This implementation supports
all react-native-windows since 0.61, and includes autolinking support
for react-native-windows>=0.63.

Add test and CI for the Windows implementation.

Separate PR will follow with documentation changes.

Author: bzoz

.github/workflows/windows-ci.yml

@@ -0,0 +1,44 @@
+name: Windows CI
+on: [pull_request]
+
+jobs:
+  run-windows-tests:
+    name: Build & run tests
+    runs-on: windows-2019
+
+    steps:
+    - uses: actions/checkout@v2
+      name: Checkout Code
+     
+    - name: Setup Node.js
+      uses: actions/setup-node@v1
+      with:
+        node-version: '12.9.1'
+
+    - name: Setup MSBuild
+      uses: microsoft/setup-msbuild@v1.0.0
+      with:
+        vs-version: 16.5
+
+    - name: Build the module
+      run: |
+        yarn
+        yarn localPublish
+        cd example
+        yarn
+
+    - name: Build x64 release
+      run: |
+        cd example
+        npx react-native run-windows --release --no-packager --no-launch --logging
+
+    - name: Start Appium server
+      shell: powershell
+      run: |
+        cd example
+        Start-Process PowerShell -ArgumentList "yarn appium"
+      
+    - name: Run tests
+      run: |
+        cd example
+        yarn test:windows

example/__tests__/App-test.tsx

@@ -4,7 +4,7 @@
 
 import 'react-native';
 import React from 'react';
-import App from '../App';
+import App from '../src/routes';
 
 // Note: test renderer must be required after react-native.
 import renderer from 'react-test-renderer';

example/__tests__/CheckStore.tsx

@@ -0,0 +1,23 @@
+import { driver, By2 } from 'selenium-appium'
+import { until } from 'selenium-webdriver';
+
+const setup = require('../jest-setups/jest.setup');
+jest.setTimeout(60000);
+
+beforeAll(() => {
+  return driver.startWithCapabilities(setup.capabilites);
+});
+
+afterAll(() => {
+  return driver.quit();
+});
+
+describe('Test App', () => {
+
+  test('Log present', async () => {
+    // Get the element by label, will fail if the element is not present
+    // We will look for the expected log from the app
+    await driver.wait(until.elementLocated(By2.nativeName('setItem(key1, value1): value1\nsetItem(key2, value2): value2\nsetItem(key3, value3): value3\ngetItem(key2): value2\ndelItem(key2): key2\ngetAllItems():\n - key1 : value1\n - key3 : value3\n')));
+  });
+
+})

example/index.js

@@ -1,5 +1,3 @@
-import 'react-native-gesture-handler';
-
 import { AppRegistry } from 'react-native';
 
 import App from './src/routes';

example/jest-setups/jest.setup.js

@@ -0,0 +1,12 @@
+import { windowsAppDriverCapabilities } from 'selenium-appium'
+
+switch (platform) {
+  case "windows":
+    const webViewWindowsAppId = 'RNSIExample_nsp2ha5jnb6xr!App';
+    module.exports = {
+      capabilites: windowsAppDriverCapabilities(webViewWindowsAppId)
+    }
+    break;
+  default:
+    throw "Unknown platform: " + platform;
+}

example/jest-setups/jest.setup.windows.js

@@ -0,0 +1 @@
+platform = "windows"

example/metro.config.js

@@ -4,8 +4,20 @@
  *
  * @format
  */
+const path = require('path');
+const blacklist = require('metro-config/src/defaults/blacklist');
 
 module.exports = {
+  resolver: {
+    blacklistRE: blacklist([
+      // This stops "react-native run-windows" from causing the metro server to crash if its already running
+      new RegExp(
+        `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
+      ),
+      // This prevents "react-native run-windows" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip
+      /.*\.ProjectImports\.zip/,
+    ]),
+  },
   transformer: {
     getTransformOptions: async () => ({
       transform: {

example/package.json

@@ -4,22 +4,29 @@
   "private": true,
   "scripts": {
     "android": "react-native run-android",
+    "appium": "appium",
     "ios": "react-native run-ios",
+    "windows": "react-native run-windows",
     "start": "react-native start",
     "test": "jest",
+    "test:windows": "yarn jest --setupFiles=./jest-setups/jest.setup.windows.js",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
   },
   "dependencies": {
     "@react-native-community/masked-view": "^0.1.10",
     "@react-navigation/native": "^5.7.2",
     "@react-navigation/stack": "^5.8.0",
+    "appium": "^1.18.3",
     "react": "16.13.1",
     "react-native": "0.63.2",
     "react-native-gesture-handler": "^1.7.0",
     "react-native-reanimated": "^1.10.1",
     "react-native-safe-area-context": "^3.1.1",
     "react-native-screens": "^2.9.0",
-    "react-native-sensitive-info": "file:.yalc/react-native-sensitive-info"
+    "react-native-sensitive-info": "file:.yalc/react-native-sensitive-info",
+    "react-native-windows": "^0.63.0-0",
+    "selenium-appium": "^0.0.15",
+    "selenium-webdriver": "^4.0.0-alpha.7"
   },
   "devDependencies": {
     "@babel/core": "^7.10.5",

example/src/pages/Home/index.tsx

@@ -1,5 +1,5 @@
-import React, { useCallback } from 'react';
-import { View, Button, Alert } from 'react-native';
+import React, { useCallback, useState } from 'react';
+import { View, Button, Alert, Text } from 'react-native';
 import SInfo from 'react-native-sensitive-info';
 
 const Home: React.FC = () => {
@@ -72,6 +72,27 @@ const Home: React.FC = () => {
     }
   }, []);
 
+  const [logText, setLogText] = useState('')
+  async function runTest(){
+    const options =  {
+      sharedPreferencesName: 'exampleAppTest',
+      keychainService: 'exampleAppTest',
+    };
+    let dbgText = '';
+    dbgText += `setItem(key1, value1): ${await SInfo.setItem('key1', 'value1', options)}\n`;
+    dbgText += `setItem(key2, value2): ${await SInfo.setItem('key2', 'value2', options)}\n`;
+    dbgText += `setItem(key3, value3): ${await SInfo.setItem('key3', 'value3', options)}\n`;
+    dbgText += `getItem(key2): ${await SInfo.getItem('key2', options)}\n`;
+    dbgText += `delItem(key2): ${await SInfo.deleteItem('key2', options)}\n`;
+    dbgText += `getAllItems():\n`
+    const allItems = await SInfo.getAllItems(options);
+    for (const key in allItems) {
+      dbgText += ` - ${key} : ${allItems[key]}\n`;
+    }
+    setLogText(dbgText);
+  };
+  runTest();
+
   return (
     <View>
       <Button
@@ -88,6 +109,8 @@ const Home: React.FC = () => {
       />
 
       <Button title="Get TouchID Data" onPress={getTouchIDItem} />
+
+      <Text>{logText}</Text>
     </View>
   );
 };

example/src/routes/index.tsx

@@ -1,17 +1,3 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
-
 import HomeScreen from '../pages/Home';
-
-const Stack = createStackNavigator();
-
-const RootRoute: React.FC = () => (
-  <NavigationContainer>
-    <Stack.Navigator>
-      <Stack.Screen name="Home" component={HomeScreen} />
-    </Stack.Navigator>
-  </NavigationContainer>
-);
-
+const RootRoute = HomeScreen;
 export default RootRoute;