diff --git a/ui/src/components/transaction/transaction-item.css.ts b/ui/src/components/transaction/transaction-item.css.ts
index b41cc2e..f1b2184 100644
--- a/ui/src/components/transaction/transaction-item.css.ts
+++ b/ui/src/components/transaction/transaction-item.css.ts
@@ -55,7 +55,7 @@ export default css`
}
.invalid {
- color: var(--warn-color);
+ color: var(--error-color);
font-size: 25px;
margin-top: 2px;
margin-right: 12px;
@@ -67,7 +67,16 @@ export default css`
margin-top: 2px;
margin-right: 12px;
}
-
+
+ .failed {
+ color: var(--dark-font-color);
+ font-size: 25px;
+ margin-top: 2px;
+ margin-right: 12px;
+ }
+
+
+
.delay {
text-align: right;
min-width: 60px;
diff --git a/ui/src/components/transaction/transaction-item.ts b/ui/src/components/transaction/transaction-item.ts
index 67bf296..3a0dce9 100644
--- a/ui/src/components/transaction/transaction-item.ts
+++ b/ui/src/components/transaction/transaction-item.ts
@@ -93,7 +93,13 @@ export class HttpTransactionItemComponent extends LitElement {
this._httpTransaction.responseValidation?.length > 0) {
statusIcon = html``
} else {
- statusIcon = html``
+
+ if (this._httpTransaction.httpResponse?.statusCode >= 400) {
+ statusIcon = html``
+ } else {
+ statusIcon = html``
+ }
+
}
}
}
diff --git a/ui/src/components/transaction/transaction-view.css.ts b/ui/src/components/transaction/transaction-view.css.ts
index 24d0739..cf2b9e4 100644
--- a/ui/src/components/transaction/transaction-view.css.ts
+++ b/ui/src/components/transaction/transaction-view.css.ts
@@ -43,6 +43,7 @@ export default css`
.violation-badge::part(base) {
font-size: 0.5rem;
margin-left: 5px;
+ --sl-color-danger-600: var(--error-color);
}
h2 {
diff --git a/ui/src/components/transaction/transaction-view.ts b/ui/src/components/transaction/transaction-view.ts
index 2ec28ff..49f05ab 100644
--- a/ui/src/components/transaction/transaction-view.ts
+++ b/ui/src/components/transaction/transaction-view.ts
@@ -166,7 +166,7 @@ export class HttpTransactionViewComponent extends LitElement {
total += this._httpTransaction.responseValidation.length;
}
violations = html`Violations
- ${total}`;
+ ${total}`;
}
const noData: TemplateResult = html`
@@ -215,7 +215,10 @@ export class HttpTransactionViewComponent extends LitElement {
${violations}
Request
- Response
+ Response ${(resp?.statusCode>=400) ? html`
+
+
+ ` : null}
${this._currentLinks?.length > 0 ? html`
Chain` : null}
@@ -259,7 +262,9 @@ export class HttpTransactionViewComponent extends LitElement {
Body
- Code
+
+ Code ${(resp?.statusCode>=400) ? html`
+ ${resp.statusCode}` : null}
Headers
Cookies
diff --git a/ui/src/components/violation/violation.css.ts b/ui/src/components/violation/violation.css.ts
index 420d23f..302f8ee 100644
--- a/ui/src/components/violation/violation.css.ts
+++ b/ui/src/components/violation/violation.css.ts
@@ -2,7 +2,7 @@ import {css} from "lit";
export default css`
.error-icon {
- color: var(--warn-color);
+ color: var(--error-color);
font-size: 1.5em;
vertical-align: bottom;
}