DEV Community

Cover image for Cross-device Testing of Web Applications with Blisk
Andrew Malrowe
Andrew Malrowe

Posted on • Originally published at geeksforgeeks.org

Cross-device Testing of Web Applications with Blisk

This article will educate you all about Blisk (https://blisk.io). Blisk is a Chromium-based web browser that improves productivity and code quality by providing a wide array of tools for web development and testing. The main feature of this application is that it offers virtual mobiles, tablets, laptops, and desktops for web development and testing purposes.

Blisk offers two types of licenses: free license with daily limited usage and paid license with unlimited usage. After installing Blisk you get two weeks of free unlimited testing.

In this tutorial, we will work with the GeeksforGeeks website as an example. You can use your own website at any stage: localhost/staging/production.

Step-by-step guide:

Step 1:

Install Blisk application — Blisk is available for Windows, macOS, and Linux (Ubuntu, Debian, Fedora, OpenSUSE). Download Blisk from the official website: https://blisk.io and install it.
Download Blisk

Step 2:

Create a Blisk account — Creating an account is optional but recommended. Blisk account allows using extra features (screenshots and screen recorder, cloud storage) and adds an extra week of the unlimited usage of all features for free.
Create Blisk account

Step 3:

Open a website that you will work with

  1. Paste a Url https://www.geeksforgeeks.org/ into the address bar and navigate to this website.
  2. Click the button Toggle Developer Mode (see screenshot below). Launch Developer Mode in Blisk

Step 4:

Select the devices - Blisk launches Device Manager where you can select the devices. You can select different types of devices: mobiles, tablets, laptops, and desktops. In addition, Blisk offers a Chrome-like view that represents a regular web view, just like any tab in your browser. Depending on your needs, you can mix different devices to use them simultaneously.

In this tutorial, we will select iPhone 12 Mini and Chrome-like view to check how GeekforGeeks works in regular browsers compared to mobile. Click the button Launch Devices when your device set is ready.
Launch Devices in Blisk

Step 5:

Browse in Developer Mode - Blisk launches the device set with previously selected devices, and now we can perform checks on mobile and desktop simultaneously. Let’s scroll down and browse across the GeekforGeeks website. You will notice that scrolls are synced from mobile to desktop which helps to browse faster and compare two views visually.
Next, let’s open any article to check how it behaves. When navigating to any URL, you will notice that the device and desktop follow each other by URL.

Step 6:

Perform checks - Now, you can check whatever you need. In addition, you can:

  • Test portrait vs landscape orientation.
  • Check JavaScript errors that appear in each device.
  • Simulate slow connection.
  • Use DevTools for each device independently.
  • Switch to another device.
  • Check dark theme.
  • Take screenshots of issues.
  • Record a video with the steps to reproduce the issue.
  • Save screenshots and videos to the cloud storage.

Conclusion:

This application was created for web developers and QA engineers. You can use Blisk in your daily work to create web applications and test them across multiple devices simultaneously to speed up your productivity and deliver high-quality products to your customers faster than before.

Top comments (1)

Collapse
 
sivakrishna739 profile image
Siva Krishna

As omnichannel presence becomes a given for many customers, compatibility testing of any mobile app across devices become imperative for ensuring seamless experience. bit.ly/3HjNXqY