Herramientas para capturar y convertir la web
Comunidad en línea de GrabzIt

Problemas de Firefox con la posición

Haga preguntas relacionadas con GrabzIt's Web Scraper Tool. Por ejemplo, cómo usar el raspador web y la API para extraer datos de páginas web, imágenes o documentos PDF.

Tengo problemas para que la captura de pantalla funcione correctamente en Firefox en determinadas situaciones. 

Firefox utiliza una propiedad CSS "insertada" que ningún otro navegador utiliza (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). Se usa en lugar de izquierda/derecha/arriba/abajo. Al menos en mi versión de FF, incluso obliga a usarlo reemplazando cualquier CSS izquierdo/derecho/.... GrabzIt no reconoce esta propiedad y por eso la imagen no es correcta para los usuarios de Firefox. 

¿Alguien más ha experimentado esto y tiene una solución?

Preguntado por Corey Alderin el 18 de septiembre de 2019

¿Quizás poner el código CSS que es susceptible de cambiar en un archivo CSS externo y hacer referencia a él en su HTML de esa manera?

Respondido por GrabzIt Support el 18 de septiembre de 2019

Eso no funcionaría en mi caso. Necesito tener el CSS en línea porque no siempre es el mismo. Cambia según el usuario. 

Respondido por Corey Alderin el 18 de septiembre de 2019

En mi versión de Firefox probé con esto:

<html>
<head>
<script src="grabzit.min.js"></script>
</head>
<body>
<div id="screenshot"><style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div></div>
<script>GrabzIt("APPLICATION KEY").ConvertHTML(document.getElementById('screenshot').innerHTML,{"target": "#captureThis",
"format": "png",
"transparent": 1,
"bwidth": 1200,
"bheight": 1000,
"hd": 1,
"width": 1200,
"height": 1000,
"hide": ".modal-backdrop",
"displayid": "finalImage"}).DataURI();
</script>
</body>
</html>

Los datos publicados fueron estos:

<style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div>

No se envió ningún recuadro.

 

Respondido por GrabzIt Support el 18 de septiembre de 2019

He estado probando esto más y parece que esto sucede cuando el usuario mueve un div. Mi aplicación permite mover elementos y es entonces cuando Firefox realiza ese cambio. Probablemente pueda hacer algunos cambios en mi código para tener en cuenta esto. 

Respondido por Corey Alderin el 18 de septiembre de 2019