pCloudy Plugin for Cordova

Prashanth M Nair
By Prashanth M Nair
April 25, 2018
4 min Read
Share This Article
pCloudy Plugin for Cordova

Cordova

Cordova is an open source mobile app development framework which helps build cross-platform mobile applications that are highly scalable and agile. The use of common scripting languages such as CSS, HTML and JavaScript assists in developing a simple and organized Cordova framework, which makes it a popular framework among app developers.

Cordova Archtecture

Advantages

Let’s have a look at some of the advantages of creating apps on Cordova :

  • It is a hybrid script framework which uses standard web API’s for all well known operating platforms.
  • The Cordova application developers only need to know web development using HTML5, CSS3 and JavaScript.Cordova takes over the rest of the work to be done.
  • Using Cordova, a developer can create applications for operating systems like iOS, Android, BlackBerry and Windows Phone. The Cordova developer need not be an expert of either of the above mentioned operating system.
  • Cordova has edge over the others simply due to the coverage of the framework.

The Cordova project consists of three main things—a command line tool, access to hardware features, and the ability to support future features.

Need for Cordova plugin in pCloudy

pCloudy being a unified mobile app testing platform is used both by developers and testers. pCloudy offers DeviceTunnel feature for developers to connect to a real device on cloud and use the device as if it’s connected to their local USB. Currently the DeviceTunnel is possible through Android Studio/Eclipse and XCode plugins. Although developers could create builds perfectly using any of the IDEs on the platform, Cordova developers looked for a seamless way of creating apps on a command line tool.

As mentioned earlier, Cordova is a popular open source app development framework among developers and there was a need of command line DeviceTunnel Interface to pCloudy so that developers could build their Android or iOS apps and put it to test on a real device on pCloudy. Now, pCloudy real devices on cloud can be accessed by running few commands on the command line interface.

Let’s see how this works with Cordova.

Note: pCloudy command Line DeviceTunnel Interface is only available for Android devices on Public cloud. It is available for both Android and iOS on private and on-premise cloud.

Pre-requisites

  • JDK 8 and above.
  • android-sdk latest version.

Jar download path

http://pcloudy-content-distribution.s3.amazonaws.com/index.html?prefix=Android%20Device%20Tunnel/

This will be a one-time activity and need not be repeated again.

Steps to Run the Jar

Step 1: Run the DeviceTunnel jar by passing the cloud url, user name and api key

Example: java –jar pCloudy_DeviceTunnel.jar https://device.pcloudy.com test@pcloudy.com skdflj4tlko46lsa

Note: Mention the device tunnel jar path where you store the downloaded pCloudyDeviceTunnel.jar

Example: Here, the jar is saved in desktop so the path would be like

java –jar /Desktop/pCloudy_DeviceTunnel.jar https://device.pcloudy.com test@pcloudy.com skdflj4tlko46lsa

Cordova Plugins

Step 2: It will display a list of available devices in that cloud. Select any one device by mentioning the device number and press enter.

selct-any-device-press-enter

samsung grand quattro

Step 3: Enter the duration (in minutes) for which you want to book the device, then press enter.

enter id

Step 4: Selected device gets connected to your system.

get connected to your system

Step 5: Open another terminal and check if the device is connected or not

open another terminal

If the device list shows as unauthorized then copy the url displayed by the jar and paste it in the browser.

Device List

connect to a device

Step 6: Click on ok option on the device and check device list again in terminal.

Ok Option

Ok Option

Now device is connected to your system. You can use this device like a local device.

Now use the connected device in Cordova app Debugging. Build the cordova app for android.

run cordova android

Step 7: Cordova build process

cordova build process

Deploying to device

Step 8: After the successful build, check if the app gets installed on pcloudy device which you had connected to your system.

After Successful Build

Cordova app is installed on pcloudy device.

Step 9: You can debug this through chrome debugger.

Chrome Debugger

DevTools

pcloudy-devtools

Note: If you want to exit from the device tunnel jar, please type ‘EXIT/exit’.

exit

Conclusion

No matter if you are a developer or a tester, just sign up on pCloudy to make the most of your app testing.

Prashanth M Nair
Prashanth M Nair

Prashanth is an avid technologist. He has in the past worked in companies like Nokia, Accenture, and Harman. Devops is his latest passion. When he is not working, you would find him reading Tolkien or Martin. He now heads Engineering at pCloudy.

Related Articles

October 23, 2020
Understanding Bamboo integration for CI/CD Pipeline

There are nearly 23.9 million software developers who code and build programs for businesses and enterprises that look to providing solutions for a better living. This means that there are millions of lines of program code being written this very…

Learn More Arrow

October 19, 2020
Hustler's Mantra: Adopt an experimental Mindset

"The very basis of creative work is irreverence. The very basis of creative work is bold experimentation. There has never been a creator of lasting importance who has not also been an innovator"– Eric Temple Bell Most of us are…

Learn More Arrow

October 19, 2020
iPhone 12 Launch, Features and Updates

The number of active users from last year released by apple showed that there are close to 1.4 billion people in the world that use an iPhone. The number is only growing and adding more revenue to innovate and come…

Learn More Arrow

Welcome to pCloudy 5.0

Avinash
By Avinash
February 20, 2018
4 min Read
Share This Article
Welcome to pCloudy 5.0

pCloudy 5.0

pCloudy is a unified mobile app testing platform which is trusted by its users for its excellent performance. We have more than 30,000 users across the globe, and we have received an overwhelming response for our platform. From bot testing to crowd testing, pCloudy has always been a front runner in the market. And with the launch of pCloudy 5.0, we are up for the challenge once again. It is a re-imagined and re-worked upon platform created in-line with intelligence to meet the market demands and accelerate delivery.

Let us have a look at what’s new here:

Features

a. iOS Connect
b. Automation Studio
c. Follow Me

a) iOS Connect: One of the very powerful features that we added is the iOS Connect. The major challenge iOS developers had been facing was the debugging of their iOS apps because of the difficult Apple guidelines regarding building any utility . We are proud to say that we have been successful in cracking that.
With iOS Connect, you can connect to an iOS Device which is present remotely and access the device as if the device is connected to your computer. With iOS Connect we are bridging the gap for the iOS development life cycle.

iOS Connect

b) Automation Studio: It is another promising feature that can revolutionize mobile app automation. We now have an in-built automation studio in pCloudy platform where you can access the devices to record your test scripts and execute it in parallel on multiple devices without writing any code.

There’s something more to it! If you already have your projects on Appium you can record your new workflows and export it to Appium Java format. This new integration would not only enable every user to start creating Automation scripts but it will also help Appium users to speed up their Automation. This makes pCloudy truly a Unified app testing platform.

Automation Studio Launch

c) Follow me: It is again one of the ‘wow’ features of pCloudy 5.0. This feature can speed up your App Testing exponentially. Follow me allows you to test your apps on 3 unique device while performing your test on only 1 device, thus saving your testing time multi-folds.

Follow Me

Re-Imagined UI

It has been designed to give a leaner, simpler and faster user experience. The look and feel of the pCloudy platform has been transformed keeping in mind the requirements, usability and ease of our users. All the pages have been made more intuitive. To simplify, we have grouped the actions together to save your time in figuring out the next step.

a. True Collaboration
b. Global File Storage
c. Comprehensive reports at a single stop
d. Test Scheduler

a) True Collaboration: We have introduced a powerful feature on our revamped Device Interaction page. Now, you can take the screenshot of the action you are performing and see the screenshot next to the device. But, the icing on the cake is that you can edit the screenshot, save it and log a bug directly to the JIRA enabling true collaboration between the developers and testers.

UI Design

b) Global File Storage: Heeding to the demands of our users we have reduced the clicks to perform any action on the File browsing /storage page. The file uploaded once will be available across all the different locations we have. It will also allow sharing of files across teams.

Global File Storage

c) Comprehensive reports at a single stop: Now, to make the user experience simpler and faster, we have placed all your reports at single stop be it manual or automation across all locations. Not just that, you can see all reports in the same format with much detailed information. Raising bugs after analyzing reports is also possible from here.

comprehensive-reports-at-a-single-stop

d) Test Scheduler: We have re-designed this page based on a Guided interface where the interactions are more thoughtful, straightforward, and guide you to the next step. It needs zero learning to run automation scripts on multiple devices.

Test Scheduler

pCloudy 5.0 is another breakthrough for us. After launching pCloudy 5.0, it is time to get feedback on a larger scale. We’re going to continue improving the UI, the navigation, and add some futuristic features to make your app testing simpler and faster. While we do that, we’d love to continue getting feedback.

Avinash
Avinash

Avinash Tiwari is a thought leader, a recognized keynote speaker, and the co-founder of pCloudy.com. He has 15+ experience in Product development and Testing. He brings with him a passion for emerging technology and quick adoption, both of which have solidified his reputation as a leader in the mobile app testing field.

Related Articles

April 28, 2020
Test Local And Internal Servers Before Deployment Using Wildnet

Some testing teams set up their own staging environment to test internal servers but as there is no public access which makes it difficult to perform local testing on remote devices. So how would you test your app which can…

Learn More Arrow

April 19, 2020
What’s New In pCloudy 5.6?

pCloudy is committed to delivering the best solutions in mobile app testing and therefore we come up with product updates at regular intervals. This time we are thrilled to announce the release of pCloudy 5.6 with exciting new features to…

Learn More Arrow

March 17, 2020
Ensure Continuous Productivity By Leveraging Remote Devices For Mobile App Testing

Remote working is going to be a new normal and remote access tools and platforms will play a key role in maintaining productivity. Working from home has many advantages both for enterprises and teams. There are many tools that help…

Learn More Arrow

Beginners Guide to Mobile Web Debugging on Real Devices Using Chrome DevTools

Avinash
By Avinash
August 17, 2016
5 min Read
Share This Article
Beginners Guide to Mobile Web Debugging on Real Devices Using Chrome DevTools

Chrome Developer Tools

Introduction

Testing a Mobile Web App can get knotty, especially when there are issues like obfuscated HTML/CSS/javascript code, improperly implemented HTTPS, browser inconsistencies, page load performance and so on. Moreover, few things like can be extremely agonizing while striving to support as wide a range of mobile devices as possible. So how do you overcome these issues? Using a Web Developer Tools or debugging extensions make debugging your web application easier. Here we’ll talk about the most popular one – the open source Google Chrome Developer Tools.

The Google Chrome Developer Tools is a consolidated environment built into Google Chrome Browser. It is used for web authoring, debugging, monitoring, optimizing, and understanding web applications or websites. (Sourced from Google Chrome DevTools)

Here are some of the key Chrome DevTools features

  • Inspect and edit the DOM and CSS of your website in real-time
  • Run code snippets from any page
  • Debug Obfuscated code
  • Set advanced breakpoints and debug JavaScript using graphical debugger
  • Troubleshoot Security issues
  • Analyze run-time and page performance to improve the speed of your app
  • Trace reflows and repaints as your app loads

The Chrome DevTools provides almost all the gears required to inspect, debug and monitor the performance of a Web App/mobile web. It also provides additional capabilities to simulate Mobile Devices to test and build mobile-first, responsive web sites. You can even debug web content on a real Android Device from a development machine. But, is it enough to test your Web App on just one or two devices?

Remote debugging using Chrome DevTools in integration with pCloudy’s Mobile Device Lab

Device fragmentation is a very real problem when testing Web apps on real devices, particularly for UI and functional tests. The number of devices with unique specifications and proprietary build variations has increased. At an advanced level, to fully test your Web App’s responsiveness and performance on real devices you will need to experiment your site on various platforms, across a number of device form factors. pCloudy’s Mobile Device Lab offers complete integration with Chrome DevTools to test your apps on real devices. This integration allows you to test Web Apps on a myriad of android devices with different sizes and configurations.

Here’s how most App developers test their Web Apps

Inspect and live edit your site’s design and content

Test and edit your site in live mode by inspecting all the HTML and CSS in your page. In the Elements Panel, you can live-edit a DOM node by simply double-clicking a selected element and making changes.

Chrome Developer Tools

You can even live-edit style property names and values in the Styles pane. Examine and edit box model parameters.

Live-Edit_Styles

It is also possible to edit the current element’s box model parameters by making changes to top, bottom, left, right values for the current element’s padding, border, and margin properties using the Computed pane.

Box_Parameters

Remote Debugging on real devices to fix errors in the code

Debugging Obfuscated Code: Make your code readable and easy to debug even after you’ve combined, minified or compiled it. You can easily change the formatting of your minimized code by clicking on { }.
Debug-Obfuscated

Test the and optimize the performance of the Web App

The Network Panel allows you to see how your page renders, and time taken to render from start to end. To do this click into the “Network” panel, click on the camera icon and refresh the page on the device.

Chrome Dev Tools

The Timeline panel helps you to record and analyze all the activities in your application as it runs. It’s the best place to start investigating perceived performance issues in your application.

To make a recording of a page load, open the Timeline panel, open the page that you want to record, and then reload the page. The Timeline panel automatically records the page reload. You can also record page interactions on the page and view the performance details through the recorded timeline.

Here are some more details you can view using the Record Timeline

  • Record the Timeline to analyze every event that occurred after a page load or a user interaction
  • View FPS, CPU, and network requests in the Overview pane
  • Click on an event within the Flame Chart to view details about it
  • Zoom in on a section of a recording to make analysis easier

Timeline

Conclusion

“Using the right tools for the right job” is an old aphorism that applies to all domains including Software Development. As we’ve seen, Chrome Developer Tools has several features that helps you develop better, debug faster, and measure efficiently the performance of your website or application. The features discussed here are some of the most common ones used by developers, designers and testers to write, debug, monitor and optimize Websites and Web Apps. Using these features in integration with Mobile Device Lab like pCloudy can transmogrify the entire process of creating, testing and launching Websites and Web Apps.

Avinash
Avinash

Avinash Tiwari is a thought leader, a recognized keynote speaker, and the co-founder of pCloudy.com. He has 15+ experience in Product development and Testing. He brings with him a passion for emerging technology and quick adoption, both of which have solidified his reputation as a leader in the mobile app testing field.

Related Articles

May 2, 2019
Mobile Responsive Testing and Debugging on Real Devices

Emulators vs Real Devices   Mobile Responsive Test across range of Mobile Devices and platforms is extremely important for superior User Experience. However, Mobile Responsive Test and debugging can get knotty, especially when there are issues like obfuscated HTML/CSS/javascript code,…

Learn More Arrow

September 20, 2017
Explore Full Power of pCloudy Platform – Improve Quality, Speed and Efficiency

Explore Full Power of pCloudy   pCloudy understands that businesses need their apps to be rolled out faster than before, without bugs, crashes, functionality issues, UI glitches, memory drainage and well, everything wrong with every app you uninstalled on your…

Learn More Arrow

October 19, 2016
New Devices Added Recently on Our Platform

Latest Devices   HTC 828 HTC Desire 10 Life Style HTC Desire 820S HTC Desire 825 HTC One X9 ITEL IT 1512 Lava X81 Lenovo Vibe P1 Turbo Micromax Canvas 6 Micromax Canvas Fire 4G Bleu WI 208 Blu Studio…

Learn More Arrow

Experience pCloudy Today

Tickmark No Credit Card Required
Tickmark Exceptional Security

Copyright All Rights Reserved © 2020