Add a custom SVG REPL so so you can paste or type in an svg and rende…

.ado/azure-pipelines.publish.yml

@@ -33,17 +33,17 @@ jobs:
     displayName: NPM Publish
     pool: Azure-Pipelines-EO-Ubuntu20.04-Office
     steps:
-      - task: NodeTool@0
-        inputs:
-          versionSpec: '14.x'
-        displayName: 'Install Node.js'
+      - template: templates/setup-repo.yml
 
       - script: |
           git config user.name "UI-Fabric-RN-Bot"
           git config user.email "uifrnbot@microsoft.com"
           git remote set-url origin https://$(githubUser):$(githubPAT)@github.com/microsoft/ui-fabric-react-native.git
         displayName: Git Authentication
-      - template: templates/yarn-install.yml
+
+      - script: |
+          yarn
+        displayName: 'yarn install'
 
       - script: |
           yarn buildci

.ado/azure-pipelines.yml

@@ -5,7 +5,7 @@ variables:
   CI: true
 
 jobs:
-  # Dedicated task to build and bundle JS code, including jest tests, snapshot testing, and linting, because these things can be super
+  # Dedicated task to build JS code, including jest tests, snapshot testing, and linting, because these things can be super
   # time consuming they don't need to run on every CI pass, instead do a dedicated JS loop to make the platform specific tests start quicker
   - job: JSPR
     displayName: JS PR
@@ -69,6 +69,8 @@ jobs:
     pool:
       vmImage: 'internal-macos12'
       demands: ['xcode', 'sh', 'npm']
+    variables:
+      platform: 'macos'
     timeoutInMinutes: 60 # how long to run the job before automatically cancelling
     cancelTimeoutInMinutes: 5 # how much time to give 'run always even if cancelled tasks' before killing them
 
@@ -94,9 +96,17 @@ jobs:
       # Select proper Xcode version
       - template: templates/apple-xcode-select.yml
 
-      - template: templates/apple-yarn-build.yml
-        parameters:
-          platform: 'macos'
+      - bash: |
+          echo "pod install $(platform)"
+          pod install
+        workingDirectory: apps/fluent-tester/$(platform)
+        displayName: 'pod install $(platform)'
+
+      - bash: |
+          echo "yarn $(platform)"
+          yarn $(platform)
+        workingDirectory: apps/fluent-tester
+        displayName: 'yarn $(platform)'
 
       - template: templates/e2e-testing-macos.yml
 
@@ -105,6 +115,8 @@ jobs:
     pool:
       vmImage: 'internal-macos12'
       demands: ['xcode', 'sh', 'npm']
+    variables:
+      platform: 'ios'
     timeoutInMinutes: 60 # how long to run the job before automatically cancelling
     cancelTimeoutInMinutes: 5 # how much time to give 'run always even if cancelled tasks' before killing them
 
@@ -130,16 +142,34 @@ jobs:
       # Select proper Xcode version
       - template: templates/apple-xcode-select.yml
 
-      - template: templates/apple-yarn-build.yml
-        parameters:
-          platform: 'ios'
+      - bash: |
+          echo "pod install $(platform)"
+          pod install
+        workingDirectory: apps/fluent-tester/$(platform)
+        displayName: 'pod install $(platform)'
+
+      - bash: |
+          echo "Pre boot simulator"
+          UDID=$(xcrun simctl create test-iphone com.apple.CoreSimulator.SimDeviceType.iPhone-14 com.apple.CoreSimulator.SimRuntime.iOS-16-2)
+          xcrun simctl boot $UDID
+        workingDirectory: apps/fluent-tester
+        displayName: 'Boot simulator'
+
+      - bash: |
+          echo "yarn $(platform)"
+          yarn $(platform) --simulator "iPhone 14"
+        workingDirectory: apps/fluent-tester
+        displayName: 'yarn $(platform)x'
 
       - template: templates/e2e-testing-ios.yml
 
   # Windows bundling and end to end testing
   - job: WindowsPR
     displayName: Windows PR
-    pool: rnw-pool-4
+    pool:
+      name: rnw-pool-4
+      demands:
+        - ImageOverride -equals rnw-img-vs2022
     timeoutInMinutes: 60 # how long to run the job before automatically cancelling
     cancelTimeoutInMinutes: 5 # how much time to give 'run always even if cancelled tasks' before killing them
 

.ado/scripts/xcode_select_current_version.sh

@@ -3,7 +3,7 @@
 if [ -n "$XCODE_PATH_OVERRIDE" ]; then # If someone calls this with the XCODE_PATH_OVERRIDE variable set to a path to a developer dir, use it instead
     XCODE_PATH="$XCODE_PATH_OVERRIDE"
 else
-    XCODE_PATH='/Applications/Xcode_14.0.1.app/Contents/Developer'
+    XCODE_PATH='/Applications/Xcode_14.2.app/Contents/Developer'
 fi
 
 echo "Running command: sudo xcode-select --switch $XCODE_PATH"

.ado/templates/e2e-dependency-nuget-publish.yml

@@ -8,15 +8,7 @@ steps:
   - checkout: self
     persistCredentials: true
 
-  - task: NodeTool@0
-    inputs:
-      versionSpec: "14.x"
-    displayName: "Install Node.js"
-
-  - task: NuGetToolInstaller@0
-    inputs:
-      versionSpec: "5.6.0"
-    displayName: "Install Nuget"
+  - template: setup-repo.yml
 
   - script: |
       yarn

.ado/templates/e2e-testing-android.yml

@@ -27,6 +27,12 @@ steps:
     condition: succeeded()
     displayName: 'Create success build variable'
 
+  - script: |
+      yarn appium driver install uiautomator2
+    workingDirectory: apps/E2E
+    displayName: 'Install appium driver'
+    condition: succeeded()
+
   - script: |
       yarn e2etest:android
     workingDirectory: apps/E2E
@@ -39,3 +45,9 @@ steps:
       platform: 'android'
       buildArtifacts: variables['task.Build.status']
       directory: $(Build.SourcesDirectory)/apps/E2E
+
+  - script: |
+      yarn appium driver uninstall uiautomator2
+    workingDirectory: apps/E2E
+    displayName: 'Uninstall appium driver'
+    condition: succeeded()

.ado/templates/e2e-testing-ios.yml

@@ -11,6 +11,12 @@ steps:
     condition: succeeded()
     displayName: 'Create success build variable'
 
+  - script: |
+      yarn appium driver install xcuitest
+    workingDirectory: apps/E2E
+    displayName: 'Install appium driver'
+    condition: succeeded()
+
   - script: |
       yarn e2etest:ios
     workingDirectory: apps/E2E
@@ -23,3 +29,9 @@ steps:
       platform: 'ios'
       buildArtifacts: variables['task.Build.status']
       directory: $(Build.SourcesDirectory)/apps/E2E
+
+  - script: |
+      yarn appium driver uninstall xcuitest
+    workingDirectory: apps/E2E
+    displayName: 'Uninstall appium driver'
+    condition: succeeded()

.ado/templates/e2e-testing-macos.yml

@@ -11,6 +11,12 @@ steps:
     condition: succeeded()
     displayName: 'Create success build variable'
 
+  - script: |
+      yarn appium driver install mac2
+    workingDirectory: apps/E2E
+    displayName: 'Install appium driver'
+    condition: succeeded()
+
   - script: |
       yarn e2etest:macos
     workingDirectory: apps/E2E
@@ -22,4 +28,10 @@ steps:
       applicationType: macos
       platform: 'macos'
       buildArtifacts: variables['task.Build.status']
-      directory: $(Build.SourcesDirectory)/apps/E2E
+      directory: $(Build.SourcesDirectory)/apps/E2E
+
+  - script: |
+      yarn appium driver uninstall mac2
+    workingDirectory: apps/E2E
+    displayName: 'Uninstall appium driver'
+    condition: succeeded()

.ado/templates/e2e-testing-uwp.yml

@@ -57,6 +57,12 @@ steps:
     condition: succeeded()
     displayName: 'Create success build variable'
 
+  - script: |
+      yarn appium driver install --source=npm appium-windows-driver
+    workingDirectory: apps/E2E
+    displayName: 'Install appium driver'
+    condition: succeeded()
+
   - script: |
       yarn e2etest:windows
     workingDirectory: apps\E2E

.ado/templates/e2e-testing-win32.yml

@@ -25,6 +25,12 @@ steps:
     condition: succeeded()
     displayName: 'Create success build variable'
 
+  - script: |
+      yarn appium driver install --source=npm appium-windows-driver
+    workingDirectory: apps/win32
+    displayName: 'Install appium driver'
+    condition: succeeded()
+
   - script: |
       yarn e2etest
     workingDirectory: apps/win32
@@ -37,3 +43,9 @@ steps:
       platform: 'win32'
       buildArtifacts: variables['task.Build.status']
       directory: $(Build.SourcesDirectory)/apps/win32
+
+  - script: |
+      yarn appium driver uninstall windows
+    workingDirectory: apps/win32
+    displayName: 'Uninstall appium driver'
+    condition: succeeded()

.ado/templates/setup-repo.yml

@@ -2,12 +2,14 @@
 steps:
   - task: NodeTool@0
     inputs:
-      versionSpec: "14.x"
-    displayName: "Install Node.js"
+      versionSource: 'fromFile'
+      versionFilePath: '.node-version'
 
   - task: NuGetToolInstaller@0
     inputs:
-      versionSpec: "5.6.0"
-    displayName: "Install Nuget"
+      versionSpec: '5.6.0'
+    displayName: 'Install Nuget'
 
-  - template: yarn-install.yml
+  - script: |
+      yarn install  --frozen-lockfile
+    displayName: 'yarn install'

.ado/templates/win32-nuget-publish.yml

@@ -14,13 +14,18 @@ steps:
       yarn buildci
     displayName: 'Building the repo'
 
+  - script: |
+      yarn bundle
+    workingDirectory: apps/win32
+    displayName: 'Bundling FluentTester Win32 app'
+
   # Pack the NuGet package
   - task: CmdLine@1
     displayName: 'Create NuGet package for FluentTester Win32 bundle.'
     inputs:
-        filename: nuget
-        arguments: 'pack Microsoft.FluentUI.FluentTesterWin32.nuspec -OutputDirectory $(Build.ArtifactStagingDirectory) -OutputFileNamesWithoutVersion -Verbosity detailed -Version $(Build.BuildNumber) -properties CommitId=$(Build.SourceVersion)'
-        workingFolder: 'apps/win32/nuget'
+      filename: nuget
+      arguments: 'pack Microsoft.FluentUI.FluentTesterWin32.nuspec -OutputDirectory $(Build.ArtifactStagingDirectory) -OutputFileNamesWithoutVersion -Verbosity detailed -Version $(Build.BuildNumber) -properties CommitId=$(Build.SourceVersion)'
+      workingFolder: 'apps/win32/nuget'
 
   # Pack the NuGet package
   - task: CmdLine@1
@@ -58,4 +63,4 @@ steps:
     inputs:
       command: push
       packagesToPush: '$(Build.ArtifactStagingDirectory)/Microsoft.FluentUI.E2E.Testing.Data.nupkg'
-      publishVstsFeed: Office
+      publishVstsFeed: Office

.node-version

@@ -0,0 +1 @@
+16

CONTRIBUTING.md

@@ -65,9 +65,8 @@ Reach out to Samuel Freiberg with any questions related to E2E testing.
 
    1. `index.ts`
       - This is the file listed as `main` inside your package.json and simply exports other files.
-   1. `<new-component>.tsx`
-      - This is the file that will actually define your function component, and compose it into a higher order component with slots, theming, and design tokens.
-      - Note that we need the comment `/** @jsx withSlots */` at the top of this file. An explanation can be found in the comment at `packages/experimental/use-slots/src/withSlots.tsx`
+   1. `<new-component>.tsx` - This is the file that will actually define your function component, and compose it into a higher order component with slots, theming, and design tokens. - Note that we need the comment `/** @jsxRuntime classic */
+/** @jsx withSlots */` at the top of this file. An explanation can be found in the comment at `packages/experimental/use-slots/src/withSlots.tsx`
    1. `<new-component>.<types | settings | platform | blah>.tsx` (Optional)
       - Optional extra files to subdivide your code however you see fit. You can also add platform specific files as you see fit.
 
@@ -212,9 +211,9 @@ To add a native module that wraps a FluentUI Android control:
 
    b. Include dependencies for android build environment
 
-   - Edit the generated build.gradle file (Example: packages/experimental/Drawer/android/build.gradle)
+   - Edit the generated build.gradle file
    - Add dependencies for kotlin, maven, react-native, etc
-     - Add dependency for FluentUIAndroid
+   - Add dependency for FluentUIAndroid
 
    c. Add @fluentui-react-native/<new-component> package under "dependencies" and "depcheck"/"ignoreMatches" in apps/fluent-tester/package.json in order for our Fluent Tester app to build and use your new Android component module