ccccccccc
Momtaj Khatun
- cccccccccccc
- aa
- bbbbbbbbbbbb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Azure DevOps Incident Workflow</title>
<script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
<style>
body{
margin:0;
padding:30px;
background:#f5f7fa;
font-family:Arial,Helvetica,sans-serif;
}
.container{
max-width:1600px;
margin:auto;
background:#fff;
padding:30px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,.15);
}
h1{
text-align:center;
color:#0b5394;
}
</style>
</head>
<body>
<div class="container">
<h1>Azure DevOps Incident Workflow</h1>
<div class="mermaid">
flowchart TD
A["👨💻 Tester Creates Incident<br><br>
• Title<br>
• Description<br>
• Steps to Reproduce<br>
• Acceptance Criteria (Optional)<br>
• Environment<br>
• Attachment<br><br>
State = NEW"]
A --> B["👨💼 Project Manager<br><br>
Validate Issue<br>
Assign Developer<br>
Based on Workload<br><br>
State = ASSIGNED"]
B --> C["👨💻 Developer<br><br>
State = DEV IN PROGRESS<br>
Try to Reproduce Issue"]
C --> D{Issue<br>Reproduced?}
D -- Yes --> E["Fix Issue<br><br>
Add Description<br>
State = FIXED"]
D -- No --> F["Cannot Reproduce<br><br>
State = CANNOT REPRODUCE<br>
Add Investigation Notes"]
E --> G["👨💼 Project Manager<br><br>
Review Fix<br>
Assign Tester<br><br>
State = READY FOR RETEST"]
G --> H["👨💻 Tester<br><br>
Review Discussion<br>
State = TEST IN PROGRESS<br>
Validate Fix"]
H --> I{Issue Fixed?}
I -- Yes --> J["Tester Adds Comments<br><br>
State = CLOSED"]
I -- No --> K["Tester Adds<br>
Description + Attachment<br><br>
State = NEW"]
K --> B
style A fill:#d9ead3,stroke:#38761d,stroke-width:2px
style B fill:#fff2cc,stroke:#bf9000,stroke-width:2px
style C fill:#cfe2f3,stroke:#0b5394,stroke-width:2px
style D fill:#ead1dc,stroke:#741b47,stroke-width:2px
style E fill:#d9ead3,stroke:#38761d,stroke-width:2px
style F fill:#f4cccc,stroke:#990000,stroke-width:2px
style G fill:#fff2cc,stroke:#bf9000,stroke-width:2px
style H fill:#cfe2f3,stroke:#0b5394,stroke-width:2px
style I fill:#ead1dc,stroke:#741b47,stroke-width:2px
style J fill:#b6d7a8,stroke:#38761d,stroke-width:3px
style K fill:#f4cccc,stroke:#990000,stroke-width:3px
</div>
<h2>State Flow</h2>
<div class="mermaid">
flowchart LR
N[NEW]
-->A1[ASSIGNED]
-->A2[DEV IN PROGRESS]
-->A3[FIXED]
-->A4[READY FOR RETEST]
-->A5[TEST IN PROGRESS]
-->A6[CLOSED]
A5 -- Failed --> N
</div>
</div>
<script>
mermaid.initialize({
startOnLoad:true,
theme:"default",
flowchart:{
curve:"basis"
}
});
</script>
</body>
</html>
cccccc
aaaaaaaaa
bbbbbbbbbbbb