What is the best way to test my website across various mobile browsers AND various versions of each of those browsers.
Additional Info:
Most of the online cross browser testing support wide range of desktop browser testing, and quite a range of mobile devices. But they don't seem to offer various versions of mobile browsers on those devices.
This similar question is quite old and it is surprising that in spite of the proliferation of mobile devices and focus on responsive designs, testing services for mobile is not catching up.
Major mobile browsers I would like to target : various mobile versions of Safari, Chrome, Firefox, Opera, Dolphin, UC Web etc
Just wanted to note this and this good alternative to online testing services for desktop browsers. Maybe something similar exists for mobile browsers too?
I'll suggest that both Opera's "device mode" is a really good for a first crack. But nothing beats actual device testing. I have found the odd case where Chrome's iPhone mode renders something different than what the actual phone does, but I would say it is about 90%. And the fact that it is so much easier to tweak code, and refresh using Chrome on the desktop rather than tweak, and refresh on phone, that I tolerate the 10% difference as long as I can. Then I just verify on an actual device after I am done with Chome's device mode.
I have not used Opera's device mode, but have heard it is good too.
There is a tool called as https://www.browserling.com/ which can be used for Desktop and Mobile testing(Android)
I don't think there is one way of doing cross browser testing across various mobile browsers and versions. It all boils down to what you want to do?
It is impossible to cover ALL browser combinations and versions. So my suggestion based on experience would be-
If you have too many combinations in mind, use a combinatorial tool (pairwise testing) from here - http://www.pairwise.org/tools.asp and reduce the number of permutations to get the best coverage.
Then go to Android and Apple website to see what the most commonly used phones and versions in the US, Europe and Asia region are based on where your customers are located. They have all these stats publicly available on their website
If you have google analytics see what browsers, versions and phones your users most commonly use to access your website
Now, you will have a list of devices and browser versions which is more focused.
Check what budget you have to invest in cross browser testing. Based on that I would recommend buying at least a couple of phones and tablets based on the usage statistics you got in the first 3 steps. Then, you can choose from a number of cross browser testing tools/services like
BrowserStack
Amazon Devices Farm
Saucelabs
Now atleast you have a more scientific way of doing cross browser testing :-)
I'm working on the idea of a project that has to run as well online (via a remote server) and offline, on desktop (Linux/Mac OS X / Windows) and Firefox OS / Android mobile devices (Windows Phone and IOS is not a need).
This project have to be open, and I want to be as close to standards as possibles. I know a little about both Cordova and Mozilla Open Web App, and both seems to be really great on this aspects.
So, my question is : Which, between Mozilla Open Web App and Cordova, seams the closest to the future standards of web apps, and which can really respond to the need of running the app as well online and offline.
PhoneGap is a good choice if you target only mobile devices: you would have been able to use their APIs to create Firefox OS as Android applications. Since you need to target all desktops, Mozilla Open Web App is the choice.
By creating a Firefox OS applications, using HTML, CSS, and JavaScript, you will of course have an application running on Firefox, but you will also be able to run it on Android if you have Firefox installed. Last, but not least, you will be able to make the application run on the desktop, again, by having Firefox installed.
As for the offline support on your application, you can either use IndexedDB or create a packaged app.
When it comes to the Web Standards, Firefox OS is using the standard you know. On top of that, WebAPI is available, so you can access to the hardware, and create a better experience with the platform. Those APIs are not part of the standard right now, but we are working with the W3C to make that happens. Note that if the standard change to something we did not have, we will make the change to be standard compliant.
P.S.: Full disclosure, I'm working for Mozilla.
To put it bluntly, do Mobile Chrome Apps have anything to do with chrome at all? After all, it seems reasonable to expect that as it has Chrome in the name. This question stems from the fact that as I was porting my 'chrome based mobile app' (which does not run in the 'Browser'), I got a huge string of weird errors and for the first couple of hours I had no idea what was happening.
NOTE: This question is out of date, Mobile Chrome apps now works differently as outlined in the edit section of the main answer:
By default, Chrome Apps for Mobile leverage an embeddable Chromium WebView provided by the Crosswalk project by default, which has both advantages and some tradeoffs.
(Note: I work on the (very small) team at Google building the open source project to bring Chrome Apps to Mobile)
First, I’ll paste the description of Chrome Apps, right from the top of the docs:
“Chrome Apps deliver an experience as capable as a native app, but as safe as a web page. Just like web apps, Chrome Apps are written in HTML5, JavaScript, and CSS. But Chrome Apps look and behave like native apps, and they have native-like capabilities that are much more powerful than those available to web apps.
Chrome Apps have access to Chrome APIs and services not available to traditional web sites. You can build powerful apps that interact with network and hardware devices, media tools, and much more.”
Next, I’ll paste the description of Chrome Apps for Mobile, right from the top of our README.md:
“You can run your Chrome Apps on Android and iOS via a toolchain based on Apache Cordova, an open source mobile development framework for building mobile apps with native capabilities using HTML, CSS and JavaScript.
Apache Cordova wraps your application's web code with a native application shell and allows you to distribute your hybrid web app via Google Play and/or the Apple App Store. To use Apache Cordova with an existing Chrome App, you use the cca (c ordova c hrome a pp) command-line tool.”
Now to answer your question: “To put it bluntly, do Mobile Chrome Apps have anything to do with chrome at all? After all, it seems reasonable to expect that as it has Chrome in the name.”
Blunt Answer:
No, they don’t run on Chrome in the same sense that they do on desktop. However, using cca they can run on Mobile in ways that are most appropriate for those platforms, and we do use the Chrome Renderer whenever/however we can.
EDIT as of July 2014: We now run apps inside the Crosswalk WebView on every version of Android (currently based on Chrome 36, but that will change with time). I described this approach at the bottom of this original answer, but some of the details about system webviews -- while still accurate -- no longer really apply to Chrome Apps for Mobile. You can read more about this on our main github page.
Sorry for the naming confusion. I do see why it is reasonable to assume what you did. The “Chrome” in “Chrome Apps for Mobile” refers specifically to the source application type, not to the target runtime type. We try to document that best we can -- Do you have a suggestion for a simple yet less confusing title?
Less-Blunt Answer:
Chrome Apps for Mobile is an open source project to build a tool to support wrapping existing Chrome Apps into Hybrid Mobile Apps, leveraging Apache Cordova.
That is, cca creates a 100% real Android/iOS app, like any other, built using the respective Mobile SDK. Additionally, for your benefit and convenience, we create an app shell that uses the system WebView component to display and run your application content. We read your application manifest, we simulate the Chrome App lifecycle, we run your background scripts, open chrome app windows, and implement many of the Chrome Apps device apis. We’ve bundled all this work up into one toolkit which we call cca. We also contribute a lot of patches to core cordova to generally make all hybrid apps on Android/iOS better.
Now, the default system WebView’s are as follows:
iOS: Mobile Safari WebKit based. Lots of web-platform overlap with Chrome, but not exact and diverging slowly.
Android 4.3 or older: Legacy Android WebView. Dated and occasionally buggy, but still fairly performant on certain tasks.
Android 4.4: Chrome based WebView. This initial release brought a slew of modern web apis, and enabled remote web inspector. However, it also introduced some regressions, is stuck at Chrome 30, and didn't bring all features, such as WebGL and WebRTC.
Android Future: Since the first launch of Chrome based WebView, it was announced that work is ongoing to make the WebView auto-update just like the Chrome Browser does.
So, on Android 4.4 we already use a real Chromium renderer to turn your Chrome App into pixels on screen. On iOS, the WebView is quite modern and performant and many apps should run fine. For Android Legacy WebView, its hit and miss. But there is hope...
Excitingly, a significant portion of our recent work on cordova-android has been on bundling a tip-of-tree chromium based “webview” alongside your app, thanks to the Intel Crosswalk project. This would mean you ship your app to the Play Store together with your very own modern build of Chromium webview. Best yet, it will work all the way back to Android 4.0. Expect announcements on how to try it yourself in the next month or so!
Finally, while there are some downsides, it's important to note the benefits of our approach:
By running as a real Android/iOS hybrid app, you can write your own cordova plugins to run native Android/iOS code to augment your application should you find the need to do so.
Your app distributes using the app store, with user reviews, auto-updates, and monetization.
Your app has an icon on the users' home screen, and is in the app switcher, etc.
Most importantly: You don't have to wait for the future! Get started today using cca, and run your Chrome Apps on iOS and Android using the webviews currently available, and soon to be improved.
NO on android 4.3-, Mobile chrome apps run in the standard Browser, not in Chrome. The chrome part in the name can be considered either a lie or just referring to the part that it supports a few API's that are supported by real Chrome Apps as well.
Yes, but NO on android 4.4+, as the standard android.webkit.WebView has been updated to Chrome 30, but will at least for the moment NOT get the same updates as Chrome and thus end up in the same situation as now where Chrome will run applications differently from the android.webkit.WebView again. Technically the answer is still yes to the question: 'Does it run in chrome', but for all practical means the answer is a clear no (as we're at version 34-36 already now).
This can be found out by either investigating the User Agent or checking for specific support for certain functions. For the user agent mobile chrome apps will return something along the lines of
Mozilla/5.0 (Linux; U; Android 4.2.2; en-gb; ZP998 Build/JDQ39) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
And chrome will return
Mozilla/5.0 (Linux; Android 4.2.2; ZP998 Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.114 Mobile Safari/537.36
And the browser
Mozilla/5.0 (Linux; U; Android 4.2.2; en-gb; ZP998 Build/JDQ39) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
The expected behaviour of the mobile Chrome apps should have been that the Chrome browser itself would expose an API which they would have used, but instead they really did nothing more than fork cordova and be done with it. On iOS this would have made sense, as that's how the 'Chrome' browser works there as well, but in both cases it should run the same code as Chrome which at the moment of speaking it does not.
The Chrome Apps platform defines a set of APIs and a runtime model to make it easy to use web technology to write apps that have native capabilities. You write an app that runs on that platform, and we (the Chrome team at Google) implement the platform on different host architectures. It's "Chrome" in the sense that the Chrome browser, Chromecast, ChromeOS, and Chromebooks are all under the Chrome brand. Chrome does not necessarily mean Chrome web browser.
Yes, on desktop, the Chrome browser happens to be the same executable that implements the Chrome Apps runtime. But to the greatest extent possible, we try to make that just a detail of implementation. A user can use Firefox or Internet Explorer as their default web browser, and never use the Chrome browser, but still use Chrome Apps.
As David Mulder says, Cordova apps (Mobile Chrome Apps) don't use the Chrome browser as their runtime on either iOS or Android. Each Cordova app is its own executable. But where possible, they'll use the Chrome Webview component, so that the inevitable compatibility nits among different webviews are minimized for a given Chrome App.
Mulder's answer makes no sense to me, and I have no idea what he means when it refers to the user agent. What Cordova does for Chrome Apps is provide the same Chrome App APIs (not all are implemented yet) on Android and iOS, but the resulting app is a native Android or iOS app, which has nothing whatsoever to do with any browser, just as all other Android or iOS apps do not.
In short, the answer is "no."
(The technology does not allow a Chrome App to run on Andoid or iOS. Rather, given the source code of that app, you can build it for those platforms, resulting in a new binary, native app.)
I know both use the same webkit version (537.36) and both use the same javascript engine (V8), but are there any other major differences between them?
I have a webapp with automated tests for desktop Chrome but nothing for Chrome on Android. I'm trying to decide if I know it works on desktop Chrome do I need to go through the trouble of testing it on Chrome on Android, or are they similar enough that I should have confidence it works on both.
Thanks!
Main difference is that Android don't have Flash because of the HTML5 implementation, and also there's a lot of different screen sizes and users don't like to zoom in and out a pan and zoom again, so the best you can do is to create a web designed for mobile devices.
On the other hand, if your site is mainly HTML and Javascript, will work 100% on mobile Chrome. I have a HTML5 game and works equal in desktop and mobile.
Also, you can download the Android SDK and test your site in a bunch of different Android versions and screen sizes with the AVD, is like an official Android emulator.
I want to test android mobile based pages on browsers like chrome or mozilla. Is there any plugins available so I can directly test them on these browsers without running them on device or emulator?
I created this chrome extension to help test. It's not a perfect replacement for actual device testing, but it's a start.
https://chrome.google.com/webstore/detail/mobile-tester/elmekokodcohlommfikpmojheggnbelo?utm_source=chrome-ntp-icon
This site shows you one possible way to do it.
http://techie-buzz.com/tips-and-tricks/emulate-mobile-browser-in-firefox.html
Once you have your user agent set you can just resize the window to be phone screen sized.
On Mozilla Firefox, you can use Selenium IDE to emulate clicks, typing and other actions. Personally, I have never tested it for mobile web applications.
http://seleniumhq.org/