Problemas/artefactos de representación de Safari 6 (en Mountain Lion)

Actualización final Acabo de recibir un correo electrónico de Apple que confirma 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, todos con Mountain Lion, y no puedo encontrar una solución. He adjuntado algunas capturas de pantalla para describir el problema.

Actualizar Investigaciones posteriores sugieren que esto podría ser un problema solo con los modelos Mac de 2012, específicamente los que tienen gráficos HD4000.

Actualizar Parece que los artefactos no siempre aparecen de inmediato, lo que requiere algunas recargas y/o cerrar/reabrir pestañas antes de que aparezcan.

Actualización Se confirma que el problema no es un error de WebKit y se ha presentado como un error en Apple (problema 12750455 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 Teak en Safari

Jsfiddle de Teak en Safari

Jsfiddle de Teak en Firefox

Jsfiddle de Teak en Firefox

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

Traté de editar un poco el texto, pero antes de intentar sugerir si otro sitio sería mejor y migrarlo, ¿puede aclarar qué es lo que está buscando principalmente? ¿Quiere que se trate de JQuery que necesita un parche o de WebKit/Safari? Estamos más enfocados en los usuarios aquí y, aunque algunos son programadores y desarrolladores web, no somos el mejor lugar para el conocimiento a nivel de código y nivel de error/regresión. Podemos indicarle cómo presentar un error con Apple, pero generalmente no tenemos preguntas y respuestas detalladas de html/css/js aquí.
Estoy perfectamente bien... imgur.com/a/vICCs Estoy ejecutando Safari 6.0.1 en OS X Lion 10.7.5
@bmike Supongo que este es un problema de Mountain Lion, y no un problema de html/css/js.
Acabo de preguntarle a un colega que también dirige Mountain Lion: no hay problemas. Entonces, la fuente del problema sigue siendo un misterio para mí.
Tal vez sea algo con la tarjeta gráfica HD4000.
@René OK, está bien aquí, solo quería estar seguro de que conocía sus opciones. ¿Puede señalar algún lugar en Internet donde otros puedan ver y replicar su problema? Parece que DaviesGeek intentó descargar jQuery y no puede replicar sus fallas.
Interesante: puedo confirmar las líneas antes del problema de las palabras en la página de jQuery. Pero no puedo confirmar los problemas en la página de arranque. Obtuve un MBA 2012 con un HD4000 GFX.
También veo artefactos extraños en la aplicación web que estoy desarrollando en RETINA MBP Pro en Safari 6. Me pregunto si es un problema de representación de Safari en RETINA.
@René De acuerdo con blackpixel.com/blog/2012/02/radar-or-gtfo.html , es una buena idea generar errores duplicados con Apple, ¡así que probablemente sea una buena idea si también lo informa!
@OllyHodgson gracias, ¡presentaré un error duplicado de inmediato!

Respuestas (6)

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

Agregar la cita relevante de las notas de actualización, por ejemplo, aumentaría en gran medida el valor de su respuesta.
En realidad, no se anotó en las notas de actualización, pero lo resolvió. Lo probé yo mismo antes y después de la actualización.
Parece que Apple lo solucionó con el lanzamiento de Mountain Lion 10.8.3 + Safari 6.0.3 esta semana.

Puedo confirmar que se trata de un error de 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 css3 border-radiusjunto con un archivo 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 de la que vino:

https://stackoverflow.com/questions/13505314/artifacts-on-css-rendering-box-shadow-on-safari-6-0-2-on-mountain-lion

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.

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

Una solución rápida a este problema es usar una transformación en el objeto con el radio de borde u otra propiedad que cause daños. De esa manera, está forzando un redibujado 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.

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

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

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

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

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

También puedo confirmar este error en macbook retina de 15" (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 ni efectos extraños de jquery!

conclusión: HD4000 (controlador) problema.