Tengo una página web muy larga (de altura) y estoy usando Titiritero para exportar la página a PDF. Tiene alrededor de 30,000 px de largo.

Estoy usando document.documentElement.scrollHeight para tratar de determinar dinámicamente la altura total, pero devuelve 1018 cuando console.log y la exportación de PDF muestran lo mismo.

El 1018 es la altura de la ventana gráfica, por lo que si cambio la ventana, también cambia.

¿Curioso por qué es esto?

La altura está regresando de esta manera incluso en inspección directa> console.log y sin usar Titiritero.

¿Alguna idea de por qué la altura no es correcta o cómo solucionarlo?

ACTUALIZACIÓN: Este es mi diseño en nuxt

 <template> <div id="my-app" ref="layout" class="flex flex-col h-screen overflow-hidden bg-gray-100 font-museo-sans" > <main class="overflow-y-auto"> <div class="max-w-7xl mx-auto py-5 xl:rounded-lg xl:shadow-md"> <Nuxt class="transition-opacity duration-200" /> </div> </main> </div> </template>

El desbordamiento oculto y la pantalla h por alguna razón son necesarios para mi aplicación, ya que si la elimino, la página no permite el desplazamiento.

Sin embargo, no entiendo muy bien el comportamiento de esto. ¿Por qué el desbordamiento oculto y la configuración de una altura en la ventana gráfica permiten el desplazamiento de la aplicación nuxt?

Además, pensé que documentElement.scrollHeight devuelve el desbordamiento oculto, pero supongo que no.