onnxruntime/tools/ci_build/github/azure-pipelines/templates/win-web-ci.yml

parameters:
- name: CommitOverride
  type: boolean
  default: false

- name: BuildConfig
  type: string
  default: 'Debug'

- name: NpmPackagingMode
  type: string
  default: 'dev'

- name: PoolName
  type: string
  default: 'onnxruntime-Win-CPU-2022'

- name: PackageName
  displayName: 'Package name'
  type: string
  default: 'NPM_packages'

- name: RunWebGpuTests
  type: boolean
  default: false

jobs:
- job: build_onnxruntime_web
  pool: ${{ parameters.PoolName }}

  variables:
    webgpuCommandlineExtraFlags: '--chromium-flags=--ignore-gpu-blocklist --chromium-flags=--gpu-vendor-id=0x10de'
    runCodesignValidationInjection: false
    CHROME_BIN: 'C:\Program Files\Google\Chrome\Application\chrome.exe'
  timeoutInMinutes: 60
  workspace:
    clean: all
  steps:
  - task: mspremier.PostBuildCleanup.PostBuildCleanup-task.PostBuildCleanup@3
    displayName: 'Clean Agent Directories'
    condition: always()
  - checkout: self
    submodules: false
  - task: DownloadPipelineArtifact@2
    inputs:
      artifact: '__commit'
      path: $(Pipeline.Workspace)
    displayName: 'Get commit SHA'
    condition: eq('${{ parameters.CommitOverride }}', 'true')
  - script: |
     set /p __commit__=<$(Pipeline.Workspace)\__commit.txt
     git fetch origin +%__commit__%:refs/remotes/origin/%__commit__%
     git checkout --force %__commit__%     
    workingDirectory: '$(Build.SourcesDirectory)'
    displayName: 'Read commit SHA and checkout'
    condition: eq('${{ parameters.CommitOverride }}', 'true')
  - script: |
     echo.$(Build.SourceVersion)>$(Pipeline.Workspace)\__commit.txt     
    workingDirectory: '$(Build.SourcesDirectory)'
    displayName: 'Write commit SHA to __commit.txt'
    condition: ne('${{ parameters.CommitOverride }}', 'true')
  - script: |
     git submodule sync -- cmake\external\onnx
     git submodule update --init -- cmake\external\onnx     
    workingDirectory: '$(Build.SourcesDirectory)'
    displayName: 'Checkout submodule onnx'
  - script: |
     echo.>>.gitattributes
     echo /js/** text=auto eol=lf>>.gitattributes
     rd /s /q js
     git checkout -- js/**
     git checkout -- .gitattributes     
    workingDirectory: '$(Build.SourcesDirectory)'
    displayName: 'Testing: force EOL to lf on windows for /js/**'
  - task: NodeTool@0
    inputs:
      versionSpec: '18.x'
  - task: DownloadPipelineArtifact@2
    inputs:
      patterns: '${{ parameters.BuildConfig }}_*/**/*'
      path: $(Pipeline.Workspace)\artifacts
    displayName: 'Download WebAssembly artifacts'
  - task: CopyFiles@2
    inputs:
      sourceFolder: $(Pipeline.Workspace)\artifacts
      contents: |
        **\*.*        
      targetFolder: $(Build.SourcesDirectory)\js\web\dist
      flattenFolders: true
    displayName: 'Binplace dist files'
  - script: |
     npm ci     
    workingDirectory: '$(Build.SourcesDirectory)\js'
    displayName: 'npm ci /js/'
  - script: |
     npm ci     
    workingDirectory: '$(Build.SourcesDirectory)\js\common'
    displayName: 'npm ci /js/common/'
  - script: |
     npm test     
    workingDirectory: '$(Build.SourcesDirectory)\js\common'
    displayName: 'run onnxruntime-common tests'
  - script: |
     npm ci     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'npm ci /js/web/'
  - script: |
     npm run prebuild     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'run TypeScript type check in /js/web/'
  - script: |
     npm run lint     
    workingDirectory: '$(Build.SourcesDirectory)\js'
    displayName: 'run ESLint'
  - script: |
     npm run format     
    workingDirectory: '$(Build.SourcesDirectory)\js'
    displayName: 'Clang-format'
  - script: |
     node -e "a=require('child_process').execSync('git diff --name-only').toString();if(a)throw new Error('Following source files are not formatted: (did you run \"npm run format\"?)\n'+a)"     
    workingDirectory: '$(Build.SourcesDirectory)\js'
    displayName: 'Check unformatted files'
  - script: |
     npm run build:doc     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Generating documents'
  - script: |
     node -e "a=require('child_process').execSync('git diff --name-only').toString();if(a)throw new Error('Following documents are not up-to-date: (did you run \"npm run build:doc\"?)\n'+a)"     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Check out of dated documents'
  - task: Cache@2
    inputs:
      key: onnxtestdata | $(Build.SourcesDirectory)\js\scripts\prepare-onnx-node-tests.ts
      restoreKeys: |
        onnxtestdata | $(Build.SourcesDirectory)\js\scripts\prepare-onnx-node-tests.ts        
      path: $(Build.SourcesDirectory)/js/test/
      cacheHitVar: CACHE_RESTORED
    displayName: 'Cache ONNX node test data'

  - task: PowerShell@2
    inputs:
      filePath: '$(Build.SourcesDirectory)\tools\ci_build\github\js\pack-npm-packages.ps1'
      arguments: '$(NpmPackagingMode) $(Build.SourcesDirectory) web'
      workingDirectory: $(Build.BinariesDirectory)
      errorActionPreference: stop
    displayName: 'Pack NPM packages'
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\01
     dir $(Agent.TempDirectory)\web\test\01
     npm test -- -e=chrome -b=webgl,wasm --user-data-dir=$(Agent.TempDirectory)\web\test\01 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests (wasm,webgl backend)'
    condition: and(succeeded(), eq('${{ parameters.RunWebGpuTests }}', 'false'))
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\02
     dir $(Agent.TempDirectory)\web\test\02
     npm test -- -e=chrome -b=webgl,wasm,webgpu $(webgpuCommandlineExtraFlags) --user-data-dir=$(Agent.TempDirectory)\web\test\02 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests (ALL backends)'
    condition: and(succeeded(), eq('${{ parameters.RunWebGpuTests }}', 'true'))
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\03
     dir $(Agent.TempDirectory)\web\test\03
     npm test -- suite1 -e=chrome -b=webgpu --io-binding=gpu-tensor $(webgpuCommandlineExtraFlags) --user-data-dir=$(Agent.TempDirectory)\web\test\03 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests (Suite1, webgpu, IO-binding=gpu-tensor)'
    condition: and(succeeded(), eq('${{ parameters.RunWebGpuTests }}', 'true'))
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\04
     dir $(Agent.TempDirectory)\web\test\04
     npm test -- suite1 -e=chrome -b=webgpu --io-binding=gpu-location $(webgpuCommandlineExtraFlags) --user-data-dir=$(Agent.TempDirectory)\web\test\04 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests (Suite1, webgpu, IO-binding=gpu-location)'
    condition: and(succeeded(), eq('${{ parameters.RunWebGpuTests }}', 'true'))
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\05
     dir $(Agent.TempDirectory)\web\test\05
     npm test -- --webgl.pack -b=webgl -e=chrome --user-data-dir=$(Agent.TempDirectory)\web\test\05 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests - WebGL: packed mode'
  - script: |
     powershell "Get-WmiObject Win32_Process -Filter \"name = 'chrome.exe'\" | Format-List CommandLine"     
    displayName: 'Check active Chrome processes (before test)'
    condition: and(succeeded(), eq(variables['Agent.Diagnostic'], 'true'))
  - script: |
     mkdir $(Agent.TempDirectory)\web\test\06
     dir $(Agent.TempDirectory)\web\test\06
     npm test -- --wasm.proxy -b=wasm -e=chrome --user-data-dir=$(Agent.TempDirectory)\web\test\06 --chromium-flags=--enable-logging --chromium-flags=--v=1     
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'Run ort-web tests - WebAssembly: proxy'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - script: |
      npm run test:e2e -- --browser=Chrome_default      
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'E2E package consuming test'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - script: |
      npm run test:training:e2e      
    workingDirectory: '$(Build.SourcesDirectory)\js\web'
    displayName: 'E2E training package test'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - task: CopyFiles@2
    inputs:
      sourceFolder: $(Build.SourcesDirectory)\js\common
      contents: onnxruntime-common-*.tgz
      targetFolder: $(Build.ArtifactStagingDirectory)
    displayName: 'Create Artifacts (onnxruntime-common)'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - task: CopyFiles@2
    inputs:
      sourceFolder: $(Build.SourcesDirectory)\js\web
      contents: onnxruntime-web-*.tgz
      targetFolder: $(Build.ArtifactStagingDirectory)
    displayName: 'Create Artifacts (onnxruntime-web)'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - task: PublishPipelineArtifact@0
    inputs:
      artifactName: '${{ parameters.PackageName }}'
      targetPath: '$(Build.ArtifactStagingDirectory)'
    displayName: 'Publish Pipeline Artifact'
    condition: and(succeeded(), eq('${{ parameters.BuildConfig }}', 'Release'))
  - script: |
      if exist 01 (echo ------------------- BEGIN 01 -------------------&&type 01\chrome_debug.log&&echo ------------------- END 01 ------------------- )
      if exist 02 (echo ------------------- BEGIN 02 -------------------&&type 02\chrome_debug.log&&echo ------------------- END 02 ------------------- )
      if exist 03 (echo ------------------- BEGIN 03 -------------------&&type 03\chrome_debug.log&&echo ------------------- END 03 ------------------- )
      if exist 04 (echo ------------------- BEGIN 04 -------------------&&type 04\chrome_debug.log&&echo ------------------- END 04 ------------------- )
      if exist 05 (echo ------------------- BEGIN 05 -------------------&&type 05\chrome_debug.log&&echo ------------------- END 05 ------------------- )
      if exist 06 (echo ------------------- BEGIN 06 -------------------&&type 06\chrome_debug.log&&echo ------------------- END 06 ------------------- )      
    displayName: 'Log Chrome processes (after test)'
    workingDirectory: '$(Agent.TempDirectory)\web\test'
    condition: always()
  - template: component-governance-component-detection-steps.yml
    parameters :
      condition : 'succeeded'