Front.id

A la hora de depurar un sitio, siempre contamos con la ayuda de nuestro compañero, el inspector web. Cada navegador tiene el suyo y en casi todos, es este precisamente quien tambien nos permite emular el comportamiento de un dispositivo móvil. En Firefox tenemos la "Vista de diseño adaptable", en Chrome el "Toggle device toolbar", etc.

Pero la excepción aparece cuando necesitamos simular y depurar un sitio en IOS. Aunque Safari posee su inspector, para simular un dispositivo móvil debemos hacer uso de Xcode, que cuenta con un abanico de herramientas y entre ellas el Simulador.

Veamos ahora paso a paso, como usar el Inspector web de Safari para depurar un sitio que estamos simulando con Xcode.

Simulador IOS

Abrimos Xcode y vamos a:
Xcode > Open Developer Tool > Simulator

Desde el simulador en:
Hardware > Device
elegimos el dispositivo que deseamos emular

Dentro del dispositivo emulado, abrimos Safari e ingresamos al sitio que deseamos depurar.

Safari desktop

El inspector para Safari IOS se hace desde el Safari que tienes en tu mac, el de escritorio. Abrimos Safari y desde desarrollo vamos a encontrar el dispositivo emulado y el sitio en cuestión.

A partir de este momento el inspector que se abra estará apuntando a la pagina que tienes abierta en el emulador lo que te permitirá manipular el DOM, estilos y js.