Android Browser Diff

Compare android browsers' screens locally

Actor that compares Android screens of the specified page in different browsers. Based on idea of Multi Resolution Website Screenshot Tool. It is supposed to be used locally* on a Linux/Unix workstation.

The URL of the web page is passed in via input, which is defined by the input schema. Data are stored in screenshots folder. Screenshots are cropped, compared and stored with ImageMagick and PixelMatch libraries.

Included features

• Input schema - define and easily validate a schema for your Actor's input.

How it works

See section Pull the Actor for local run/development first.

1. Specify width and height dimensions.env file. A sample one is provided.
2. An init.sh script is provided for Brave and Chrome browser, generates screenshots folder structure with env files (commented in Dockerfile by default).
3. Specify url in an argument for local apify client, like:

   $"https://example.com"
   

in input_schema.json. 4. Connect your Android device. Set USB mode to File Transfer (MTP) or PTP instead of "Charging only". Authorize the device for development, and authorize the keys when the actor is run first with the given device later in point 5.

5. Unfortunately, I've been unable to run the actor through apify-cli tool, so running through docker/podman is needed.

6. Build the actor

   $docker build -t android-browser-diff .
   

7. Run the actor.

   $docker run -v /dev:/dev -v `pwd`/screenshots:/app/screenshots --device /dev/bus/usb:/dev/bus/usb --privileged --group-add keep-groups adbd "https://example.com"
   

8. Result screenshots in webp format should be in respective browser folders in screenshot folder, together with webp. Last frame of webp is the lastly made screenshot. In diff folder, a difference screenshot is made with pixelmatch.

Resources

Multi Resolution Website Screenshot Tool Image Difference Generator pixelmatch ImageMagick ADB

Getting started

For complete information see this article. In short, you will:

1. Build the Actor
2. Run the Actor

Pull the Actor for local run/development

If you would like to run/develop locally, you can pull the existing Actor from Apify console using Apify CLI:

1. Install apify-cli

   Using Homebrew

   $brew install apify-cli
   

   Using NPM

   $npm -g install apify-cli
   

2. Pull the Actor by its unique <ActorId>, which is one of the following:

   • unique name of the Actor to pull (e.g. "apify/hello-world")
   • or ID of the Actor to pull (e.g. "E2jjCZBezvAZnX8Rb")

   You can find both by clicking on the Actor title at the top of the page, which will open a modal containing both Actor unique name and Actor ID.

   This command will copy the Actor into the current directory on your local machine.

   $apify pull <ActorId>
   

Documentation reference

To learn more about Apify and Actors, take a look at the following resources:

• Apify SDK for JavaScript documentation
• Apify SDK for Python documentation
• Apify Platform documentation
• Join our developer community on Discord