https://github.com/bakkappan/playwrightazuredevopspipeline
Playwright with Azure Devops Pipeline
https://github.com/bakkappan/playwrightazuredevopspipeline
allure-report open-source-tool playwright playwright-api-testing playwright-automation playwright-automation-testing playwright-azure-devops playwright-azure-pipeline playwright-codegen playwright-demo playwright-github playwright-javascript playwright-report playwright-test-runner playwright-testing playwright-tests playwright-tutorial playwright-typescript test-automation-framework testers-talk
Last synced: 5 months ago
JSON representation
Playwright with Azure Devops Pipeline
- Host: GitHub
- URL: https://github.com/bakkappan/playwrightazuredevopspipeline
- Owner: BakkappaN
- Created: 2024-01-20T16:12:05.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-01-30T04:40:07.000Z (over 1 year ago)
- Last Synced: 2024-11-14T13:12:29.152Z (7 months ago)
- Topics: allure-report, open-source-tool, playwright, playwright-api-testing, playwright-automation, playwright-automation-testing, playwright-azure-devops, playwright-azure-pipeline, playwright-codegen, playwright-demo, playwright-github, playwright-javascript, playwright-report, playwright-test-runner, playwright-testing, playwright-tests, playwright-tutorial, playwright-typescript, test-automation-framework, testers-talk
- Language: JavaScript
- Homepage:
- Size: 16.6 KB
- Stars: 7
- Watchers: 1
- Forks: 6
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Integrate Playwright with Azure Devops Pipeline
There are 2 options, option1 is using yaml file & option2 is without using yaml file. let's see one by one
1. Option1 - Using YAML File
- Step1: Create a new project in ADO then Click on Project
- Step2: Click on Repos & Let's create new repository, Click on New reposiotry
- Step3: Enter Repository name & Click on Create
- Step4: Click on Clone button and get the URL. Go to your system then clone repository.
- Step5: Add all the playwright framework folders inside cloned repository
- Step6: Push all the folders into Azure devops
- Step7: Repository is ready now, let's create pipeline. Click on Pipelines->Create Pipeline
- 
- Step8: Click on Azure Repos Git
- Step9: Select previously created repository
- Step10: Select Starter Pipeline
- Step11: Copy below yaml content and paste it inside azure-pipelines.yml file.
```
trigger:
- main
pool:
vmImage: ubuntu-latest
steps:
- task: NodeTool@0
inputs:
versionSpec: '18'
displayName: 'Install Node.js'
- script: npm ci
displayName: 'npm ci'
- script: npx playwright install --with-deps
displayName: 'Install Playwright browsers'
- script: npx playwright test
displayName: 'Run Playwright tests'
env:
CI: 'true'
```
If you are running in self hosted agent replace pool commands
```
pool:
name: AgentPoolName
demands:
- agent.name -equals AgentName
```
- Step12: Click on Save and run
- Step13: You will see job queued like this.
- 
- Step14: Click on Job & Verify build status.
- Step15: Now let's Upload playwright-report folder with Azure Pipelines & Report generation
Firstly update azure-pipelines.yml file
```
trigger:
- main
pool:
vmImage: ubuntu-latest
steps:
- task: NodeTool@0
inputs:
versionSpec: '18'
displayName: 'Install Node.js'
- script: npm ci
displayName: 'npm ci'
- script: npx playwright install --with-deps
displayName: 'Install Playwright browsers'
- script: npx playwright test
displayName: 'Run Playwright tests'
env:
CI: 'true'
- task: PublishTestResults@2
displayName: 'Publish test results'
inputs:
searchFolder: 'test-results'
testResultsFormat: 'JUnit'
testResultsFiles: 'e2e-junit-results.xml'
mergeTestResults: true
failTaskOnFailedTests: true
testRunTitle: 'My End-To-End Tests'
condition: succeededOrFailed()
- task: PublishPipelineArtifact@1
inputs:
targetPath: playwright-report
artifact: playwright-report
publishLocation: 'pipeline'
condition: succeededOrFailed()
```
- Step16: Verify playwright-report folder attachment & report.
From job we can navigate into artifacts folder. Download playwright report and verify results.
2. Option2 - Without using YAML File
- Step1: Repeat step 1 to 6 above from Option1
- Step2: Click on Pipelines then click on New Pipeline
- Step3: Click on Use the classic editor & Click on Continue
- Step4: Click on Emtpy job
- Step5: Click on + icon, Search for Node and add Node.js tool installer
- Step6: Select just now added task and add Node v16 becuase playwright supports for Node v14 and above
- 
- Step7: Click on + icon, Similary add Command line task,
Display name: Install Playwright & Dependencies
Script: npm install && npx playwright install
Click on Advanced-> Click on little icon(i) & select the Link. This will enable working directory for the task.
- Step8: Add another task by clicking on + icon, search for npm & Add npm
Enter Display name, Select Command as custom & Enter Command and Arguments as run tests
In this task we are referring to the package.json file.
- Step9: Once everthing is completed now it is a time run script. Click on Save & queue.
Add commit message then click save & run.
- Step10: It looks like this
Click on Job and you will see a screen like this
- Step11: We can also upload playwright-report using Publish Pipeline Artifacts task
- Step12: Let's Publish Test Results using Publish Test Results task
- Let's run the pipeline
- Artifacts are published & also we have published test results
