Most of my users are using opera mini to visit my website and there are some things which doesn't work under opera mini. How can I simulate opera mini in my laptop/dev environment?
Try Opera's Mini Simulator.
You may also want to have a look at some of the answers to this related question, especially some of the articles from dev.opera.com they link to.
Keep in mind that Opera Mini itself doesn't render the page; it receives a compressed version of the page rendered on one of Opera's servers.
Related
I have been playing with phantomJS for a while and I came across problems when using it in websites that use matchMedia queries to distinguish device types.
For a while I thought that was a phantom problem but it is happening with other headless browsers like slimerJS and Headless Chrome.
The problem is that matchMedia queries are not honouring the view port on HB.
As sample, the following steps reproduce the problem in these HB:
Setting a mobile view port(ex: 736x414).
Open https://josebrandao13.github.io/
Take a screenshot.
screenshot
Result is always: "I'm a tablet". Meaning that width and height are greater than 768px when they are not.
If you open this website on Chrome or Firefox dev tools and switch between phone and tablet devices, matchMedia behaves as expected. Also if I open it on my mobile phone chrome's everything is ok.
Is there any known problem with headless browsers and matchMedia ?
After a time struggling with this problem I found a way to emulate a mobile device with Headless Chrome, including match media queries.
For those interested:
https://github.com/josebrandao13/headlessChromeMatchMedia
I'm currently trying to set up a connection between my web client and my iOS app, but for some reason my iOS client only sees a black box when using Chrome (version 33). I can see the video just fine if I use Firefox (both in my app and when I put the browsers side-by-side, they can see each other).
This doesn't appear to be a documented known issue with the JavaScript SDK, and I can't see any recent discussion about this on the forums (last post was mine).
The iOS sample can be located here (samples/OpenTokHelloWorld) with the browser page in samples/OpenTokHelloWorld/browser_demo.html
I suggest cd'ing into samples/OpenTokHelloWorld and running python -m SimpleHTTPServer, as it can't be run from a file:/// path.
Here is what my iPad sees:
Chrome:
Firefox:
And Chrome/Firefox (respectively), both publishing video from the same camera
Edit: after testing on other machines, it may be something specific to my environment even though none of my extensions run in Incognito and I don't have any custom plugins installed.
It looks like the OpenTok mobile SDKs with the specific webcam I was using has issues. On Android the video stream will display for a brief moment then segfault, and on iOS there will be no video at all.
I have tested this many times and could not reproduce what you are seeing in your chrome.
Without seeing any console errors or iOS logs the best suggestion is to try clearing your cache, or maybe restarting your computer (longshot)
I'm developing a mobile website for iPhone, Android, etc. using jQuery Mobile. I'd like to be able to test this in my desktop browser and was wondering what the best approach is. I guess I could use a plugin to change the User-Agent header to the appropriate value and manually resize the browser to the device's width, but is there a simpler/more reliable way?
Update
Sorry, I should have mentioned that the only hardware available is a Windows laptop
Well if you have a Mac and xCode is installed you can use the Simulator. Open Mobile Safari and point to you web page on all Apple devices
You can also use the Android Emulator ( But I've not tested that it can access the web from the browser )
Alternatively you could use a plugin ( as you have suggested ).
I personally use Chrome with this plugin:
https://chrome.google.com/webstore/detail/ljfpjnehmoiabkefmnjegmpdddgcdnpo
with pretty good results.
I've used Device Anywhere before
http://www.keynotedeviceanywhere.com/
you access the device through a web portal/site and control it, but this costs $$$
Actual device testing in going to be the most reliable
related:
http://sixrevisions.com/tools/10-excellent-tools-for-testing-your-site-on-mobile-devices/ ( other suggestions )
Difference between iPhone Simulator and Android Emulator
In Chrome hit F12 to open the Developer Toolbar. Then click 'Toggle device toolbar' (tablet icon, top left next to select element). You can then choose the device at the top to test.
There's also PerfectoMobile for testing on devices remotely...though it can be painfully slow. I'd really recommend at least getting some 'base' testing devices, if possible.
There is also http://www.browserstack.com/responsive that can be used to get a screenshot of what your site would look like on a number of given devices.
There is however a limitation of how many screenshots you can get in the free version I have linked to here.
I got nice results, visualy, by using Chrome add-on called Ripple Beta. Bad thing is that there is no ability to add some custom device, like tablets of 8" or 9" or bigger... but works. I'm not sure is it able to show some errors visible on real device but seems nice.
Manymo should work very well simulating Android for you. It shows me exactly what my cell phone shows, even though my desktop browsers don't. Manymo is a website with a lot of Android phones pictured. Just click one and enter your URL. There are options such as Android versions and screen sizes.
Look for the Chrome plugin Responsive Web Design Tester - you'll be able to emulate mobile browsers for different device sizes on all platforms.
For testing without an iPhone/Android phone, which desktop browser works best with Sencha Touch? I tried Chrome and Safari, which work fairly well, but both seem to have little issues.
Firefox and IE apparently don't work at all with Sencha Touch. Is there a secret weapon, like a port of a mobile browser, available?
There's a Chrome extension called Ripple that's pretty good, but most things can be tested quite productively in Chrome. Set Ext.is.Phone = true; at the beginning of your script when you need to test the phone UI.
You should be using the iPhone/iPad hardware simulator on a mac, or the Android simulator if you're on Windows. Desktop browsers will get you there - particularly desktop safari -- although there are enough differences that you should really use one of the simulators
A direct link to one ipad simulator online is: http://ipadpeek.com/
On Windows, Google Chrome is my favorite browser. When I'm done developing a section of the app I do test it on my real device, an HTC desire (Android). As expected, the real device is WAY slower than desktop browser, specially notable on animations, e.g sliding tabs and carousels.
I would say Google chrome is the best browser till date.... and its an ideal browser for sencha touch applications to run, since it contains webkit..
Also you can use Titanium (you can download it here) which has iphone/iPad simulater built in but for that you need a Mac and you also have to download ios sdk.
Working on these simulators is an awesome experience.
If my app has been tested in Firefox 3, Safari 3 & IE 7 will it need additional testing for Chrome?
If there are areas that'll need further testing -- then are there any online guides I could share with my designers & developers?
At what point will Chrome be considered to have sufficient market share to be treated as a mainstream browser?
If it's working fine on Safari, it will probably work on Chrome as well. The only difference is the JavaScript engine, but I've yet to see a real world example of some legitim JavaScript code not working on Chrome.
Personally I test my stuff with Chrome because I use Chrome intensively for development. It is good practice to test your pages with at least one WebKit (or KHTML) based browser though.
Chrome uses the WebKit rendering engine, which is also used in Safari and some other small browsers. Overall with both Chrome and Safari gaining in market share it is definately a browser to test (you only really need to test one). It's very standards compliant and is constantly having updates to keep up with new CSS drafts.
Webkits main Site - http://webkit.org/
Browser Market Share
http://www.w3schools.com/browsers/browsers_stats.asp and http://en.wikipedia.org/wiki/Usage_share_of_web_browsers are good places to look for market share of browsers although they show very different responses on Chrome.
According to Wikipedia roughly 7.96% of poeple are using WebKit based browsers however W3C shows that in November only 5.8% did.
Theoretically, because Google Chrome uses the same engine as Safari (WebKit), you've already tested. But Google has made several changes to the engine, including rewriting the JavaScript interpreter completely. Additional testing never hurts and it wouldn't take long to confirm that everything works as expected.
Now that GMail suggests people switch from IE to Firefox and Chrome, I'm guessing we'll see IE lose more and more market share to those browsers. Chrome doesn't have much of a user-base now, but I can imagine that will change.
Better test on it. I've already run across sites that work in Safari but don't in Chrome. I have IE8b2, FF3, Safari, and Chrome all installed on my machine. Not for testing reasons, but because of the websites that I visit. Takes all 4 of those to get all the websites to show right...
if you don't have PNG24 with opacity changed from CSS, all things should be fine.
However, i always try in all modern browsers (ie6/7, ff2/3, opera 9.x, safari and chrome).
According to Wikipedia, Chrome has a 0.78% usage rate right now. Depending on your audience the actual number of users might be low, and not really require testing.
Chrome uses the WebKit engine, which as I recall is the same engine used by Safari. So in theory, if your site works for Safari it should work for Chrome, as well.
Refer to this Google's Chrome page for details.
Chrome already got a small percentage of the community. However as far as I know, Chrome follows the standards from W3C and all websites that work in IE6, IE7 and FF2 / 3 has worked perfectly for me.
So by that said, i think you should already be testing your applications in chrome as well.
Always test in these browsers nowdays:
Internet Explorer 6, 7, 8
Firefox 2, 3
Chrome
Opera
Safari
Lynx