Upgrade to RNW 0.73 (#273)

This PR updates RNX's dev dependency to RN(W) 0.73, updates the example
apps, and adds the configuration to the PR/CI test matrix.

Author: jonthysell

.github/workflows/main.yml

@@ -30,9 +30,11 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        rnwVersion: [ '0.72-stable', '0.71-stable'] # test *all* versions that use VS 2022. aka any RNW version >= min in package.json and >= 0.71
+        rnwVersion: [ 'latest', '0.72-stable', '0.71-stable'] # test *all* versions that use VS 2022. aka any RNW version >= min in package.json and >= 0.71
         useRnwNuGet: [false, true] # test building with both RNW source and RNW NuGet
         include:
+          - rnwVersion: 'latest'
+            rnTemplate: 'react-native@latest'
           - rnwVersion: '0.72-stable'
             rnTemplate: 'react-native@0.72-stable'
           - rnwVersion: '0.71-stable'

.github/workflows/pr.yml

@@ -42,9 +42,11 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        rnwVersion: ['0.72-stable', '0.71-stable'] # test *key* versions that use VS 2022. aka any RNW version >= 0.71 used by supported partners and/or Active/Maintenance from https://microsoft.github.io/react-native-windows/support
+        rnwVersion: ['latest', '0.72-stable', '0.71-stable'] # test *key* versions that use VS 2022. aka any RNW version >= 0.71 used by supported partners and/or Active/Maintenance from https://microsoft.github.io/react-native-windows/support
         useRnwNuGet: [false, true] # test building with both RNW source and RNW NuGet
         include:
+          - rnwVersion: 'latest'
+            rnTemplate: 'react-native@latest'
           - rnwVersion: '0.72-stable'
             rnTemplate: 'react-native@0.72-stable'
           - rnwVersion: '0.71-stable'

.github/workflows/template-runcodegen.yml

@@ -26,7 +26,7 @@ jobs:
     - uses: nuget/setup-nuget@v1
 
     - name: NuGet restore
-      run: nuget restore example\windows\example.sln
+      run: nuget restore package\windows\ReactNativeXaml.sln
 
     - name: run CodeGen
       run: yarn codegen

change/react-native-xaml-f4d77dbd-7273-47a1-9553-87d3c6628fab.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Upgrade to RNW 0.73",
+  "packageName": "react-native-xaml",
+  "email": "jthysell@microsoft.com",
+  "dependentChangeType": "patch"
+}

example/__tests__/App-test.js example/__tests__/App.test.tsxexample/__tests__/App-test.js renamed to example/__tests__/App.test.tsx

@@ -6,6 +6,9 @@ import 'react-native';
 import React from 'react';
 import App from '../App';
 
+// Note: import explicitly to use the types shipped with jest.
+import {it} from '@jest/globals';
+
 // Note: test renderer must be required after react-native.
 import renderer from 'react-test-renderer';
 

example/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  presets: ['module:metro-react-native-babel-preset'],
-};
+  presets: ['module:@react-native/babel-preset'],
+};

example/metro.config.js

@@ -1,9 +1,5 @@
-/**
- * Metro configuration for React Native
- * https://github.com/facebook/react-native
- *
- * @format
- */
+const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
+
 const fs = require('fs');
 const path = require('path');
 const exclusionList = require('metro-config/src/defaults/exclusionList');
@@ -12,13 +8,14 @@ const rnwPath = fs.realpathSync(
   path.resolve(require.resolve('react-native-windows/package.json'), '..'),
 );
 
-module.exports = {
-  watchFolders: [
-    // Include hoisted modules
-    path.resolve(__dirname, '..', 'node_modules'),
-    // Include main react-native-xaml package root
-    path.resolve(__dirname, '..', 'package'),
-  ],
+/**
+ * Metro configuration
+ * https://facebook.github.io/metro/docs/configuration
+ *
+ * @type {import('metro-config').MetroConfig}
+ */
+
+const config = {
   resolver: {
     blockList: exclusionList([
       // This stops "react-native run-windows" from causing the metro server to crash if its already running
@@ -47,3 +44,5 @@ module.exports = {
     assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
   },
 };
+
+module.exports = mergeConfig(getDefaultConfig(__dirname), config);

example/package.json

@@ -3,37 +3,36 @@
   "version": "0.0.1",
   "private": true,
   "scripts": {
+    "lint": "eslint .",
     "start": "react-native start",
     "test": "jest",
-    "lint": "eslint .",
     "windows": "react-native run-windows"
   },
   "dependencies": {
     "react": "18.2.0",
-    "react-native": "0.72.3",
-    "react-native-windows": "0.72.2",
+    "react-native": "0.73.0",
+    "react-native-windows": "0.73.4",
     "react-native-xaml": "*"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",
     "@babel/preset-env": "^7.20.0",
     "@babel/runtime": "^7.20.0",
-    "@react-native/eslint-config": "^0.72.2",
-    "@react-native/metro-config": "^0.72.6",
-    "@tsconfig/react-native": "^3.0.0",
-    "@types/metro-config": "^0.76.3",
-    "@types/react": "^18.0.24",
+    "@react-native/babel-preset": "^0.73.18",
+    "@react-native/eslint-config": "^0.73.1",
+    "@react-native/metro-config": "^0.73.2",
+    "@react-native/typescript-config": "^0.73.1",
+    "@types/react": "^18.2.6",
     "@types/react-test-renderer": "^18.0.0",
-    "babel-jest": "^29.2.1",
+    "babel-jest": "^29.6.3",
     "eslint": "^8.19.0",
-    "jest": "^29.2.1",
-    "metro-react-native-babel-preset": "0.76.5",
-    "prettier": "^2.4.1",
+    "jest": "^29.6.3",
+    "prettier": "2.8.8",
     "react-test-renderer": "18.2.0",
-    "typescript": "4.8.4",
-    "metro-config": "^0.76.5"
+    "typescript": "5.0.4",
+    "metro-config": "^0.80.2"
   },
   "engines": {
-    "node": ">=16"
+    "node": ">=18"
   }
-}
+}

example/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@react-native/typescript-config/tsconfig.json"
+}

example/windows/ExperimentalFeatures.props

@@ -14,7 +14,7 @@
       
       See https://microsoft.github.io/react-native-windows/docs/hermes
     -->
-    <UseHermes>false</UseHermes>
+    <UseHermes>true</UseHermes>
 
     <!--
       Changes compilation to assume use of WinUI 3 instead of System XAML.