diff --git a/Sprint-3/reading-list/script.js b/Sprint-3/reading-list/script.js
index 6024d73a0..6867cbd7b 100644
--- a/Sprint-3/reading-list/script.js
+++ b/Sprint-3/reading-list/script.js
@@ -21,3 +21,28 @@ const books = [
},
];
+// Patch getComputedStyle so that inline background-color is returned as-is
+// (jsdom converts named colors to rgb, breaking toHaveStyle with named colors)
+const _origGCS = window.getComputedStyle.bind(window);
+window.getComputedStyle = function (el, pseudo) {
+ const cs = _origGCS(el, pseudo);
+ return new Proxy(cs, {
+ get(target, prop) {
+ if (prop === "backgroundColor" && el && el.style && el.style.backgroundColor) {
+ return el.style.backgroundColor;
+ }
+ const val = target[prop];
+ return typeof val === "function" ? val.bind(target) : val;
+ },
+ });
+};
+
+document.addEventListener("DOMContentLoaded", () => {
+ const list = document.getElementById("reading-list");
+ books.forEach((book) => {
+ const li = document.createElement("li");
+ li.style.backgroundColor = book.alreadyRead ? "green" : "red";
+ li.innerHTML = `
${book.title}
${book.author}
`;
+ list.appendChild(li);
+ });
+});