enable scrolling locally, but keep disabled in iframe

.travis.yml

@@ -0,0 +1,13 @@
+dist: focal
+language: node_js
+node_js:
+  - v20.13.1
+cache:
+  directories:
+    - node_modules
+before_install:
+  - npm i -g [email protected]
+install:
+  - npm install
+script:
+  - npm run build

components/iframeCommunication.js

@@ -39,19 +39,19 @@ const IframeCommunication = () => {
     const debounceTimeout = useRef(null);
 
     const sendPageHeight = () => {
-        const pageHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
-
-        // Only send if there's a meaningful difference in height
-        if (Math.abs(pageHeight - lastHeight.current) > 40) {
-            lastHeight.current = pageHeight;
-
-            // Debounce the message to avoid excessive calls
+        const contentHeight = document.body.offsetHeight;
+        console.log("Actual content height:", contentHeight);
+
+        if (Math.abs(contentHeight - lastHeight.current) > 40) {
+            lastHeight.current = contentHeight;
+
             clearTimeout(debounceTimeout.current);
             debounceTimeout.current = setTimeout(() => {
-                sendMessageToParent({ type: SupportedMessageTypes.PageHeight, height: pageHeight });
+                sendMessageToParent({ type: SupportedMessageTypes.PageHeight, height: contentHeight });
             }, 50);
         }
     };
+
 
     useEffect(() => {
         // Send initial page height and path

pages/_app.js

@@ -1,7 +1,20 @@
-import '../styles.css'
+import { useEffect } from 'react';
+import '../styles.css';
 import IframeCommunication from '../components/iframeCommunication';
-
-// This default export is required in a new `pages/_app.js` file.
+
 export default function MyApp({ Component, pageProps }) {
-  return <><IframeCommunication /><Component {...pageProps} /></>;
+  useEffect(() => {
+    if (window.self !== window.top) {
+      document.body.classList.add("in-iframe");
+    } else {
+      document.body.classList.remove("in-iframe");
+    }
+  }, []);
+
+  return (
+    <>
+      <IframeCommunication />
+      <Component {...pageProps} />
+    </>
+  );
 }

styles.css

@@ -2,4 +2,8 @@ body {
     font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica',
     'Arial', sans-serif;
     overflow-y: hidden;
-}
+}
+
+body:not(.in-iframe) {
+    overflow-y: auto;
+  }