feat (CI): Enable VR Tool to run react-northstar tests for PRs

.devops/templates/runpublishvrscreenshot.yml

@@ -11,6 +11,9 @@ parameters:
   - name: shouldBuildstorybookaddon
     type: boolean
     default: false
+  - name: shouldBuildNorthstar
+    type: boolean
+    default: false
 
 steps:
   - task: Bash@3
@@ -39,14 +42,20 @@ steps:
   - script: |
       yarn workspace ${{ parameters.vrTestPackageName }} convert
     displayName: Convert screener component to storywright
-    condition: eq(variables['vrTestSkip'], 'no')
+    condition: and(eq(variables['vrTestSkip'], 'no'), eq('${{ parameters.shouldBuildNorthstar }}', 'false'))
 
   - ${{ if eq(parameters.shouldBuildstorybookaddon, 'true') }}:
       - script: |
           yarn build --to @fluentui/react-storybook-addon
         displayName: Build react-storybook-addon
         condition: eq(variables['vrTestSkip'], 'no')
 
+  - ${{ if eq(parameters.shouldBuildNorthstar, 'true') }}:
+      - script: |
+          yarn build --to @fluentui/docs
+        displayName: Build react-northstar
+        condition: eq(variables['vrTestSkip'], 'no')
+
   - script: |
       yarn workspace ${{ parameters.vrTestPackageName }} screener:build
     displayName: Build VR tests components package

azure-pipelines.vrt-pr.yml

@@ -179,3 +179,84 @@ jobs:
           VR_APPROVAL_HOST: $(VR_APPROVAL_HOST)
           VR_APP_NAME: $(VR_APP_NAME)
         condition: eq(variables['vrTestSkip'], 'no')
+
+  - job: VisualRegressionTest_V0
+    variables:
+      pipelineId: '313'
+      pipelineName: 'fluent-ui VRT Pipeline v0'
+
+    workspace:
+      clean: all
+    steps:
+      - checkout: self
+        fetchDepth: 0
+
+      - template: .devops/templates/tools.yml
+
+      - bash: |
+          postPolicy="true";
+          response=$(curl --request POST 'https://login.microsoftonline.com/72f988bf-86f1-41af-91ab-2d7cd011db47/oauth2/token' --header 'Content-Type: application/x-www-form-urlencoded' --data-urlencode 'grant_type=client_credentials' --data-urlencode 'client_id=288a69b6-760d-4c1f-ad6d-0183b5e5740f' --data-urlencode 'client_secret='${VR_APPROVAL_CLIENT_SECRET} )
+            parsedResponse=${response/*"access_token"/}
+            token=${parsedResponse:3:${#parsedResponse}-5}
+            curl --location --request POST 'https://vrt-fluentapp.azurewebsites.net/api/policyState' \
+            --header 'Authorization: Bearer '"$token" \
+            --header 'Content-Type: application/json' \
+            --data-raw '	{
+            "organization": "uifabric",
+            "projectName": "fabricpublic",
+            "prId": $(System.PullRequest.PullRequestNumber),
+            "commitId": "$(Build.SourceVersion)",
+              "generate":true,
+              "blockingPipeline":{
+              },
+              "nonBlockingPipeline":{
+                "$(pipelineId)": {
+                  "pipelineStatus": "PENDING",
+                  "pipelineName": "$(pipelineName)"
+                }
+              },
+              "postPolicy": '${postPolicy}',
+              "policyType": "OPTIONAL"
+            }'
+        displayName: 'Call policy State Api'
+        env:
+          VR_APPROVAL_CLIENT_SECRET: $(VR-APPROVAL-CLIENT-SECRET)
+      - template: .devops/templates/runpublishvrscreenshot.yml
+        parameters:
+          fluentVersion: v0
+          vrTestPackageName: '@fluentui/docs'
+          vrTestPackagePath: 'packages/fluentui/docs'
+          shouldBuildstorybookaddon: false
+          shouldBuildNorthstar: true
+
+      - powershell: |
+          $url = "https://dev.azure.com/uifabric/fabricpublic/_apis/build/builds?definitions=$env:BASELINE_PIPELINE_ID&statusFilter=completed&resultFilter=succeeded&queryOrder=finishTimeDescending&`$top=1"
+          Write-Host "Looking up latest official build via url: $url"
+          $pipelineBuildInfo = Invoke-RestMethod -Uri $url -Headers @{Authorization = "Bearer $env:SYSTEM_ACCESSTOKEN"}
+          Write-Host "Response: $pipelineBuildInfo"
+          [int]$latestBuildId = $pipelineBuildInfo.value.id
+          Write-Host "Setting variable LatestBuildId=$latestBuildId"
+          Write-Host "##vso[task.setvariable variable=LatestBuildId]$latestBuildId"
+        name: GetLatestGreenCIBuild
+        env:
+          SYSTEM_ACCESSTOKEN: $(System.AccessToken)
+          BASELINE_PIPELINE_ID: $(BASELINE-PIPELINE-ID)
+        condition: eq(variables['vrTestSkip'], 'no')
+      - bash: node node_modules/vrscreenshotdiff/lib/index.js pr --clientType "FluentUI-v0" --buildId $(Build.BuildId) --lkgCIBuild $(LatestBuildId) --pipelineId $(pipelineId) --pipelineName '$(pipelineName)'
+        displayName: 'Run fluentui-screenshotdiff'
+        env:
+          API_URL: $(System.CollectionUri)
+          API_TOKEN: $(fabric-public-pipeline-access-PAT)
+          API_REPOSITORY: $(Build.Repository.Name)
+          API_PROJECT: $(System.TeamProject)
+          SCREENSHOT_ARTIFACT_FOLDER: vrscreenshotv0
+          GITHUB_API_TOKEN: $(githubRepoStatusPAT)
+          STORAGE_ACCOUNT_FLUENTUI: $(STORAGE-ACCOUNT-FLUENTUI)
+          STORAGE_KEY_FLUENTUI: $(STORAGE-KEY-BLOB-FLUENTUI)
+          BLOB_CONNECTION_STRING: $(BLOB-CONNECTION-STRING)
+          VR_APPROVAL_CLIENT_SECRET: $(VR-APPROVAL-CLIENT-SECRET)
+          GITHUB_REPO_OWNER: 'microsoft'
+          GITHUB_REPO_NAME: 'fluentui'
+          VR_APPROVAL_HOST: $(VR_APPROVAL_HOST)
+          VR_APP_NAME: $(VR_APP_NAME)
+        condition: eq(variables['vrTestSkip'], 'no')