wip

2026-01-04 17:50:08 -06:00
parent 7e45ce0756
commit acc8ac87a0
4131 changed files with 232562 additions and 250244 deletions
@@ -0,0 +1,84 @@
+const { chromium } = require('playwright');
+
+(async () => {
+  const browser = await chromium.launch();
+  const context = await browser.newContext({ viewport: { width: 1400, height: 800 } });
+  const page = await context.newPage();
+  
+  await page.goto('https://homeproz.dev.hanson.xyz/properties/', { timeout: 60000 });
+  await page.waitForTimeout(3000);
+  
+  // Get document structure
+  const docInfo = await page.evaluate(() => {
+    const mapLayout = document.querySelector('.property-map-layout');
+    const mapContainer = document.querySelector('.property-map-container');
+    const footer = document.querySelector('footer.site-footer');
+    
+    const getDocPosition = el => {
+      const rect = el.getBoundingClientRect();
+      return {
+        top: rect.top + window.scrollY,
+        bottom: rect.top + rect.height + window.scrollY,
+        height: rect.height
+      };
+    };
+    
+    return {
+      mapLayout: mapLayout ? getDocPosition(mapLayout) : null,
+      footer: footer ? getDocPosition(footer) : null,
+      scrollHeight: document.documentElement.scrollHeight,
+      viewportHeight: window.innerHeight,
+      maxScroll: document.documentElement.scrollHeight - window.innerHeight,
+      mapContentHeight: mapContainer ? mapContainer.getBoundingClientRect().height : null
+    };
+  });
+  
+  console.log('Document positions:', JSON.stringify(docInfo, null, 2));
+  
+  // Calculate when CSS sticky would stop the map
+  // Sticky stops when: elementTop + elementHeight >= parentBottom
+  // For sticky at top:100 -> when scrollY + 100 + mapHeight >= mapLayout.bottom
+  const stickyStopScroll = docInfo.mapLayout.bottom - 100 - docInfo.mapContentHeight;
+  console.log('\nCSS sticky should stop at scrollY:', stickyStopScroll);
+  console.log('Max scroll possible:', docInfo.maxScroll);
+  
+  if (stickyStopScroll <= docInfo.maxScroll) {
+    console.log('\nSticky WILL naturally stop before footer. Testing...');
+    
+    // Scroll past the sticky stop point
+    const testScroll = Math.min(stickyStopScroll + 200, docInfo.maxScroll);
+    await page.evaluate(y => window.scrollTo(0, y), testScroll);
+    await page.waitForTimeout(500);
+    
+    const afterScroll = await page.evaluate(() => {
+      const mapContainer = document.querySelector('.property-map-container');
+      const footer = document.querySelector('footer.site-footer');
+      
+      return {
+        actualScrollY: window.scrollY,
+        mapViewportTop: mapContainer ? mapContainer.getBoundingClientRect().top : null,
+        mapViewportBottom: mapContainer ? mapContainer.getBoundingClientRect().bottom : null,
+        footerViewportTop: footer ? footer.getBoundingClientRect().top : null
+      };
+    });
+    
+    console.log('After scrolling to', testScroll);
+    console.log('Actual scrollY:', afterScroll.actualScrollY);
+    console.log('Map viewport position:', afterScroll.mapViewportTop, 'to', afterScroll.mapViewportBottom);
+    console.log('Footer viewport top:', afterScroll.footerViewportTop);
+    
+    // Check if map extended past footer
+    if (afterScroll.mapViewportBottom > afterScroll.footerViewportTop) {
+      console.log('\n*** OVERLAP DETECTED! Map extends into footer by', 
+        afterScroll.mapViewportBottom - afterScroll.footerViewportTop, 'px');
+    } else {
+      console.log('\nNo overlap. Gap:', afterScroll.footerViewportTop - afterScroll.mapViewportBottom, 'px');
+    }
+    
+    await page.screenshot({ path: '/tmp/max-scroll-test.png' });
+  } else {
+    console.log('\nCannot scroll far enough to trigger sticky stop');
+  }
+  
+  await browser.close();
+})();