Fix thumbnail scaling heights

tests/followed-dropdown-css.test.js

@@ -86,39 +86,44 @@ assert.match(
 );
 assert.match(
   capturedCss,
-  /data-tm-thumb-scale-following-list="1"[\s\S]*--tm-thumb-following-list-width/,
+  /data-tm-thumb-scale-following-list="1"[\s\S]*--tm-thumb-following-list-columns/,
-  "followed-cams list should be separated from homepage list sizing",
+  "followed-cams list should be separated from homepage list column count",
 );
 assert.match(
   capturedCss,
-  /data-tm-thumb-scale-following-list="1"[\s\S]*grid-template-columns:\s*repeat\(auto-fill,\s*minmax\(var\(--tm-thumb-following-list-width\),\s*1fr\)\)\s*!important/,
+  /data-tm-thumb-scale-following-list="1"[\s\S]*grid-template-columns:\s*repeat\(var\(--tm-thumb-following-list-columns\),\s*minmax\(0,\s*1fr\)\)\s*!important/,
-  "followed-cams list should keep the site's stretching grid alignment while using detected minimum width",
+  "followed-cams list should reduce the original column count and keep 1fr alignment",
 );
 assert.match(
   capturedCss,
-  /#main\.roomPage\s+ul\.list:has\(li\.roomCard\)\s+\.room_thumbnail_container[\s\S]*width:\s*var\(--tm-thumb-related-thumb-width\)\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
+  /#main\.roomPage\s+ul\.list:has\(li\.roomCard\)\s+\.room_thumbnail_container[\s\S]*width:\s*100%\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
-  "room page related rooms thumbnail containers should use detected thumb width and height",
+  "room page related rooms thumbnail containers should follow card width and use detected height",
 );
 assert.match(
   capturedCss,
-  /\.BaseRoomContents\s+ul\.list:has\(li\.roomCard\)\s+\.room_thumbnail[\s\S]*width:\s*var\(--tm-thumb-related-thumb-width\)\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
+  /\.BaseRoomContents\s+ul\.list:has\(li\.roomCard\)\s+\.room_thumbnail[\s\S]*width:\s*100%\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
-  "base room related thumbnails should use detected thumb width and height",
+  "base room related thumbnails should follow card width and use detected height",
 );
 assert.match(
   capturedCss,
-  /\.BaseRoomContents\s+ul\.RoomCardGrid[\s\S]*grid-template-columns:\s*repeat\(auto-fill,\s*minmax\(var\(--tm-thumb-related-width\),\s*1fr\)\)\s*!important/,
+  /\.BaseRoomContents\s+ul\.RoomCardGrid[\s\S]*grid-template-columns:\s*repeat\(auto-fill,\s*var\(--tm-thumb-related-width\)\)\s*!important/,
-  "base room RoomCardGrid related rooms should use detected width",
+  "base room RoomCardGrid related rooms should use detected card width",
 );
 assert.match(
   capturedCss,
-  /\.BaseRoomContents\s+ul\.RoomCardGrid\s+\.RoomCardThumbnail[\s\S]*width:\s*var\(--tm-thumb-related-thumb-width\)\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
+  /\.BaseRoomContents\s+ul\.RoomCardGrid\s+\.RoomCardThumbnail[\s\S]*width:\s*100%\s*!important[\s\S]*height:\s*var\(--tm-thumb-related-height\)\s*!important/,
-  "base room RoomCardGrid thumbnails should use detected thumb width and height",
+  "base room RoomCardGrid thumbnails should follow card width and use detected height",
 );
 assert.match(
   capturedCss,
   /\.BaseRoomContents\s+ul\.RoomCardGrid\s*>\s*li\.RoomCard[\s\S]*height:\s*var\(--tm-thumb-related-card-height\)\s*!important/,
   "base room RoomCardGrid related cards should use detected card height",
 );
+assert.match(
+  capturedCss,
+  /\.BaseRoomContents\s+ul\.RoomCardGrid\s*>\s*li\.RoomCard[\s\S]*width:\s*var\(--tm-thumb-related-width\)\s*!important/,
+  "base room RoomCardGrid related cards should use detected card width",
+);
 assert.doesNotMatch(capturedCss, /--tm-thumb-min-root:\s*\d+px;/, "script should not hard-code a root thumbnail fallback width");
 assert.doesNotMatch(capturedCss, /--tm-thumb-height-root:\s*\d+px;/, "script should not hard-code a root thumbnail fallback height");
 assert.match(
@@ -153,8 +158,8 @@ assert.match(
 );
 assert.match(
   capturedCss,
-  /\.FollowedDropdown__room-image[\s\S]*width:\s*var\(--tm-thumb-follow-thumb-width\)\s*!important[\s\S]*height:\s*var\(--tm-thumb-follow-thumb-height\)\s*!important/,
+  /\.FollowedDropdown__room-image[\s\S]*width:\s*100%\s*!important[\s\S]*height:\s*var\(--tm-thumb-follow-thumb-height\)\s*!important/,
-  "follow dropdown images should use detected original thumb width and height",
+  "follow dropdown images should follow fixed card width and use detected height",
 );
 assert.match(
   capturedCss,
@@ -169,11 +174,10 @@ assert.match(
 assert.doesNotMatch(source, /withOwnStyleDisabled/, "script should not disable its own style while measuring");
 assert.match(source, /detectAndApplySizes/, "script should detect original sizes before applying scaled variables");
 assert.match(source, /moduleReady/, "script should lock each module after detecting its original size");
-assert.match(source, /CACHE_KEY/, "script should cache detected original sizes");
 assert.match(source, /CARD_HEIGHT_SCALE/, "script should use a separate scale for card heights");
 assert.match(source, /setCardHeightVar/, "script should apply card height scaling separately from thumbnail scaling");
-assert.match(source, /localStorage\.setItem\(CACHE_KEY/, "script should save detected sizes in localStorage");
+assert.doesNotMatch(source, /localStorage\.setItem/, "script should not write detected sizes to localStorage");
-assert.match(source, /localStorage\.removeItem\(CACHE_KEY/, "script should clear cached sizes from the menu command");
+assert.match(source, /LEGACY_CACHE_PREFIX/, "script should only keep legacy cache cleanup support");
 assert.match(source, /scheduleMeasure\("after-800ms"\)/, "script should delay the first page measurement until original layout can render");
 assert.doesNotMatch(
   capturedCss,
@@ -226,93 +230,6 @@ assert.equal(earlyAppendedTarget, null, "GM_addStyle should avoid manual documen
 assert.equal(typeof earlyDomContentLoadedHandler, "function", "script should reinject after head becomes available");
 assert.equal(earlyObservedTarget, null, "script should not observe a missing head");
 
-const styleVars = new Map();
-const attrs = new Map();
-const cacheFakeDocument = {
-  documentElement: {
-    style: {
-      setProperty(name, value) {
-        styleVars.set(name, value);
-      },
-    },
-    setAttribute(name, value) {
-      attrs.set(name, value);
-    },
-    removeAttribute(name) {
-      attrs.delete(name);
-    },
-  },
-  head: {},
-  body: {},
-  createElement() {
-    return { id: "", textContent: "", setAttribute() {} };
-  },
-  getElementById() {
-    return null;
-  },
-  querySelectorAll() {
-    return [];
-  },
-  addEventListener() {},
-};
-const cacheStore = new Map([
-  ["tm-thumb-scale:size-cache:v9", JSON.stringify({
-    schema: 9,
-    scale: 2,
-    cardHeightScale: 1.55,
-    modules: {
-      discover: {
-        discoverCard: { width: 182, height: 176 },
-        discoverThumb: { width: 180, height: 101 },
-        discoverTripleUl: { width: 1904, height: 550 },
-        discoverTripleArrow: { width: 35, height: 534 },
-        discoverDoubleUl: { width: 1904, height: 366 },
-        discoverDoubleArrow: { width: 35, height: 350 },
-        discoverSingleUl: { width: 2127, height: 182 },
-        discoverSingleArrow: { width: 35, height: 166 },
-      },
-    },
-  })],
-]);
-
-vm.runInNewContext(source, {
-  console,
-  document: cacheFakeDocument,
-  localStorage: {
-    getItem(key) {
-      return cacheStore.get(key) || null;
-    },
-    setItem(key, value) {
-      cacheStore.set(key, value);
-    },
-    removeItem(key) {
-      cacheStore.delete(key);
-    },
-  },
-  getComputedStyle() {
-    return {
-      getPropertyValue(name) {
-        return styleVars.get(name) || "";
-      },
-    };
-  },
-  GM_addStyle() {
-    return { id: "", textContent: "", setAttribute() {} };
-  },
-  GM_registerMenuCommand() {},
-  MutationObserver: class {
-    observe() {}
-  },
-});
-
-assert.equal(attrs.get("data-tm-thumb-scale-discover"), "1", "discover should be enabled directly from cached original sizes");
-assert.equal(styleVars.get("--tm-thumb-discover-width"), "364px");
-assert.equal(styleVars.get("--tm-thumb-discover-card-height"), "273px");
-assert.equal(styleVars.get("--tm-thumb-discover-thumb-width"), "360px");
-assert.equal(styleVars.get("--tm-thumb-discover-height"), "202px");
-assert.equal(styleVars.get("--tm-thumb-discover-single-ul"), "282px");
-assert.equal(styleVars.get("--tm-thumb-discover-triple-ul"), "853px");
-
 const followingVars = new Map();
 const followingAttrs = new Map();
 const followingFakeDocument = {
@@ -350,15 +267,19 @@ vm.runInNewContext(source, {
   localStorage: {
     getItem() {
       return JSON.stringify({
-        schema: 9,
+        schema: 15,
         scale: 2,
         cardHeightScale: 1.55,
         modules: {
           home: {
+            homeColumns: 7,
             homeCard: { width: 174, height: 120 },
+            homeThumb: { width: 174, height: 98 },
           },
           followingList: {
+            followingListColumns: 7,
             followingListCard: { width: 190, height: 120 },
+            followingListThumb: { width: 188, height: 106 },
           },
         },
       });
@@ -382,10 +303,10 @@ vm.runInNewContext(source, {
   },
 });
 
-assert.equal(followingAttrs.get("data-tm-thumb-scale-following-list"), "1", "followed-cams should use its own cached list module");
+assert.equal(followingAttrs.get("data-tm-thumb-scale-following-list"), undefined, "followed-cams should not apply legacy cached list module");
-assert.equal(followingAttrs.get("data-tm-thumb-scale-home"), undefined, "followed-cams should not apply homepage cache");
+assert.equal(followingAttrs.get("data-tm-thumb-scale-home"), undefined, "followed-cams should not apply legacy homepage cache");
-assert.equal(followingVars.get("--tm-thumb-following-list-width"), "380px");
+assert.equal(followingVars.get("--tm-thumb-following-list-columns"), undefined);
 assert.equal(followingVars.get("--tm-thumb-following-list-card-height"), undefined);
 assert.equal(followingVars.get("--tm-thumb-following-list-thumb-width"), undefined);
 assert.equal(followingVars.get("--tm-thumb-following-list-thumb-height"), undefined);
-assert.equal(followingVars.get("--tm-thumb-home-width"), undefined);
+assert.equal(followingVars.get("--tm-thumb-home-columns"), undefined);