Is it possible to test Responsive Web Design application with Sahi? - responsive-design

I'm testing a Responsive Web Design application now. I'm doing Manual testing on Firefox, Chrome and IE using Web Developer Tool.
I like to automate the testing. Is it possible to automate Responsive Web Design with Sahi?

If you dont need some visual confirmation, you can simply test with phantomjs. Have a look at http://sahi.co.in/w/sahi-headless-execution-with-phantomjs and add the line "page.viewportSize = { width: 1000, height: 1000 };" to your sahi.js to execute phantomjs. You can set the width and height to any value you want.
To improve this, create different phantomjs scripts with different viewport sizes and add multiple phantomjs launcher in your browsers.xml. Like phantomjsMobile, phantomjsTablet ...
If you need to see the results, not just test their functionality, taking screenshots with phantomjs is also possible. https://github.com/ariya/phantomjs/wiki/Screen-Capture

Sahi_Pro V5.0 released with additional functionality to test Responsive Web Design application.
Download Sahi_Pro V5.0 from the following page:
http://sahi.co.in/downloads-archive/

Related

Web Test framework for Mobile as well as Server browsers

Is there any framework available where I can write single set of test code for both Server browsers as well as Mobile browsers.
eg. test.py runs with Chrome on Android as well as Windows
I am planning to use browserstack for my testing until I figure out the infrastructure handling is possible with browserstack or not.
Please help me figure out a way for deciding over the infrastructure as well.
You can try TestCafe. It's an open source project.
TestCafe allows to run tests on desktop and mobile browsers without any additional installations and plugins.
Here you can see how easy to run tests on a mobile phone with TestCafe: https://twitter.com/DXTestCafe/status/804368394569052160.
Also it's easy to setup testing on mobile browsers in a cloud service (like BrowserStack or Saucelabs). For example you can find the "testcafe-browser-provider-saucelabs" plugin on GitHub to run tests on Saucelabs out-of-the box.
Selenium + Appium should be able to cover what you need to be done. To share code however, you'll need use a mobile browser (Chrome or Safari) or have an app that uses webviews that are the same as the browser version.
The Selenium bindings will handle driving the automation for the browsers. By itself, you could test the desktop browser with a normal size screen, as well as a mobile size, and test various browsers as well (Chrome, Firefox, etc).
Appium will allow you to open the browser (or app) on the mobile device or simulator, and if the web view is the same as the browser, the same locator strategies you used with the desktop browsers and Selenium will work with Appium as well (Appium extends the Selenium spec with browser capabilities).
If you code the framework using the Selenium Grid, you can then almost drop replace a remote managed grid setup (via Saucelabs or Browserstack) to run the browsers for you (otherwise you'd need to setup a local grid or run the tests with a local Selenium server set up)
All this is quite possible
framework available where I can write single set of test code for both Server browsers as well as Mobile browsers
We have build it in our company, since we have a vast diversity of different platforms and browsers to support.
We use combination of Selenium based frameworks on NodeJS
webdriverIO
cucumberJS
appium
... etc.
The main concept we try to follow is JAVA's WORA. To achieve all this you need a good understanding of DSLs, Application driver layer and design patterns (e.g. Strategy).
It is not that hard to put all this together, since Selenium supports pretty much every binding you need. Just pick the language you are most comfortable with and use it.

How to automate a Silverlight based web application using selenium?

I am trying to automate a web application using selenium, however that application is developed using Silverlight. Hence, i am not able to inspect the elements in the web page. Could anyone please suggest on how to tackle this problem?
Out of the box, selenium won't natively support testing a Silverlight-based web app. There is https://code.google.com/archive/p/silverlight-selenium/, but it doesn't look like that project is currently being maintained. Beyond that, Silverlight itself is not longer under development, and it won't run on recent versions of Chrome or Edge (or Android or iOS).

Testing framework for ionic angular cordova app real devices with continuous integration?

Our team is starting a project and we would like to have an automated testing server that tests our app on real devices, instead of emulators or just browser.
Its an Ionic framework app, so Cordova+AngularJS.
I am going to research this and give the best answer I have, but in the meantime if anyone is familiar with it, I'd love to hear all about it!
I'm interested on that point too.
For instance, I manage to code very few tests with APPIUM but seems to do the job for tests using Selenium webserver
Looking forward for other user feedback
The intel xkd provides on device testing via the intel xkd preview app and on device debugging via the adb with debugger. Also comes with build services for android, ios, windows, tizen, amazon, nook, webapp, chrome, facebook, and firefox. This is the easiest way I have found for testing on device to make sure Cordova plug ins work and to get live JavaScript debugging. https://software.intel.com/en-us/intel-xdk
Another option is to run the ionic app in phantomjs and run integration tests using your server-side framework. This allows you to quite easily test across the entire stack. Theres a blog post about how to do it with rails at http://www.dovetaildigital.io/blog/2015/10/28/rails-and-ionic-make-love-part-three

how to build a mobile website using html on ubuntu 12.04

I'm working on a simple mobile website for a hotel.they don't need much dynamic feature.most are simple HTML.So my question are as below.
I find it's hard to debug mobile website on Ubuntu.cause you know ,desktop browser are to big to show a mobile website.each time i need to put it on a server.then using a phone to test the mobile website.is't too annoy.is there a better way to do this?
On windows u have Dreamweaver to change the css style.but on Ubuntu can I find a tool like Dreamweaver?
is any any JavaScript code for animation for a mobile website.
Jquery mobile is a good js lib to create the basic element in webpages.but if I want to do some transition between pictures.how could I do that.
PS:if you want to use php to send a email to a email address how to do that?
In chrome you can emulate a mobile device, the viewport and user agent will adjust to desired device. In your developer tools you have something called Emulation where you can change your device.
Link!
To send a email with PHP, check the documentation:
Link to php docs
FWIW, I would reccomend you start with a resposive framework. There are plenty of great options, including Bootstrap , Foundation or Skeleton
From what you describe about your requirements, responsive is going to be a good fit for your client and you'll future-proof your design.
Then with a responsive design, you can test everything in a standard web browser by making the viewport or window wider or smaller.
Good luck!

What are the drawbacks when using Ionic Framework or OnsenUI only as hosted webapp

We plan to create a hosted web app with AngularJS. As UI Framework we found Ionic and Onsen to work well with AngularJS. Both of this frameworks promote that they are made particularly for Hybrid Apps. But us I understand correctly, both frameworks are based on web technologies. So what are the drawbacks when using the suggested UI frameworks for non Hybrid Apps? Is it mainly the Browser support?
Thanks
Well, both Ionic and Onsen are made particularly for Hybrid Mobile Apps. You just won't be able to use it even for tablet apps without customization (If I am wrong, please correct me) just because they target the limited viewport and incorporate phone UX patterns.
Also, they are made with PhoneGap in mind (the apps will be hosted in the WebView component), and addresses some common WebView problems, e.g GPU acceleration for better performance.
If you need just some UI framework for a simple Web App you'd better have a look at Twitter Boostrap or Zurb Foundation. For a complex case you may even consider Sencha instead of Angular.
There is a part of Ionic that expects the Cordova/PhoneGap Device plugin to be installed. It helps with displaying on Android and iOS appropriately, as well as increasing the size of header bars for iOS 7. That wont be an issue for web though, since you'll have the browser's "chrome" taking up that space.
You may loose some of the buttery smoothness in things like page transitions because the template files need to travel over a (often cellular) connection to the internet, but your app will most certainly work if built with Ionic or Onses over the web.
Things changed considerably over last few months.
Both frameworks now support splitview so they can be used for tablet devices. Subjectively Onsen UI has a better support (it is much more configurable), but Ionic is also not bad. This can translate to smaller desktop browsers screens.
You should also consider that Onsen UI has a dedicated desktop browsers support (all web-kit browsers). Ionic framework will also work on desktop browsers, but it was not fully tested or optimized for such environment.
Biggest problem here is that both frameworks were never meant to be used on larger screens. They look oversized and bloated. If you ever worked with jQuery Mobile (on desktop browsers) you will understand this problem.
There is nothing stopping you from doing that - it might even be a smart approach for a mobile first design approach. The advantage is that you could rapidly iterate an idea an then invest in a native or platform specific app depending on user feedback/metrics.
The main drawback would be the user expectations for your UI and application logic which are different for a web page and a native app. For example the back button will be duplicated in the browser and in your header. You could use some platform specific CSS or configurations to hide it. Then there is your application state and user data - will you save it in local storage, session or database? This depends on your app and best judgement.
There will be some browser issues which may not be addressed in the core of Ionic and Onsen because they are not targeted to work with IE6/7 (see angular browser support), for example, but you can resolve those by having a graded browser support policy.

Resources