diff --git a/__snapshots__/dozzle.snapshot b/__snapshots__/dozzle.snapshot
index 52701f79..777f2630 100644
--- a/__snapshots__/dozzle.snapshot
+++ b/__snapshots__/dozzle.snapshot
@@ -66,7 +66,7 @@ event: containers-changed
data: start
/* snapshot: Test_handler_streamLogs_error_finding_container */
-HTTP/1.1 500 Internal Server Error
+HTTP/1.1 404 Not Found
Connection: close
Content-Type: text/plain; charset=utf-8
X-Content-Type-Options: nosniff
diff --git a/assets/components/LogEventSource.spec.js b/assets/components/LogEventSource.spec.js
index c0ee97f6..701e07fd 100644
--- a/assets/components/LogEventSource.spec.js
+++ b/assets/components/LogEventSource.spec.js
@@ -134,7 +134,7 @@ describe("", () => {
await wrapper.vm.$nextTick();
expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
- - today at 10:55 AM "This is a message."
+ - today at 10:55 AM "This is a message."
`);
});
@@ -149,7 +149,7 @@ describe("", () => {
await wrapper.vm.$nextTick();
expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
- - today at 10:55 AM blackwhite
+ - today at 10:55 AM blackwhite
`);
});
@@ -164,7 +164,7 @@ describe("", () => {
await wrapper.vm.$nextTick();
expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
- - today at 10:55 AM <test>foo bar</test>
+ - today at 10:55 AM <test>foo bar</test>
`);
});
@@ -182,7 +182,7 @@ describe("", () => {
await wrapper.vm.$nextTick();
expect(wrapper.find("ul.events")).toMatchInlineSnapshot(`
- - today at 10:55 AM This is a test <hi></hi>
+ - today at 10:55 AM This is a test <hi></hi>
`);
});
diff --git a/assets/components/LogEventSource.vue b/assets/components/LogEventSource.vue
index cb13bc89..b9d2be4d 100644
--- a/assets/components/LogEventSource.vue
+++ b/assets/components/LogEventSource.vue
@@ -35,19 +35,23 @@ export default {
this.es = null;
}
this.es = new EventSource(`${config.base}/api/logs/stream?id=${this.id}`);
- const flushBuffer = debounce(
- () => {
- this.messages.push(...this.buffer);
- this.buffer = [];
- },
- 250,
- { maxWait: 1000 }
- );
+
+ this.es.addEventListener("container-stopped", (e) => {
+ this.es.close();
+ this.buffer.push({ event: "container-stopped", message: "Container stopped", date: new Date() });
+ flushNow();
+ });
+ this.es.addEventListener("error", (e) => console.log("EventSource failed: " + JSON.stringify(e)));
+
+ const flushBuffer = debounce(() => flushNow(), 250, { maxWait: 1000 });
+ const flushNow = () => {
+ this.messages.push(...this.buffer);
+ this.buffer = [];
+ };
this.es.onmessage = (e) => {
this.buffer.push(this.parseMessage(e.data));
flushBuffer();
};
- this.es.onerror = (e) => console.log("EventSource failed." + e);
this.$once("hook:beforeDestroy", () => this.es.close());
},
async loadOlderLogs() {
diff --git a/assets/components/LogViewer.vue b/assets/components/LogViewer.vue
index 5d4e0ded..d4e4ca5a 100644
--- a/assets/components/LogViewer.vue
+++ b/assets/components/LogViewer.vue
@@ -1,6 +1,6 @@
- -
+
-
{{ item.date | relativeTime }}
@@ -103,6 +103,10 @@ export default {
white-space: pre-wrap;
}
+li.event {
+ color: #f14668;
+}
+
::v-deep mark {
border-radius: 2px;
background-color: #ffdd57;
diff --git a/assets/components/MobileMenu.vue b/assets/components/MobileMenu.vue
index 6beef379..2a847357 100644
--- a/assets/components/MobileMenu.vue
+++ b/assets/components/MobileMenu.vue
@@ -27,7 +27,7 @@