From 8c9ed1cf1b04916c7e022ee8b893a7c95def3661 Mon Sep 17 00:00:00 2001 From: Thuan Hai Cong Ho Date: Mon, 27 Oct 2025 13:18:08 +0700 Subject: [PATCH 1/2] fix: wrong time display at 12 am/pm --- src/Clock.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Clock.vue b/src/Clock.vue index 8f612f1..2206a92 100644 --- a/src/Clock.vue +++ b/src/Clock.vue @@ -40,13 +40,13 @@ const getMinutes = () => padZero(getDate().getMinutes()); const getHour = twelveHour => { let hours = getDate().getHours(); - if (twelveHour && hours > 12) { - hours = hours - 12; + if (twelveHour) { + hours = hours % 12 || 12; } return padZero(hours); }; -const getAmPm = () => (getDate().getHours() > 12 ? "pm" : "am"); +const getAmPm = () => (getDate().getHours() >= 12 ? "pm" : "am"); export default { name: "vue-digital-clock", From 49e1c608d4f61a2974f2edd83745749270a37983 Mon Sep 17 00:00:00 2001 From: Thuan Hai Cong Ho Date: Mon, 27 Oct 2025 13:19:26 +0700 Subject: [PATCH 2/2] test: add tests for 12am/pm --- src/Clock.spec.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/Clock.spec.js b/src/Clock.spec.js index dfef04b..fa85bf4 100644 --- a/src/Clock.spec.js +++ b/src/Clock.spec.js @@ -159,4 +159,18 @@ describe("Clock.vue", () => { expect(wrapper.find(".clock__hour")[0].text()).toContain("09"); expect(wrapper.find(".clock__ampm")[0].text()).toContain("pm"); }); + + it("displays 12pm (noon/midday) in twelveHour mode", () => { + clock.tick(12 * hours); + const wrapper = mount(Clock, { propsData: { twelveHour: true } }); + expect(wrapper.find(".clock__hour")[0].text()).toContain("12"); + expect(wrapper.find(".clock__ampm")[0].text()).toContain("pm"); + }); + + it("displays 12am (midnight) in twelveHour mode", () => { + clock.tick(0 * hours); + const wrapper = mount(Clock, { propsData: { twelveHour: true } }); + expect(wrapper.find(".clock__hour")[0].text()).toContain("12"); + expect(wrapper.find(".clock__ampm")[0].text()).toContain("am"); + }); });