I am developing a RWD web app supporting from mobile to desktop. I need to test the web app in different mobiles ranging from iPhone, android phone and BB phone and Windows phone, iPad and android tablets and desktops.
Currently i am doing testing using the chrome web browser and i squeeze the browser window to see the behavior in different width screen.
Is there any better approach available to do the testing in different versions of phones? and is there any tool available to test the loading time in mobiles, i know profiling tools like fiddler is available for desktop, is any profiling tool available for mobile also?
Please help me in this. thanks in advance for any help.
Related
I'm working on a web app frontend on a MacBook with Retina screen, but the app users primarily use windows laptops with 13/14" screens, and my frontend looks too big for them.
How can I accurately emulate windows laptops' screen size and pixel size/density to adjust my UI responsiveness?
I saw some online services where you can enter the link to preview it on different devices, but the app is on my localhost, which doesn't wok there. Is there any other solution?
in google chrome open your app,
Press F12 to open dev tools
Now click on mobile emulator
then you can change the resolution from here and select responsive dimensions.
I use Chrome Debugger on my PC to debug my web application, and it has a new handy feature where I can set the debuger to a mobile device, in this case Iphone 7.
Supposedly this allows you to emulate a mobile device. However, despite doing this I am getting different results, that is, it is not emulating the iPhone 7 device accurately.
There is an SVG component completely missing in the mobile browser. Very odd.
I have never troubleshot my web app on a mobile device, but need a means to do this. I also need a means to report the debugger as not accurately emulating the mobile device.
I did some googling and found this SO Q/A, however it is about 10 years old.
Here is a screen shot of the emulator and the icon that is actually missing on my mobile device:
Those situations are tricky...you need to use a device emulator such as https://crossbrowsertesting.com/
I install visual studio 2013, but I can't run app on emulator with 1080p resolution.
Available only this emulators
<ScreenResolutions>
<ScreenResolution Name="ID_RESOLUTION_WVGA" />
<ScreenResolution Name="ID_RESOLUTION_HD720P" />
<ScreenResolution Name="ID_RESOLUTION_WXGA" />
</ScreenResolutions>
How I can test my app for device with 1080p resolution?
Emulator images for 1080p or GDR3 phones are not yet available, but they should be soon!
Anyway from your point of view the 1080p device has same scale factor as 720p devices, so if your app supports 720p devices, it should work just fine on 1080p devices as well.
In case you want to detect such devices or provide specific content, here's a nice article how to do it:
Resolution specific considerations
Or here similar article on MSDN:
Multi-resolution apps for Windows Phone 8
Not yet, the support will be out soon.
But since 1080p is using the same aspect ration as 720p, you can "fake it" and pretend that 720p is actually 1080p and test in that environment. Besides, you won't really notice the difference anyway.
It's available now, you can now run your WindowsPhone8 app in 1080p resolution emulator, Microsoft just released an update for it, read the Windows Phone Developer Blog
Let's say I want to build a web application for Phonegap.
I can design it as much as I can on my pc screen, but since there are a lot of different screen densities on mobile devices and we use mostly px units on HTML/CSS, the elements' sizes may vary a lot from one device to another...
Since I don't have all those physical devices, is there another way I can test it? Using somekind of browser addon, app or online tool?
Thank you
Use mobile phone emulator
http://www.mobilephoneemulator.com/
select device where you test and then open your site link,
here is another good simulator
http://transmog.net/iphone-simulator/
i use 2nd one to test my site and app....
I have started coding for mobile browsers (i.e. iPad, Galaxy Tab, etc). For a starter, I don't have budgets to get all the tablets for testing (I wish I do :D). Anyway, I am looking for a decent mobile browser simulators. I have looked into Ripple (only works in Chrome), MobiOne, and PhoneGap simulator. But all of these are not that up to par. Can someone recommended a decent one? and it will be great if it is also open source.
Thanks in advance
A good list of emulators and simulators are here: http://www.mobilexweb.com/emulators
For iPad, the only simulator I know of is built into XCode when you compile or run. You have an option of previewing in iPhone or iPad, and though the screen is hard to read, it's manageable if you click on 2x button.
If you're developing for android, the Android SDK has one.
http://developer.android.com/sdk/index.html
if you just want to quickly view how a webpage would render at various mobile device resolutions then here is a nice little webpage...
http://synthphone.com
you can even link directly to a url via query strings. for example, here is one that should load the Sencha Touch 2 carousel. Use your mouse like a finger to slide around the images etc.
http://www.synthphone.com/?u=http://dev.sencha.com/deploy/touch/examples/production/carousel/index.html
have fun!