1 <!DOCTYPE html>2 <html lang="es">3 <head>4 <meta charset="UTF-8">5 <title>Plataforma de Testing Automatizado de APIs</title>6 <!-- Enlace a Bootstrap CSS -->7 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">8 <!-- Estilos personalizados -->9 <style>10 body {11 background-color: #f8f9fa;12 }13 .card {14 margin-bottom: 20px;15 }16 .strike-through {17 text-decoration: line-through;18 color: #999;19 }20 .add-button {21 margin-top: 10px;22 }23 .navbar-brand img {24 height: 40px;25 }26 </style>27 </head>28 <body>29 30 <!-- Barra de navegación -->31 <nav class="navbar navbar-expand-lg navbar-dark bg-primary mb-4">32 <div class="container-fluid">33 <a class="navbar-brand" href="#">34 <!-- Puedes agregar tu logo aquí -->35 <img src="https://via.placeholder.com/150x40?text=Logo" alt="Logo">36 </a>37 <span class="navbar-text text-white">38 Plataforma de Testing Automatizado de APIs39 </span>40 </div>41 </nav>42 43 <div class="container">44 45 <!-- Variables -->46 <div class="card">47 <div class="card-header">48 <h5>Variables</h5>49 </div>50 <div class="card-body">51 <div class="mb-3 row">52 <label class="col-sm-2 col-form-label">Set var</label>53 <div class="col-sm-4">54 <input type="text" class="form-control" value="user-id" readonly>55 </div>56 <label class="col-sm-1 col-form-label text-center">=</label>57 <div class="col-sm-5">58 <input type="text" class="form-control" value="uuid" readonly>59 </div>60 </div>61 <div class="mb-3 form-check">62 <input type="checkbox" class="form-check-input" id="assertUserId" checked>63 <label class="form-check-label" for="assertUserId">Assert user-id is one of 201, 409</label>64 </div>65 </div>66 </div>67 68 <!-- Request -->69 <div class="card">70 <div class="card-header">71 <h5>REQUEST GET</h5>72 </div>73 <div class="card-body">74 <!-- URL -->75 <div class="mb-3">76 <label class="form-label">URL</label>77 <input type="text" class="form-control" value="http://host/robots.txt">78 </div>79 <!-- Headers -->80 <div class="mb-3">81 <label class="form-label">Headers</label>82 <div class="row g-2">83 <div class="col-md-5">84 <input type="text" class="form-control" value="Authorization" placeholder="Header Key">85 </div>86 <div class="col-md-5">87 <input type="text" class="form-control" placeholder="Header Value">88 </div>89 <div class="col-md-2">90 <button class="btn btn-outline-primary w-100">+</button>91 </div>92 </div>93 </div>94 <!-- Body -->95 <div class="mb-3">96 <label class="form-label">Body</label>97 <textarea class="form-control" rows="5" placeholder="Cuerpo de la solicitud"></textarea>98 </div>99 </div>100 </div>101 102 <!-- Aserción del Cuerpo de la Respuesta -->103 <div class="card">104 <div class="card-header">105 <h5>Aserción</h5>106 </div>107 <div class="card-body">108 <div class="form-check form-switch">109 <input class="form-check-input" type="checkbox" id="assertResponseBody" checked>110 <label class="form-check-label" for="assertResponseBody">Activar Aserción</label>111 </div>112 <div class="mt-3">113 <input type="text" class="form-control" value="response.body.data.status is success">114 </div>115 </div>116 </div>117 118 <!-- Sleep -->119 <div class="card">120 <div class="card-header">121 <h5>Sleep</h5>122 </div>123 <div class="card-body">124 <div class="mb-3 row">125 <label class="col-sm-2 col-form-label">Tiempo</label>126 <div class="col-sm-10">127 <input type="text" class="form-control" value="10s">128 </div>129 </div>130 </div>131 </div>132 133 <!-- Repeat -->134 <div class="card">135 <div class="card-header">136 <h5>Repeat</h5>137 </div>138 <div class="card-body">139 <div class="mb-3 row">140 <label class="col-sm-2 col-form-label">Iterations</label>141 <div class="col-sm-10">142 <input type="number" class="form-control" placeholder="Número de iteraciones">143 </div>144 </div>145 </div>146 </div>147 148 <!-- Call -->149 <div class="card">150 <div class="card-header">151 <h5>Call: Create Payment</h5>152 </div>153 <div class="card-body">154 <div class="mb-3 row">155 <label class="col-sm-3 col-form-label">payment-id</label>156 <div class="col-sm-9">157 <input type="text" class="form-control" value="[uuid]">158 </div>159 </div>160 <div class="mb-3 row">161 <label class="col-sm-3 col-form-label">amount</label>162 <div class="col-sm-9">163 <input type="text" class="form-control" value="[=] >>">164 </div>165 </div>166 <div class="mb-3 row">167 <label class="col-sm-3 col-form-label">IBAN</label>168 <div class="col-sm-9">169 <input type="text" class="form-control" value="my-iban">170 </div>171 </div>172 </div>173 </div>174 175 <!-- Result -->176 <div class="card">177 <div class="card-header bg-success text-white">178 <h5>Resultado</h5>179 </div>180 <div class="card-body">181 <p><strong>STATUS:</strong> ACCEPTED</p>182 <p><strong>SUBMISSION ID posted:</strong> 521-2021-3215-33</p>183 </div>184 </div>185 186 </div>187 188 <!-- Enlace a Bootstrap JS y dependencias -->189 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>190 </body>191 </html>192 Enlace
El enlace para compartir es: