Problemas de renderizado / artefactos de Safari 6 (en Mountain Lion)

12

Actualización final Acabo de recibir un correo electrónico de Apple confirmando que este error se ha solucionado en OS X Mountain Lion 10.8.3

He tenido problemas de renderizado con Safari 6 en diferentes sistemas que ejecutan Mountain Lion, y no puedo encontrar una solución. Adjunto algunas capturas de pantalla para describir el problema.

Actualización La investigación adicional sugiere que esto podría ser un problema solo para los modelos Mac 2012, específicamente los que tienen gráficos HD4000.

Actualización Parece que los artefactos no siempre aparecen de inmediato, lo que requiere algunas recargas y / o pestañas de cierre / reapertura antes de que aparezcan.

Modificar La cuestión se confirma como no un error WebKit , y se ha presentado como un error en Apple (12750455 problema de Simon Fraser).

Sitio web de Twitter Bootstrap en Safari

Sitio web de Twitter Bootstrap en Safari

Sitio web de Twitter Bootstrap en Firefox

Sitio web de Twitter Bootstrap en Firefox

Jsfiddle de teca en Safari

Jsfiddle de teca en Safari

Jsfiddle de teca en Firefox

Jsfiddle de teca en Firefox

Enlaces a los sitios web que se muestran en las capturas de pantalla:

macos safari graphics René
fuente
2
Traté de editar el texto un poco, pero antes de intentar sugerir si otro sitio sería mejor y migrarlo, ¿puede aclarar lo que está buscando principalmente? ¿Desea que se trate de JQuery que necesita un parche o sobre WebKit / Safari? Aquí estamos más centrados en los usuarios y, aunque algunos son programadores y desarrolladores web, no somos el mejor lugar para el nivel de código y el conocimiento de nivel de error / regresión. Podemos indicarle cómo presentar un error con Apple, pero generalmente no tenemos preguntas y respuestas detalladas sobre html / css / js aquí.
bmike
1
Estoy perfectamente bien ... imgur.com/a/vICCs Estoy ejecutando Safari 6.0.1 en OS X Lion 10.7.5
daviesgeek
@bmike Supongo que este es un problema de Mountain Lion, y no un problema de html / css / js.
René
Acabo de preguntarle a un colega que también dirige Mountain Lion: no hay problemas allí. Entonces la fuente del problema sigue siendo un misterio para mí.
René
1
@ René De acuerdo con blackpixel.com/blog/2012/02/radar-or-gtfo.html , es una buena idea plantear errores duplicados con Apple, por lo que probablemente sea una buena idea si también lo informa.
Olly Hodgson

Respuestas:

3

¡Fue un error en Safari, resuelto en OSX Update 10.8.3!

Guido Hendriks
fuente
1
Agregar la cita relevante de las notas de actualización, por ejemplo, aumentaría mucho el valor de su respuesta.
Thecafremo
1
En realidad no se observó en las notas de actualización, pero lo resolvió. Lo intenté antes y después de la actualización.
Guido Hendriks
1
Parece que Apple lo ha solucionado con el lanzamiento de Mountain Lion 10.8.3 + Safari 6.0.3 esta semana.
Sinklar
8

Puedo confirmar que este es un error con la GPU Intel Graphics 4000. Veo los artefactos gráficos en mi Retina MacBook Pro de 13 "y no en mi MBP anterior que tiene Mt. Lion y una GPU Nvidia Geforce.

Tengo experiencia de primera mano con este problema al tratar de desarrollar botones CSS para sitios web ...

Creo que los artefactos se pueden reproducir usando el css3 border-radiusjunto con a box-shadow. Aunque obviamente también sucede en muchas otras circunstancias. (Lo cual puedo confirmar)

Aquí hay un enlace a un informe de error en el sitio web de webkit (aunque no estoy seguro de que pertenezca allí):

https://bugs.webkit.org/show_bug.cgi?id=103087

Y la pregunta SO vino de:

/programming/13505314/artifacts-on-css-rendering-box-shadow-on-safari-6-0-2-on-mountain-lion

Teca
fuente
1
Gracias por compartir esto. Sin embargo, no estoy convencido de que sea un problema de webkit, ya que este problema es específico de OS X Mountain Lion y solo con gráficos HD4000.
René
2

Esto no es un error de Intel HD 4000. Solo puedo ver este error desde Safari en Intel HD 4000. Si abro la página con (Opera, Chrome, Firefox), no puedo reproducir este error

Vladimir Kadnikov
fuente
2

Una solución rápida a este problema es usar una transformación en el objeto con el radio del borde u otra propiedad que cause daño. De esa manera, está forzando un redibujo con la tarjeta gráfica, y eso elimina el problema.

Aplica la siguiente propiedad: -webkit-transform: translate3d(0,0,0);- Y deberías estar bien.

Kalms
fuente
Tiene un costo de rendimiento no insignificante si lo aplica a un div que contiene muchas cosas, pero soluciona el error.
James
Costo de rendimiento? Me gustaría ver algunos datos sobre esto. Cualquier costo adicional debe ser manejado por la GPU.
Kalms
1
Una transformación nula crea una textura de respaldo para ese elemento en la GPU. Esto hace que mover el elemento sea barato, ya que es un compuesto en lugar de una pintura, pero hace que los cambios en el elemento sean más caros (p. Ej., Texto, dimensión, cambios de estilo) ya que necesita cargar una nueva textura en la GPU, así como volver a pintar el elemento . También utiliza la memoria de la GPU, que puede ser un problema en los teléfonos.
JaffaTheCake
Gracias por eso. ¿Alguna buena recomendación para obtener información sobre esto?
Kalms
1

Aquí hay cosas que haría si no puede proporcionar un enlace a algo que está en vivo en Internet para que otros dupliquen / descubran lo que está sucediendo.

  1. Pruebe una compilación de webkit nocturno para ver si se corrigió un error, pero no se envió. http://nightly.webkit.org

  2. Elimine todas las extensiones de Safari para asegurarse de que no sea causado por una.

bmike
fuente
He agregado enlaces a los sitios web que se muestran en las capturas de pantalla.
René
Intenté ambas sugerencias, pero desafortunadamente no funcionaron.
René
1

También puedo confirmar este error en retina 15 "macbook (osx 10.8.2, safari 6.0.2)

Mi macbook también tiene Intel HD4000, pero también Nvidia GT 650M para la pantalla externa.

Para eliminar todas las demás posibilidades, excepto la tarjeta gráfica (controlador), utilicé un adaptador de rayo a dvi para conectar una pantalla externa en la tarjeta Nvidia.

Resultado: ¡Sin líneas extrañas y efectos jquery extraños!

conclusión: problema HD4000 (controlador).

Rubén
fuente